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. 🙂