InAppBrowser

The InAppBrowser is a web-browser that is shown in your app when you use the [window.open](window.open.html) call.

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

Description

The object returned from a call to [window.open](window.open.html).

Methods

  • addEventListener
  • removeEventListener
  • close

Permissions

Android

app/res/xml/config.xml

<plugin name="InAppBrowser" value="org.apache.cordova.InAppBrowser" />

iOS

config.xml

<plugin name="InAppBrowser" value="CDVInAppBrowser" />

Windows Phone 7 + 8

config.xml

<plugin name="InAppBrowser" />

addEventListener

Adds a listener for an event from the InAppBrowser.

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

  • eventname: the event to listen for (String)

      loadstart - event fired when the InAppBrowser starts to load a URL 
  loadstop - event fired when the InAppBrowser finished loading a URL
  loaderror - event fired when the InAppBrowser encounters an error loading a URL
  exit - event fired when the InAppBrowser window is closed
  • callback: the function that is called when the event is fired. The function is passed an InAppBrowserEvent object.

Supported Platforms

  • Android
  • iOS
  • Windows Phone 7 + 8

Quick Example

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

Full Example

<!DOCTYPE html>
<html>
  <head>
    <title>InAppBrowser.addEventListener Example</title>

    <script type="text/javascript" charset="utf-8" src="cordova-2.6.0.js"></script>
    <script type="text/javascript" charset="utf-8">

    // Wait for Cordova to load
    //
    document.addEventListener("deviceready", onDeviceReady, false);

    // Cordova is ready
    //
    function onDeviceReady() {
         var ref = window.open('http://apache.org', '_blank', 'location=yes');
         ref.addEventListener('loadstart', function(event) { alert('start: ' + event.url); });
         ref.addEventListener('loadstop', function(event) { alert('stop: ' + event.url); });
         ref.addEventListener('loaderror', function(event) { alert('error: ' + event.message); });
         ref.addEventListener('exit', function(event) { alert(event.type); });
    }

    </script>
  </head>
  <body>
  </body>
</html>

removeEventListener

Removes a listener for an event from the InAppBrowser.

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

  • eventname: the event to stop listening for (String)

      loadstart - event fired when the InAppBrowser starts to load a URL 
  loadstop - event fired when the InAppBrowser finished loading a URL
  loaderror - event fired when the InAppBrowser encounters an error loading a URL
  exit - event fired when the InAppBrowser window is closed
  • callback: the function that was to be called when the event is fired. The function is passed an InAppBrowserEvent object.

Supported Platforms

  • Android
  • iOS
  • Windows Phone 7 + 8

Quick Example

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

Full Example

<!DOCTYPE html>
<html>
  <head>
    <title>InAppBrowser.removeEventListener Example</title>

    <script type="text/javascript" charset="utf-8" src="cordova-2.6.0.js"></script>
    <script type="text/javascript" charset="utf-8">

    // Wait for Cordova to load
    //
    document.addEventListener("deviceready", onDeviceReady, false);
    
    // Global InAppBrowser reference
    var iabRef = null;
    
    function iabLoadStart(event) {
        alert(event.type + ' - ' + event.url);
    }

    function iabLoadStop(event) {
        alert(event.type + ' - ' + event.url);
    }
   
    function iabLoadError(event) {
        alert(event.type + ' - ' + event.message);
    }
   
    function iabClose(event) {
         alert(event.type);
         iabRef.removeEventListener('loadstart', iabLoadStart);
         iabRef.removeEventListener('loadstop', iabLoadStop);
         iabRef.removeEventListener('loaderror', iabLoadError);
         iabRef.removeEventListener('exit', iabClose);
    }

    // Cordova is ready
    //
    function onDeviceReady() {
         iabRef = window.open('http://apache.org', '_blank', 'location=yes');
         iabRef.addEventListener('loadstart', iabLoadStart);
         iabRef.addEventListener('loadstop', iabLoadStop);
         iabRef.removeEventListener('loaderror', iabLoadError);
         iabRef.addEventListener('exit', iabClose);
    }

    </script>
  </head>
  <body>
  </body>
</html>

close

Closes the InAppBrowser window.

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

Supported Platforms

  • Android
  • iOS
  • Windows Phone 7 + 8

Quick Example

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

Full Example

<!DOCTYPE html>
<html>
  <head>
    <title>InAppBrowser.close Example</title>

    <script type="text/javascript" charset="utf-8" src="cordova-2.6.0.js"></script>
    <script type="text/javascript" charset="utf-8">

    // Wait for Cordova to load
    //
    document.addEventListener("deviceready", onDeviceReady, false);

    // Cordova is ready
    //
    function onDeviceReady() {
         var ref = window.open('http://apache.org', '_blank', 'location=yes');
         // close InAppBrowser after 5 seconds
         setTimeout(function() {
             ref.close();
         }, 5000);
    }

    </script>
  </head>
  <body>
  </body>
</html>

InAppBrowserEvent

The object that is passed to the callback function from an addEventListener call on an InAppBrowser object.

Properties

  • type: the eventname (String) - one of loadstart, loadstop, or exit
  • url: the URL that was loaded (String)