Handling events from remote webpage directly to the app using InAppBrowser

Question

I would like to open an external webapp from my cordova app and handle webapp events directly on the native app. For instance, when a specific URL is loaded the app should handle it by calling a function. Does anyone know if this is possible?

Answer 1

Yes, it is definitly possible to handle some events with the InAppBrowser. If you look at the API docs you'll see an addEventListener function that you can use. Currently it looks like the list of events you can listen for on the external page are still somewhat limited:

1. loadstart - event fired when the InAppBrowser starts to load a URL
2. loadstop - event fired when the InAppBrowser finished loading a URL
3. loaderror - event fired when the InAppBrowser encounters an error loading a URL
4. exit - event fired when the InAppBrowser window is closed

It looks like for your purposes you could just use the loadStart or loadStop events (not sure which would be best for your purpose, probably loadStart().)

Here is some example code:

In the HTML page that you are using to open the inAppBrowser:

function onDeviceReady(){
     var ref = window.open('http://your.site.com/page', '_blank', 'location=yes');
     ref.addEventListener("loadstop", IABcallback);
}

function IABcallback(o){
    console.log("InApBrowser loaded: " +  o.url);
    if( o.url === "http://your.site.com/page2.html"){
        // Do whatever special stuff you want to do for page2 here
    }
    ... 
}