Phonegap 3.0 InAppBrowser - Provides no way for us

Question

I had inApBrowser working in my app just fine... however, I upgraded some things and now it opens the URL without any way of closing it. You have to kill the app.

I have tried many variations of this: window.open('http://cnn.com','_blank','location=yes,toolbar=yes');

myconfig.xml has:

<feature name="InAppBrowser">
    <param name="ios-package" value="CDVInAppBrowser" />
</feature>

I get no errors... the page opens... but there is no way to close and return to the app. I have seen a lot of folks putting solutions for URL recognition and making the window close... but I need the childBrowser plugin method... where the user can close the window when he/she is finished viewing the page.

Phonegap 3.0 - JqueryMobile 1.2 - IOS 7.0.2 - xCode 5.0 -

Any help would be greatly appreciated!

Answer 1

Your syntax looks okay, but give these code snippets a try:

Pure JavaScript:

var ref = window.open('http://cnn.com', '_blank', 'location=yes,toolbar=yes');

HTML + JavaScript:

<a href="#" onclick="var ref = window.open('http://cnn.com', '_blank', 'location=yes,toolbar=yes');">CNN Link</a>

Also, check that you have correctly installed the InAppBrowser plugin (PhoneGap/Cordova 3.0+ need it to be installed separately via the command line). Your config.xml file looks correct, but just make sure that the rest of the plugin is installed properly.

You can use the following commands to list all the installed plugins in your project...

Using Cordova: cordova plugins

Using PhoneGap: phonegap local plugin list

You can also just go to your Desktop, navigate to the 'plugins' folder within your project and check that there is a folder named 'org.apache.cordova.inappbrowser' or 'org.apache.cordova.core.inappbrowser' inside.

To install the InAppBrowser plugin (if necessary)...

Using Cordova: cordova plugin add org.apache.cordova.inappbrowser

Using PhoneGap: phonegap local plugin add org.apache.cordova.inappbrowser

From your description, it sounds like your page is opening within the app's webview, instead of the InAppBrowser window. This is the behaviour you would normally get if you used '_self' instead of '_blank'. Hopefully something here will help fix it.

Answer 2

If you are using PhoneGap Build then you need to use different syntax i.e. (see plugin info):

<gap:plugin name="org.apache.cordova.inappbrowser" />

See also PGB plugin repository. It seem to be up-to-date now. You can see a simple test application for a working version.

Note that this might not be working if you are building yourself (locally on your computer). Use instructions by wicketyjarjar if you are building locally.

Answer 3

The inAppBrowser did not work with Phonegap 3.0.0, and had to change this in config.xml to make it work on both ios and Android :

<plugin name="inAppBrowser">

to

<gap:plugin name="org.apache.cordova.inappbrowser" />

Also if you would want to include emailcomposer use the below line in config.xml

<gap:plugin name="de.appplant.cordova.plugin.email-composer" />

and in the Javascript file add the below lines:

var ops = {
    callback: function (result) {
        navigator.notification.alert(result);
    },
    subject: "Look at this photo",
    body: "Take a look at <b>this</b>:",
    toRecipients: ["[e-mail]", "[e-mail]"],
    ccRecipients: [],
    bccRecipients: [],
    isHTML: true,
    attachments: ["_complete_path/image.png"]
}

function mail(name, url) {
    window.plugin.email.open({
        to: [],
        cc: [],
        bcc: [],
        subject: name,
        body: url,
        isHtml: true
    });
}

Answer 4

I had the same problem. In my case it was caused by forgetting to include the cordova.js script.

<script type="text/javascript" src="cordova.js"></script>