We were recently trying to get Worklight to open an external URL within a hybrid mobile app. We did this previously in a Cordova application using the ChildBrowser plugin.
Why would you want to open an external URL in a hybrid mobile app? Well, the same reason we did: you want Twitter or Facebook login for your app.
Worklight has an OpenURL function that we tried to use for this, but the problem is it opens an external URL in the same window as the app, which isn’t what we wanted. If the external URL opens in the same window as the app, it’s difficult to simply exit the external website, and return to the app flow. So we went with the ChildBrowser plugin.
We figured other people might want the same thing in a Worklight app. Here are the steps we went through to get ChildBrowser working:
1. Create a new Worklight project, and create an iPhone environment.
2. Download the contents of the phonegap-plugins repository as ZIP from the repo on Github.
3. Unzip the phonegap-plugins.zip you just downloaded, and go to /iPhone/ChildBrowser.
5. Here’s some example code you can use to test the app. Just make this the contents of your main HTML file: http://d.pr/n/eqvk
4. Now build and deploy your iPhone application, and in the iPhone environment’s ‘js’ folder drop ChildBrowser.js from the ChildBrowser plugin folder.
5. Right click your iPhone environment in Worklight, and pick Run as -> XCode Project.
6. In the XCode project, create a folder called ‘Plugins’. (Cordova expects this).
7. Drag all the *.h and *.m files from the ChildBrowse folder into the Plugins folder of your XCode project. When XCode asks you how you want to copy the files, choose these options: http://d.pr/i/UTaH
8. Drag the ChildBrowser.bundle and .xib files from the plugin folder into the Resources folder of your XCode project. This includes the icons for the ChildBrowser in the .bundle and the layout for the ChildBrowser window the .xib.
9. Open Resources/Cordova.plist and add an entry with key ‘ChildBrowserCommand’ and value ‘ChildBrowserCommand’, then save.
10. You’re done! Run your XCode project in the iPhone simulator, click the ‘open google.com’ button we put in earlier, and it should open a ChildBrowser. http://d.pr/i/f9NJ
- Andy Joslin