[Cordova inAppBrowser 在App內開啟瀏覽器]

標籤：highlight   rtc   hidden   loader   tintcolor   art   官網   lse   IV   

方案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‘);  }

　　

[Cordova inAppBrowser 在App內開啟瀏覽器]