Skip to main content

Safari View Controller

For displaying read-only web content.

Requires Cordova plugin: cordova-plugin-safariviewcontroller. For more info, please see the Safari View Controller plugin docs.

https://github.com/EddyVerbruggen/cordova-plugin-safariviewcontroller

Stuck on a Cordova issue?

Don't waste precious time on plugin issues.

If you're building a serious project, you can't afford to spend hours troubleshooting. Ionic’s experts offer premium advisory services for both community plugins and premier plugins.

Installation#

$ npm install cordova-plugin-safariviewcontroller $ npm install @ionic-native/safari-view-controller $ ionic cap sync

Supported Platforms#

  • Android
  • iOS

Usage#

React#

Learn more about using Ionic Native components in React

Angular#

import { SafariViewController } from '@ionic-native/safari-view-controller/ngx';
constructor(private safariViewController: SafariViewController) { }
...
this.safariViewController.isAvailable()  .then((available: boolean) => {      if (available) {
        this.safariViewController.show({          url: 'http://ionic.io',          hidden: false,          animated: false,          transition: 'curl',          enterReaderModeIfAvailable: true,          tintColor: '#ff0000'        })        .subscribe((result: any) => {            if(result.event === 'opened') console.log('Opened');            else if(result.event === 'loaded') console.log('Loaded');            else if(result.event === 'closed') console.log('Closed');          },          (error: any) => console.error(error)        );
      } else {        // use fallback browser, example InAppBrowser      }    }  );