Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

phonegap - open link in browser

I use phonegap (cordova 2.2)

I have link like this :

<a href="http://twitter.com/foobar" target="_blank">twitter</a>

On iOS - it opens link in browser(Safari)

But on Android - it opens inside webview(inside my phonegap app)

Is there a way to make Android work same way as iOS ?

like image 272
Pydev UA Avatar asked Dec 28 '12 14:12

Pydev UA


4 Answers

This is how I got it working using Cordova 2.2 and jQuery mobile on Android

Javascript:

$('.link').live('tap', function() {
    url = $(this).attr("rel");   
    loadURL(url);
});

function loadURL(url){
    navigator.app.loadUrl(url, { openExternal:true });
    return false;
} 

html:

<a href='#' class='link' rel='http://www.someurl.com'>Go Somewhere</a>
like image 97
someuser Avatar answered Nov 14 '22 04:11

someuser


Try this for android:

function loadURL(url){
    navigator.app.loadUrl(url, { openExternal:true });
    return false;
} 

Html:

<a click="loadURL('http://twitter.com/foobar')">twitter</a>

You can also try this in your config.xml:

<access origin="*twitter.com" browserOnly="true"/> 
like image 31
Majid Laissi Avatar answered Nov 14 '22 03:11

Majid Laissi


The link provided by user1879822 was actually the most useful one for me: https://build.phonegap.com/blog/access-tags

To summarize, PhoneGap has a whitelist of allowed URLs within its config.xml. This means if it has an entry like this ...

<access origin="*" />

... it will attempt to open all links inside its own webview. However if you constrain your whitelist to only specific URLs, then any link to a URL not in that list will automatically open in an external browser, not within your local webview. For example if you constrain it to only this ...

<access origin="http://127.0.0.1*" />

... then the twitter link mentioned in the original question should open in a new external browser.

like image 4
greghmerrill Avatar answered Nov 14 '22 03:11

greghmerrill


If you want to use as in the ios version, with target="_blank" attributes:

$(document).on('tap', 'a[target="_blank"]', function(e){
    navigator.app.loadUrl(e.target.href, { openExternal: true });
    return false;
});
like image 3
garaboncias Avatar answered Nov 14 '22 02:11

garaboncias