One of the disadvantages of using PhoneGap / Cordova for app development: sometimes it’s like hitting a moving target.  Not just the API, but the methodologies for projects change frequently.  It’s not bad enough to make the platform undesirable for iOS and Android development, but sometimes it makes you pull your hair out wondering why something from an older app no longer works.  Which is bad, I don’t have that much hair left!
In this case, I had to re-visit some old territory: Â opening a link inside of a PhoneGap app inside of mobile Safari. Â See, they changed things on me… again. Â This is the third time now. Â Bummer.
No one seemed to have a good answer for how to do it properly, but after a little digging, I found the solution. Â First, we need to set up the whitelist, sort of like in previous PhoneGap version, but it now resides in a new place – look for it in AppName/config.xml. Â The default basically allows you to launch any site, which is what I wanted. Â Convenient!
Now for the less convenient part: Â no one seemed to have an answer to how to actually launch the URL properly. Â To launch a URL that exits the app and launches in the native browser, use this:
<div onClick=’window.open(“http://www.midnightryder.com”, “_system”);’>
Pretty groovy… now if it was only documented somewhere. Â BTW, that _system part? Â Real important. Â you could use “_blank”, and you’ll end up launching the inAppBrowser plugin instead, and your destination URL will launch in your app with a “done” button at the bottom. Â Which, well, is actually pretty handy – it makes the inAppBrowser plugin pretty easily accessible with no setup needed. 🙂
Holy cow. This is amazing. I have been searching for so long to find this. THANK YOU!
In the end I had to slightly modify your code – as I was using an anchor tag, not a div – and the default behavior needed to be prevented. I gave the appropriate anchor tags a class of external.
$(document).on(‘click’, “.external”, function (e) {
e.preventDefault()
var targetURL = $(this).attr(“href”);
window.open(targetURL, “_system”);
});
I had tried adding target = “_system” to the anchor tag but preventing the default behavior was key.
Thanks for your post!
Glad it helped 🙂
I was opening all links in InAppBrowser, but had to open external PDF links. Thank you for the solution. It helped me.
why can’t we print, everything else is ok with phonegap but no one seems to want to print anything. wtf is the damn problem with phonegap and printing and why isn’t it a frakken feature. just stupid and ridiculous that we can’t frakken print. yes i am annoyed.