19

External URL's don't open in the system's browser in my PhoneGap Android application. I'm using PhoneGap Build 2.3.0.

According to the Cordova documentation I used target '_system':

window.open('http://www.myurl.nl', '_system');

In my config.xml I have:

<plugin name="InAppBrowser" value="org.apache.cordova.InAppBrowser" />
<access origin="*" browserOnly="true" />

But still the links open in my apps webview.

How to solve this?

Georgios Syngouroglou
  • 18,813
  • 9
  • 90
  • 92
Joan
  • 482
  • 1
  • 3
  • 12
  • It seems to me it works fine in Android by default (but I'm using Crosswalk plugin also...). Check my 2015 answer here to open `_self` in WebView, and `_blank` in external browser: http://stackoverflow.com/questions/32208609/cordova-why-would-inappbrowser-plugin-be-required-to-open-links-in-system-brows/32227524 – Sebastien Lorber Aug 26 '15 at 13:43

6 Answers6

15

It's not the answer when you want to keep using PhoneGap Build, but I solved the problem by setting up a development environment for Cordova (PhoneGap) on my machine and compiling the app locally. In Cordova 2.5.0 window.open('http://www.myurl.nl', '_system'); works perfect, it will open the link in the system's browser.

So my advice is to stop using PhoneGap Build and start compiling your app locally. Here's how to set up your development environment for Cordova >>

Joan
  • 482
  • 1
  • 3
  • 12
  • Can you exaplain what could be the difference from local compile and phonegap build ? – realtebo Aug 01 '13 at 12:47
  • 1
    Mostly the difference is in the settings. When you compile locally, it's easier to change certain settings. But because Cordova 2.5 on PhoneGap Build doesn't yield the same results as when installed locally, there must be some difference in the core code, but have no idea why. – Joan Aug 02 '13 at 07:55
  • @Joan really I'm not sure it's a phonegap build problem. Are you sure you use the appropriate plugin declaration and the plugin is effectively loaded in your app with Phonegap? I've seen people using `gap:plugin` instead of `plugin` tag it's worth trying – Sebastien Lorber Aug 26 '15 at 13:42
14

Late answer,but may be it can help someone.

navigator.app.loadUrl('https://google.com/', { openExternal:true });

Cordova 3.3.1

AtanuCSE
  • 8,832
  • 14
  • 74
  • 112
7

This question is now a little old, but I felt it was worth updating. This now works fine with PhoneGap Build when used with 2.9.0.

I have compiled and tested it on Android 4.3 and iOS 6.1.3. I do not have the InAppBrowser plugin in my app as that's to open pages in the app, rather than cause the native browser to open them, and I only have the following for the access tags:

<access origin="http://127.0.0.1*"/>
<access origin="http://phonegap.com" subdomains="true" />
boodle
  • 506
  • 4
  • 12
7

This worked for me. Phonegap 3.1.0.

html code:

<a id="ext-link" href="#">Google it</a>

or

<button id="ext-link" href="#">Google it</button>

Javascript (with jQuery+cordova):

$("#ext-link").on("click"), function() {
    if (typeof navigator !== "undefined" && navigator.app) {
        // Mobile device.
        navigator.app.loadUrl('http://www.google.com/', {openExternal: true});
    } else {
        // Possible web browser
        window.open("http://www.google.com/", "_blank");
    }
});

Hope that helps.

Georgios Syngouroglou
  • 18,813
  • 9
  • 90
  • 92
  • 1
    didn't help me 04-11 11:47:48.186: E/Web Console(22063): Uncaught TypeError: Cannot call method 'loadUrl' of undefined:88 – Dimitri Apr 11 '14 at 09:49
1

@George Siggouroglou: It's not a good idea to use an id for elements that eventually will appear more than one time in a document. Instead, its good practice to make the code more modular.

if expecting touch devices its also a good choice to use "tap" before "click" because it fires much faster and earlier than a click. to check touch capable stuff I prefer to use modernizr because it makes feature detection a breeze.

The jQuery Mobile tap event triggers after a quick, complete touch event that occurs on a single target object. It is the gesture equivalent of a standard click event that is triggered by the release state of the touch gesture. https://api.jquerymobile.com/tap/

hope that helps someone

**html code:**

<a class="ext-link" href="#">Google it</a>

or

<button class="ext-link" href="#">Google it</button>

Javascript (with jQuery):

//define tap or click event type on root level (can be combined with modernizr)
iaEvent = "click";
if (typeof navigator !== "undefined" && navigator.app) {
   iaEvent = "tap";
}
$('.ext-link').each.bind(iaEvent, function() {
    if (typeof navigator !== "undefined" && navigator.app) {
        // Mobile device.
        var linktarget = this.attr("href");
        navigator.app.loadUrl(linktarget, {openExternal: true});
    } else {
        // Possible web browser
        window.open(linktarget, "_blank");
    }
});
Community
  • 1
  • 1
mrmoree
  • 412
  • 4
  • 10
-1

Use this

window.open('http://www.myurl.nl', '_blank', 'location=yes');

AwadKab
  • 3,054
  • 2
  • 17
  • 17
  • Why did you vote down this comment ? If you check on phonegap website, this command line is a c/p of InAppBrowser install guide... https://github.com/apache/cordova-plugin-inappbrowser/blob/dev/doc/index.md Your profil should be voted down too – Dimitri Apr 11 '14 at 09:57
  • You should have mentioned your solution requires the InAppBrowser plugin to work. Otherwise it will not. – Tom McKenzie Apr 30 '14 at 06:11
  • Thanks for the tip 'location=yes'. I saw elsewhere it was =no and i couldn't get it to work. – Alen Giliana Aug 06 '14 at 02:43
  • Answer is backwards... Passing _blank explicitly instructs Cordova NOT to open it in the system browser! – gregtzar Aug 15 '14 at 19:45