CODEWITHSUNDEEP
reactjscordovacapacitorionic-react
elvis_ferns
elvis_ferns

Reputation: 524

InAppBrowser not opening in Ionic React App

import { InAppBrowser } from '@ionic-native/in-app-browser';

useEffect(() => {
  const browser = InAppBrowser.create('https://ionicframework.com', '_blank');
}, [//deps])

I cannot use the Browser plugin of capacitor as I need to execute a few line of code in the InAppBrowser.

As per the Ionic Docs, it says they support Cordova plugins, but this does not do anything.

I am new to Ionic, am I missing something??

Upvotes: 0

Views: 1675

Answers (2)

ArnabXD
ArnabXD

Reputation: 519

You just need browser.show() to open the window . Execute scripts first then show it , Going through the docs you can use Options to configure the view little bit . I couldn't find a way to use InAppBrowser as React Component or something like that , .

import React from 'react';
import { IonPage, IonButton } from '@ionic/react';
import { InAppBrowser,InAppBrowserOptions } from '@ionic-native/in-app-browser';

const Browser: React.FC = () => {

    const options:InAppBrowserOptions = {
        location: 'no',
        zoom: 'no',
        hideurlbar: 'yes',
        toolbarposition: 'bottom'
    } 

    const openBrowser = (url: string) => {
        const browser = InAppBrowser.create(url,'_self',options);
        // browser.executeScript(your script) // Docs aren't clear to me and i haven't tested
        browser.show()
    }

    return (
        <IonPage>
            <IonButton onClick={()=> openBrowser('https://google.com')}>Open InAppBrowser</IonButton>
        </IonPage>
    );
};

Upvotes: 1

scriobh
scriobh

Reputation: 890

InAppBrowser is a cordova plugin. I would recommend using Capacitor's plugin Browser

For this, you will need to import Browser plugin from Capacitor.

import { Plugins } from '@capacitor/core';

const { Browser } = Plugins;

...

<IonButton onClick={
  async() => await Browser.open({
    url: 'http://capacitorjs.com/'
  });
}>Open Browser</IonButton>

Upvotes: 3

Related Questions