Javascript required
Skip to content Skip to sidebar Skip to footer

Ionic Cannot Read Property 'inappbrowser' of Undefined


title: Inappbrowser description: Open an in-app browser window.

AppVeyor Travis CI
Build status Build Status

cordova-plugin-inappbrowser

Yous can show helpful manufactures, videos, and web resources inside of your app. Users tin view web pages without leaving your app.

To go a few ideas, check out the sample at the bottom of this folio or go direct to the reference content.

This plugin provides a web browser view that displays when calling cordova.InAppBrowser.open().

              var ref = cordova.InAppBrowser.open('http://apache.org', '_blank', 'location=yep');                          

window.open

The cordova.InAppBrowser.open() role is divers to be a drop-in replacement for the window.open() part. Existing window.open() calls can utilize the InAppBrowser window, by replacing window.open up:

              window.open up = cordova.InAppBrowser.open;                          

If y'all alter the browsers window.open part this manner, it can have unintended side effects (especially if this plugin is included only every bit a dependency of another plugin).

The InAppBrowser window behaves similar a standard spider web browser, and can't admission Cordova APIs. For this reason, the InAppBrowser is recommended if you demand to load tertiary-party (untrusted) content, instead of loading that into the primary Cordova webview. The InAppBrowser is not subject to the whitelist, nor is opening links in the organisation browser.

The InAppBrowser provides past default its ain GUI controls for the user (back, frontwards, done).

Installation

              cordova plugin add cordova-plugin-inappbrowser                          

If yous desire all page loads in your app to go through the InAppBrowser, you can merely hook window.open during initialization. For instance:

              certificate.addEventListener("deviceready", onDeviceReady, false); function onDeviceReady() {     window.open = cordova.InAppBrowser.open; }                          

Preferences

config.xml

  • InAppBrowserStatusBarStyle [iOS only]: (string, options 'lightcontent', 'darkcontent' or 'default'. Defaults to 'default') prepare text color style for iOS. 'lightcontent' is intended for use on dark backgrounds. 'darkcontent' is only available since iOS 13 and intended for use on low-cal backgrounds.
              <preference name="InAppBrowserStatusBarStyle" value="lightcontent" />                          

cordova.InAppBrowser.open

Opens a URL in a new InAppBrowser case, the current browser instance, or the system browser.

              var ref = cordova.InAppBrowser.open(url, target, options);                          
  • ref: Reference to the InAppBrowser window when the target is set to '_blank'. (InAppBrowser)

  • url: The URL to load (String). Phone call encodeURI() on this if the URL contains Unicode characters.

  • target: The target in which to load the URL, an optional parameter that defaults to _self. (String)

    • _self: Opens in the Cordova WebView if the URL is in the white list, otherwise information technology opens in the InAppBrowser.
    • _blank: Opens in the InAppBrowser.
    • _system: Opens in the organization's web browser.
  • options: Options for the InAppBrowser. Optional, defaulting to: location=yes. (Cord)

    The options string must non contain any blank space, and each feature's proper name/value pairs must be separated by a comma. Characteristic names are instance insensitive.

    All platforms support:

    • location: Prepare to yes or no to turn the InAppBrowser'south location bar on or off.

    Android supports these additional options:

    • hidden: set to yep to create the browser and load the page, merely not evidence it. The loadstop outcome fires when loading is consummate. Omit or set to no (default) to have the browser open and load unremarkably.
    • beforeload: set to enable the beforeload upshot to change which pages are really loaded in the browser. Accepted values are become to intercept but Become requests, mail to intercept on POST requests or yes to intercept both GET & Postal service requests. Note that POST requests are not currently supported and volition be ignored (if you set beforeload=mail service it will enhance an error).
    • clearcache: set to yep to take the browser'south cookie cache cleared earlier the new window is opened
    • clearsessioncache: set to yep to accept the session cookie cache cleared earlier the new window is opened
    • closebuttoncaption: set to a string to use as the close button's caption instead of a X. Note that you need to localize this value yourself.
    • closebuttoncolor: set to a valid hex color string, for example: #00ff00, and it will change the shut button color from default, regardless of being a text or default X. Merely has effect if user has location set to yep.
    • footer: prepare to yeah to show a close button in the footer similar to the iOS Done button. The close button will appear the aforementioned every bit for the header hence employ closebuttoncaption and closebuttoncolor to set its properties.
    • footercolor: set to a valid hex colour string, for case #00ff00 or #CC00ff00 (#aarrggbb) , and information technology will change the footer color from default. Only has effect if user has footer set to yes.
    • hardwareback: prepare to yep to use the hardware dorsum push to navigate backwards through the InAppBrowser's history. If there is no previous folio, the InAppBrowser will close. The default value is yep, so yous must set it to no if yous want the back button to simply close the InAppBrowser.
    • hidenavigationbuttons: gear up to yes to hide the navigation buttons on the location toolbar, only has effect if user has location ready to yep. The default value is no.
    • hideurlbar: prepare to yeah to hide the url bar on the location toolbar, only has result if user has location set to yep. The default value is no.
    • navigationbuttoncolor: gear up to a valid hex color string, for example: #00ff00, and information technology will modify the colour of both navigation buttons from default. But has effect if user has location set to yes and not hidenavigationbuttons set to yeah.
    • toolbarcolor: set to a valid hex color cord, for example: #00ff00, and it volition change the color the toolbar from default. Only has effect if user has location set to yes.
    • lefttoright: Set to yes to swap positions of the navigation buttons and the close push. Specifically, navigation buttons get to the right and close button to the left. Default value is no.
    • zoom: set to aye to show Android browser's zoom controls, set to no to hide them. Default value is yes.
    • mediaPlaybackRequiresUserAction: Set up to yes to prevent HTML5 audio or video from autoplaying (defaults to no).
    • shouldPauseOnSuspend: Ready to yes to make InAppBrowser WebView to pause/resume with the app to stop background audio (this may be required to avoid Google Play bug like described in CB-11013).
    • useWideViewPort: Sets whether the WebView should enable back up for the "viewport" HTML meta tag or should use a broad viewport. When the value of the setting is no, the layout width is e'er gear up to the width of the WebView control in device-independent (CSS) pixels. When the value is yes and the page contains the viewport meta tag, the value of the width specified in the tag is used. If the page does non contain the tag or does non provide a width, then a broad viewport will be used. (defaults to yeah).
    • fullscreen: Sets whether the InappBrowser WebView is displayed fullscreen or not. In fullscreen mode, the status bar is hidden. Default value is yes.

    iOS supports these boosted options:

    • hidden: fix to yes to create the browser and load the page, but not show information technology. The loadstop issue fires when loading is complete. Omit or gear up to no (default) to take the browser open and load normally.
    • beforeload: set to enable the beforeload consequence to modify which pages are actually loaded in the browser. Accepted values are get to intercept only Become requests, mail to intercept on Post requests or yeah to intercept both Get & Mail service requests. Notation that Post requests are not currently supported and will exist ignored (if y'all set up beforeload=mail it will raise an error).
    • clearcache: fix to yes to accept the browser's cookie cache cleared before the new window is opened
    • clearsessioncache: ready to yeah to have the session cookie enshroud cleared before the new window is opened. For WKWebView, requires iOS 11+ on target device.
    • cleardata: set up to yes to have the browser'due south entire local storage cleared (cookies, HTML5 local storage, IndexedDB, etc.) before the new window is opened
    • closebuttoncolor: set as a valid hex color cord, for example: #00ff00, to change from the default Done button'south color. Only applicable if toolbar is non disabled.
    • closebuttoncaption: gear up to a string to employ equally the Washed button'south caption. Annotation that you demand to localize this value yourself.
    • disallowoverscroll: Set to yes or no (default is no). Turns on/off the the bounce of the WKWebView'southward UIScrollView.
    • hidenavigationbuttons: prepare to yes or no to turn the toolbar navigation buttons on or off (defaults to no). Only applicative if toolbar is not disabled.
    • navigationbuttoncolor: fix as a valid hex color string, for case: #00ff00, to modify from the default color. Merely applicable if navigation buttons are visible.
    • toolbar: prepare to yep or no to plough the toolbar on or off for the InAppBrowser (defaults to yes)
    • toolbarcolor: set every bit a valid hex color string, for example: #00ff00, to change from the default color of the toolbar. Simply applicable if toolbar is non disabled.
    • toolbartranslucent: gear up to yep or no to make the toolbar translucent(semi-transparent) (defaults to yep). Only applicable if toolbar is not disabled.
    • lefttoright: Prepare to yes to swap positions of the navigation buttons and the close push. Specifically, close push goes to the right and navigation buttons to the left.
    • enableViewportScale: Prepare to yeah or no to prevent viewport scaling through a meta tag (defaults to no).
    • mediaPlaybackRequiresUserAction: Set to yeah to prevent HTML5 audio or video from autoplaying (defaults to no).
    • allowInlineMediaPlayback: Set to yep or no to allow in-line HTML5 media playback, displaying within the browser window rather than a device-specific playback interface. The HTML'southward video element must besides include the webkit-playsinline attribute (defaults to no).
    • presentationstyle: Set to pagesheet, formsheet or fullscreen to set the presentation style (defaults to fullscreen).
    • transitionstyle: Prepare to fliphorizontal, crossdissolve or coververtical to prepare the transition style (defaults to coververtical).
    • toolbarposition: Set to top or bottom (default is bottom). Causes the toolbar to exist at the acme or bottom of the window.
    • hidespinner: Set up to yeah or no to change the visibility of the loading indicator (defaults to no).

    Windows supports these boosted options:

    • hidden: fix to yep to create the browser and load the page, but not prove it. The loadstop issue fires when loading is complete. Omit or set to no (default) to have the browser open and load commonly.
    • hardwareback: works the same fashion as on Android platform.
    • fullscreen: gear up to yeah to create the browser control without a border around it. Delight note that if location=no is besides specified, there will exist no control presented to user to close IAB window.

Supported Platforms

  • Android
  • Browser
  • iOS
  • OSX
  • Windows

Example

              var ref = cordova.InAppBrowser.open('http://apache.org', '_blank', 'location=aye'); var ref2 = cordova.InAppBrowser.open(encodeURI('http://ja.m.wikipedia.org/wiki/ハングル'), '_blank', 'location=yeah');                          

OSX Quirks

At the moment the but supported target in OSX is _system.

_blank and _self targets are not yet implemented and are ignored silently. Pull requests and patches to go these to work are greatly appreciated.

iOS Quirks

Since the introduction of iPadOS thirteen, iPads try to adapt their content way / user amanuensis for the optimal browsing feel. This may result in iPads having their user agent set to Macintosh, making information technology hard to detect them equally mobile devices using user amanuensis string sniffing. You can change this with the PreferredContentMode preference in config.xml.

<preference                name=                  "PreferredContentMode"                                value=                  "mobile"                                />

The example to a higher place forces the user agent to contain iPad. The other pick is to apply the value desktop to turn the user agent to Macintosh.

Browser Quirks

  • Plugin is implemented via iframe,

  • Navigation history (dorsum and forwards buttons in LocationBar) is not implemented.

InAppBrowser

The object returned from a phone call to cordova.InAppBrowser.open when the target is set up to '_blank'.

Methods

  • addEventListener
  • removeEventListener
  • shut
  • show
  • hide
  • executeScript
  • insertCSS

InAppBrowser.addEventListener

Adds a listener for an upshot from the InAppBrowser. (Only bachelor when the target is set to '_blank')

              ref.addEventListener(eventname, callback);                          
  • ref: reference to the InAppBrowser window (InAppBrowser)

  • eventname: the upshot to listen for (String)

    • loadstart: event fires when the InAppBrowser starts to load a URL.
    • loadstop: result fires when the InAppBrowser finishes loading a URL.
    • loaderror: event fires when the InAppBrowser encounters an error when loading a URL.
    • leave: event fires when the InAppBrowser window is closed.
    • beforeload: upshot fires when the InAppBrowser decides whether to load an URL or non (only with option beforeload set).
    • bulletin: event fires when the InAppBrowser receives a message posted from the folio loaded inside the InAppBrowser Webview.
  • callback: the office that executes when the result fires. The office is passed an InAppBrowserEvent object as a parameter.

Example

                var                inAppBrowserRef                ;                function                showHelp                (                url                )                {                var                target                =                "_blank"                ;                var                options                =                "location=yeah,subconscious=yes,beforeload=yeah"                ;                inAppBrowserRef                =                cordova                .                InAppBrowser                .                open                (                url                ,                target                ,                options                )                ;                inAppBrowserRef                .                addEventListener                (                'loadstart'                ,                loadStartCallBack                )                ;                inAppBrowserRef                .                addEventListener                (                'loadstop'                ,                loadStopCallBack                )                ;                inAppBrowserRef                .                addEventListener                (                'loaderror'                ,                loadErrorCallBack                )                ;                inAppBrowserRef                .                addEventListener                (                'beforeload'                ,                beforeloadCallBack                )                ;                inAppBrowserRef                .                addEventListener                (                'message'                ,                messageCallBack                )                ;                }                function                loadStartCallBack                (                )                {                $                (                '#status-message'                )                .                text                (                "loading delight wait ..."                )                ;                }                function                loadStopCallBack                (                )                {                if                (                inAppBrowserRef                !=                undefined                )                {                inAppBrowserRef                .                insertCSS                (                {                code:                "body{font-size: 25px;}"                }                )                ;                inAppBrowserRef                .                executeScript                (                {                code:                "\                                  var message = 'this is the bulletin';\                                  var messageObj = {my_message: message};\                                  var stringifiedMessageObj = JSON.stringify(messageObj);\                                  webkit.messageHandlers.cordova_iab.postMessage(stringifiedMessageObj);"                }                )                ;                $                (                '#condition-message'                )                .                text                (                ""                )                ;                inAppBrowserRef                .                show                (                )                ;                }                }                role                loadErrorCallBack                (                params                )                {                $                (                '#status-message'                )                .                text                (                ""                )                ;                var                scriptErrorMesssage                =                "alert('Sorry we cannot open that folio. Bulletin from the server is : "                +                params                .                message                +                "');"                inAppBrowserRef                .                executeScript                (                {                lawmaking:                scriptErrorMesssage                }                ,                executeScriptCallBack                )                ;                inAppBrowserRef                .                close                (                )                ;                inAppBrowserRef                =                undefined                ;                }                function                executeScriptCallBack                (                params                )                {                if                (                params                [                0                ]                ==                null                )                {                $                (                '#status-message'                )                .                text                (                "Sorry we couldn't open that page. Message from the server is : '"                +                params                .                bulletin                +                "'"                )                ;                }                }                office                beforeloadCallBack                (                params                ,                callback                )                {                if                (                params                .                url                .                startsWith                (                "http://www.example.com/"                )                )                {                // Load this URL in the inAppBrowser.                callback                (                params                .                url                )                ;                }                else                {                // The callback is not invoked, and so the page volition not be loaded.                $                (                '#condition-message'                )                .                text                (                "This browser only opens pages on http://www.example.com/"                )                ;                }                }                function                messageCallBack                (                params                )                {                $                (                '#condition-bulletin'                )                .                text                (                "message received: "                +                params                .                information                .                my_message                )                ;                }              

InAppBrowserEvent Properties

  • type: the eventname, either loadstart, loadstop, loaderror, message or get out. (String)

  • url: the URL that was loaded. (String)

  • code: the mistake code, only in the case of loaderror. (Number)

  • message: the error message, just in the instance of loaderror. (String)

  • data: the message contents , only in the case of message. A stringified JSON object. (Cord)

Supported Platforms

  • Android
  • Browser
  • iOS
  • Windows
  • OSX

Browser Quirks

loadstart, loaderror, message events are not fired.

Windows Quirks

message event is not fired.

Quick Example

              var ref = cordova.InAppBrowser.open up('http://apache.org', '_blank', 'location=yes'); ref.addEventListener('loadstart', function(event) { alert(event.url); });                          

InAppBrowser.removeEventListener

Removes a listener for an upshot from the InAppBrowser. (But available when the target is set to '_blank')

              ref.removeEventListener(eventname, callback);                          
  • ref: reference to the InAppBrowser window. (InAppBrowser)

  • eventname: the event to stop listening for. (Cord)

    • loadstart: effect fires when the InAppBrowser starts to load a URL.
    • loadstop: issue fires when the InAppBrowser finishes loading a URL.
    • loaderror: event fires when the InAppBrowser encounters an mistake loading a URL.
    • exit: upshot fires when the InAppBrowser window is airtight.
    • message: result fires when the InAppBrowser receives a message posted from the folio loaded inside the InAppBrowser Webview.
  • callback: the function to execute when the event fires. The function is passed an InAppBrowserEvent object.

Supported Platforms

  • Android
  • Browser
  • iOS
  • Windows

Quick Example

              var ref = cordova.InAppBrowser.open('http://apache.org', '_blank', 'location=yes'); var myCallback = function(event) { alert(event.url); } ref.addEventListener('loadstart', myCallback); ref.removeEventListener('loadstart', myCallback);                          

InAppBrowser.close

Closes the InAppBrowser window.

              ref.shut();                          
  • ref: reference to the InAppBrowser window (InAppBrowser)

Supported Platforms

  • Android
  • Browser
  • iOS
  • Windows

Quick Example

              var ref = cordova.InAppBrowser.open('http://apache.org', '_blank', 'location=yes'); ref.close();                          

InAppBrowser.show

Displays an InAppBrowser window that was opened hidden. Calling this has no effect if the InAppBrowser was already visible.

              ref.show();                          
  • ref: reference to the InAppBrowser window (InAppBrowser)

Supported Platforms

  • Android
  • Browser
  • iOS
  • Windows

Quick Example

              var ref = cordova.InAppBrowser.open('http://apache.org', '_blank', 'hidden=yes'); // some time later... ref.show();                          

InAppBrowser.hide

Hides the InAppBrowser window. Calling this has no issue if the InAppBrowser was already hidden.

              ref.hide();                          
  • ref: reference to the InAppBrowser window (InAppBrowser)

Supported Platforms

  • Android
  • iOS
  • Windows

Quick Example

              var ref = cordova.InAppBrowser.open up('http://apache.org', '_blank'); // some fourth dimension subsequently... ref.hibernate();                          

InAppBrowser.executeScript

Injects JavaScript lawmaking into the InAppBrowser window. (Just bachelor when the target is ready to '_blank')

              ref.executeScript(details, callback);                          
  • ref: reference to the InAppBrowser window. (InAppBrowser)

  • injectDetails: details of the script to run, specifying either a file or code key. (Object)

    • file: URL of the script to inject.
    • code: Text of the script to inject.
  • callback: the role that executes after the JavaScript code is injected.

    • If the injected script is of type code, the callback executes with a single parameter, which is the return value of the script, wrapped in an Array. For multi-line scripts, this is the render value of the last statement, or the last expression evaluated.

Supported Platforms

  • Android
  • Browser
  • iOS
  • Windows

Quick Example

              var ref = cordova.InAppBrowser.open up('http://apache.org', '_blank', 'location=yes'); ref.addEventListener('loadstop', office() {     ref.executeScript({file: "myscript.js"}); });                          

Browser Quirks

  • simply lawmaking fundamental is supported.

Windows Quirks

Due to MSDN docs the invoked script can return but string values, otherwise the parameter, passed to callback will be [cypher].

InAppBrowser.insertCSS

Injects CSS into the InAppBrowser window. (Only bachelor when the target is set to '_blank')

              ref.insertCSS(details, callback);                          
  • ref: reference to the InAppBrowser window (InAppBrowser)

  • injectDetails: details of the script to run, specifying either a file or lawmaking key. (Object)

    • file: URL of the stylesheet to inject.
    • code: Text of the stylesheet to inject.
  • callback: the function that executes after the CSS is injected.

Supported Platforms

  • Android
  • iOS
  • Windows

Quick Instance

              var ref = cordova.InAppBrowser.open up('http://apache.org', '_blank', 'location=yes'); ref.addEventListener('loadstop', role() {     ref.insertCSS({file: "mystyles.css"}); });                          

__

Sample: Prove assistance pages with an InAppBrowser

You tin employ this plugin to prove helpful documentation pages within your app. Users tin view online aid documents and and then close them without leaving the app.

Here's a few snippets that testify how you do this.

  • Requite users a way to enquire for help.
  • Load a assistance folio.
  • Permit users know that you're getting their page ready.
  • Prove the help page.
  • Handle folio errors.

Give users a mode to inquire for help

There'south lots of ways to practice this in your app. A drib downwards list is a simple mode to do that.

                <                select                id="help-select">                <                choice                value="default">Need help?</                option                >                <                option                value="commodity">Show me a helpful article</                option                >                <                option                value="video">Evidence me a helpful video</                option                >                <                option                value="search">Search for other topics</                option                >                </                select                >              

Gather the users choice in the onDeviceReady office of the folio then send an advisable URL to a helper function in some shared library file. Our helper function is named showHelp() and we'll write that function adjacent.

                $                (                '#help-select'                )                .                on                (                'change'                ,                role                (                due east                )                {                var                url                ;                switch                (                this                .                value                )                {                case                "article":                url                =                "https://cordova.apache.org/docs/en/latest/"                +                "reference/cordova-plugin-inappbrowser/index.html"                ;                pause                ;                example                "video":                url                =                "https://youtu.be/F-GlVrTaeH0"                ;                break                ;                case                "search":                url                =                "https://www.google.com/#q=inAppBrowser+plugin"                ;                break                ;                }                showHelp                (                url                )                ;                }                )                ;              

Load a help page

Nosotros'll employ the open function to load the help folio. We're setting the hidden belongings to yep and then that nosotros can show the browser merely after the page content has loaded. That way, users don't see a blank browser while they await for content to appear. When the loadstop event is raised, we'll know when the content has loaded. We'll handle that issue shortly.

                function                showHelp                (                url                )                {                var                target                =                "_blank"                ;                var                options                =                "location=yep,subconscious=yep"                ;                inAppBrowserRef                =                cordova                .                InAppBrowser                .                open up                (                url                ,                target                ,                options                )                ;                inAppBrowserRef                .                addEventListener                (                'loadstart'                ,                loadStartCallBack                )                ;                inAppBrowserRef                .                addEventListener                (                'loadstop'                ,                loadStopCallBack                )                ;                inAppBrowserRef                .                addEventListener                (                'loaderror'                ,                loadErrorCallBack                )                ;                }              

Permit users know that yous're getting their folio ready

Because the browser doesn't immediately appear, we can use the loadstart result to show a status message, progress bar, or other indicator. This assures users that content is on the way.

                office                loadStartCallBack                (                )                {                $                (                '#condition-message'                )                .                text                (                "loading please look ..."                )                ;                }              

Show the help page

When the loadstopcallback event is raised, we know that the content has loaded and we can brand the browser visible. This sort of trick can create the impression of meliorate performance. The truth is that whether you bear witness the browser before content loads or not, the load times are exactly the same.

                function                loadStopCallBack                (                )                {                if                (                inAppBrowserRef                !=                undefined                )                {                inAppBrowserRef                .                insertCSS                (                {                lawmaking:                "body{font-size: 25px;}"                }                )                ;                $                (                '#status-message'                )                .                text                (                ""                )                ;                inAppBrowserRef                .                show                (                )                ;                }                }              

You might accept noticed the call to the insertCSS function. This serves no particular purpose in our scenario. But it gives you an idea of why you might use information technology. In this case, we're just making certain that the font size of your pages accept a sure size. You lot can use this part to insert any CSS style elements. Y'all tin fifty-fifty point to a CSS file in your projection.

Handle page errors

Sometimes a page no longer exists, a script error occurs, or a user lacks permission to view the resource. How or if you handle that situation is completely upwardly to you and your design. You can let the browser show that bulletin or y'all can present it in another way.

Nosotros'll try to prove that fault in a message box. We can do that by injecting a script that calls the alert office. That said, this won't piece of work in browsers on Windows devices and then nosotros'll have to look at the parameter of the executeScript callback part to see if our attempt worked. If it didn't work out for the states, we'll simply show the error message in a <div> on the page.

                function                loadErrorCallBack                (                params                )                {                $                (                '#status-bulletin'                )                .                text                (                ""                )                ;                var                scriptErrorMesssage                =                "alarm('Lamentable nosotros cannot open that page. Message from the server is : "                +                params                .                bulletin                +                "');"                inAppBrowserRef                .                executeScript                (                {                code:                scriptErrorMesssage                }                ,                executeScriptCallBack                )                ;                inAppBrowserRef                .                close                (                )                ;                inAppBrowserRef                =                undefined                ;                }                function                executeScriptCallBack                (                params                )                {                if                (                params                [                0                ]                ==                nada                )                {                $                (                '#condition-bulletin'                )                .                text                (                "Sorry nosotros couldn't open that page. Message from the server is : '"                +                params                .                message                +                "'"                )                ;                }                }              

More than Usage Info

Local Urls ( source is in the app package )

              var iab = cordova.InAppBrowser;  iab.open('local-url.html');                  // loads in the Cordova WebView iab.open('local-url.html', '_self');         // loads in the Cordova WebView iab.open up('local-url.html', '_system');       // Security error: system browser, simply url will not load (iOS) iab.open('local-url.html', '_blank');        // loads in the InAppBrowser iab.open('local-url.html', 'random_string'); // loads in the InAppBrowser iab.open('local-url.html', 'random_string', 'location=no'); // loads in the InAppBrowser, no location bar                          

Whitelisted Content

              var iab = cordova.InAppBrowser;  iab.open('http://whitelisted-url.com');                  // loads in the Cordova WebView iab.open up('http://whitelisted-url.com', '_self');         // loads in the Cordova WebView iab.open up('http://whitelisted-url.com', '_system');       // loads in the system browser iab.open('http://whitelisted-url.com', '_blank');        // loads in the InAppBrowser iab.open('http://whitelisted-url.com', 'random_string'); // loads in the InAppBrowser  iab.open('http://whitelisted-url.com', 'random_string', 'location=no'); // loads in the InAppBrowser, no location bar                          

Urls that are not white-listed

              var iab = cordova.InAppBrowser;  iab.open('http://url-that-fails-whitelist.com');                  // loads in the InAppBrowser iab.open('http://url-that-fails-whitelist.com', '_self');         // loads in the InAppBrowser iab.open('http://url-that-fails-whitelist.com', '_system');       // loads in the system browser iab.open('http://url-that-fails-whitelist.com', '_blank');        // loads in the InAppBrowser iab.open up('http://url-that-fails-whitelist.com', 'random_string'); // loads in the InAppBrowser iab.open up('http://url-that-fails-whitelist.com', 'random_string', 'location=no'); // loads in the InAppBrowser, no location bar                          

vonstieglitzforrinfort.blogspot.com

Source: https://www.npmjs.com/package/cordova-plugin-inappbrowser