How To Wrap A Website In A Cordova App

Posted by Weston Ganger

For one of my clients I needed to make a website wrapper app so they could have an app on the app stores. This can be done fairly simply using the following method.

First install cordova-plugin-inappbrowser:


cordova plugin install cordova-plugin-inappbrowser

Then heres the javascript to accomplish this. Notice I have applied some special options to the open function to make the site appear as if its not in a browser window.


document.addEventListener("deviceready", function(){
  var browser = cordova.InAppBrowser.open('https://mysite.com','_system','location=no,zoom=no,hidden=yes,toolbar=no');
  
  browser.addEventListener("loadstop", function(){
    browser.show();
  });
}, false);

You will probably want to show a loading page until the browser shows but thats up to you to add however you want.

Note: It is possible you could have troubles getting approved on the Apple App Store (or possibly even the Google Play Store) as you can possibly be denied for it only being a website wrapper but I have been successful in my attempts.


Related External Links:

Article Topic:Software Development - Ionic

Date:November 22, 2016

Recommended Posts