Forget InAppBrowser for iOS - this is way better for displaying read-only web content in your PhoneGap app.
npm install cordova-plugin-ortoo-safariviewcontrollerSafariViewController Cordova Plugin
===================================
by Eddy Verbruggen - @eddyverbruggen
1. Description
2. Screenshots
3. Installation
4. Usage
5. Advantages over InAppBrowser
6. Changelog
Note that I didn't decide to clobber window.open to override InAppBrowser when applicable
because that would mean you could never use InAppBrowser in case you need its advanced features
in one place and are happy with a simple readonly view in other cases.
Pressing 'Done' returns the user to your app as you'd expect.
```
$ cordova plugin add cordova-plugin-safariviewcontroller
returns false (see the snippet below) you want to open the URL in the InAppBrowser probably,
so be sure to include that plugin as well:`
$ cordova plugin add cordova-plugin-inappbrowser
`I'm not including it as a depency as not all folks may have this requirement.
4. Usage
Check the demo code for an easy to drop in example, otherwise copy-paste this:`js
function openUrl(url, readerMode) {
SafariViewController.isAvailable(function (available) {
if (available) {
SafariViewController.show({
url: url,
hidden: false, // default false. You can use this to load cookies etc in the background (see issue #1 for details).
animated: false, // default true, note that 'hide' will reuse this preference (the 'Done' button will always animate though)
transition: 'curl', // unless animated is false you can choose from: curl, flip, fade, slide (default)
enterReaderModeIfAvailable: readerMode // default false
},
// this success handler will be invoked for the lifecycle events 'opened', 'loaded' and 'closed'
function(result) {
if (result.event === 'opened') {
alert('opened');
} else if (result.event === 'loaded') {
alert('loaded');
} else if (result.event === 'closed') {
alert('closed');
}
},
function(msg) {
alert("KO: " + msg);
})
} else {
// potentially powered by InAppBrowser because that (currently) clobbers window.open
window.open(url, '_blank', 'location=yes');
}
})
}function dismissSafari() {
SafariViewController.hide()
}
`5. Advantages over InAppBrowser
* InAppBrowser uses the slow UIWebView (even when you're using a WKWebView plugin!), this plugin uses the ultra fast Safari Webview.
* This is now Apple's recommended way to use a browser in your app.
* A nicer / cleaner UI which is consistent with Safari and all other apps using a SFSafariViewController.
* Since this is the system's main browser, assets like cookies are shared with your app, so the user is still logged on in his favorite websites.
* Whereas cordova-plugin-inappbrowser is affected by ATS, this plugin is not. This means you can even load http URL's without whitelisting them.6. Changelog
* 1.4.0 Added a hidden property to show.
* 1.3.0 isAvailable plays nice with non-iOS platforms. Added a transition property to show.
* 1.2.0 Added lifecycle events to the success handler of show, and added the animated property to show`.