[Cordova inAppBrowser 在App内打开浏览器]

Posted 2020-11-11 asen0501

方案1:

使用Cordova插件 cordova-plugin-inappbrowser

　　1.  添加插件 

cordova plugin add cordova-plugin-inappbrowser

　　2. 调用以及参数

 

cordova.InAppBrowser.open(url, target, options);

或者

window.open = cordova.InAppBrowser.open;
window.open(url, target, options);

　　

　　url:  如果包含 Unicode 字符， 调用 encodeURI(url)；

　　target 包括： _self, url在白名单中 则在cordova webview中打开 否则在 inAppBrowser中打开

　　　　　　　　_blank, 在 inAppBrowser中打开

　　　　　　　　_system, 在系统浏览器中打开， 比如Chrome／Safari

　　options 包括："location=yes/no" 地址栏

　　　　　　　　　"hidden=yes/no" no 是默认的， yes则正常load 但是不显示，通过调用.show() .close()来显示或关闭，如下

　　　　　　　　　其他options请参考官网

　　

var target = "_blank";

var options = "location=yes,hidden=yes";

inAppBrowserRef = cordova.InAppBrowser.open(url, target, options);
inAppBrowserRef.addEventListener(‘loadstart‘, loadStartCallBack); 
inAppBrowserRef.addEventListener(‘loadstop‘, loadStopCallBack); 
inAppBrowserRef.addEventListener(‘loaderror‘, loadErrorCallBack);
 
... 
function loadStopCallBack() { 
　if (inAppBrowserRef != undefined) {
　　inAppBrowserRef.show(); 
　} 
} 
...

　　

 

方案2:

使用cordova插件 cordova-plugin-safariviewcontroller

 

　　1. 添加插件 

$ ionic cordova plugin add cordova-plugin-safariviewcontroller
$ npm install --save @ionic-native/safari-view-controller

　　2. 调用以及参数

...

if (typeof SafariViewController !== ‘undefined‘) {
      SafariViewController.isAvailable(function (available) {
        console.log(" Is  available");
        if (available) {
          console.log("Safari Is  available");
          SafariViewController.show({
            url: encodeURI(url),
            toolbarColor: ‘#0091ea‘,
            tintColor: ‘#0091ea‘,
            controlTintColor: "#0091ea"
          });
        } else {
          window.open(encodeURI(url), ‘_blank‘, ‘location=no‘);
        }
      });
  } else {
      window.open(encodeURI(url), ‘_blank‘, ‘location=no‘);
  }