我正在使用Cordova的inappbrowser插件在我的应用程序中显示Web部件。在网站上,有共享链接,例如对于WhatsApp:
<a href="whatsapp://send?text=Check this out">Share on WhatsApp</a>
现在,当在inappbrowser中单击这些链接时,它只是尝试将whatsapp://send?...
加载为URL并显示错误页面。
我想要做的是使用给定系统的浏览器/ URI处理程序以whatsapp://
开头的开放链接,因此它类似于在系统浏览器中单击此类链接时的行为。为此,我做了以下事情:
urlChanged = function(event) {
// when a "whatsapp://" link is clicked, open it in the system browser
if(event.url.startsWith("whatsapp://")) {
window.open(event.url, "_system");
return;
}
}
// Add an "loadstart" event listener to the inappbrowser:
browser.addEventListener("loadstart", urlChanged);
到目前为止,这有点奏效,但有些怪癖:
whatsapp://
链接(“未知网址方案”)。为了缓解第2点,我还在事件监听器中尝试了以下操作,但没有成功(行为完全相同):
urlChanged = function(event) {
if(event.url.startsWith("whatsapp://")) {
// stop loading the whatsapp:// link in inappbrowser
browser.stop();
// go back in history to display page where whatsapp:// link was on
browser.history.back();
window.open(event.url, "_system");
return;
}
}
browser.addEventListener("loadstart", urlChanged);
你能指导我如何解决第1点和第2点吗?
所以我最终得到了以下代码:
openWithSystemBrowser = function(url) {
window.open(url, "_system");
location.href = "index.html";
};
shareOnWhatsapp = function(url) {
openWithSystemBrowser(url);
};
/**
* Handles URL changes in in-app browser, e.g. to handle logouts or
* unsuccessful logins
*/
urlChanged = function(event) {
if(event.url.startsWith("http://whatsapp://")) {
shareOnWhatsapp(event.url.substr("http://".length));
return;
}
if(event.url.startsWith("whatsapp://")) {
shareOnWhatsapp(event.url);
return;
}
};
这当然有点蹩脚,因为你总是带回index.html,但就我的目的而言,这已经足够了。有兴趣看看是否有人找到了更优雅的解决方案。
它还在打开系统浏览器之前解决了2-3秒的延迟,但坦率地说,我没有任何线索。
我找到了一种具有更好用户体验的方法:在系统浏览器中加载外部URL时,我关闭InAppBrowser并使用最后一个内部URL重新打开它。
var appUrl = 'https://www.my-website.com';
var app = {
currentUrl: appUrl,
initialize: function() {
document.addEventListener('deviceready', this.onDeviceReady.bind(this), false);
},
onDeviceReady: function() {
app.openBrowser();
},
openBrowser: function() {
var target = '_blank';
var options = [
"location=no",
"clearcache=no",
"clearsessioncache=no",
"footer=no",
"hardwareback=no",
"hideurlbar=yes",
"zoom=no",
"hidenavigationbuttons=no",
"toolbar=yes",
"hidespinner=yes",
"toolbarcolor=#000000",
"toolbartranslucent=no",
"navigationbuttoncolor=#ffffff",
"closebuttoncolor=#000000",
"closebuttoncaption="
];
browser = cordova.InAppBrowser.open(app.currentUrl, target, options.join());
// reopen the browser if it was closed via "Done" button
browser.addEventListener('exit', function(){ app.openBrowser(); } );
// open external urls in system browser window
browser.addEventListener('loadstart', function(event){ app.handleUrl(event.url, browser); });
},
handleUrl: function(url, browser) {
var extension = url.split('.').pop();
// load internal urls that are not pdf files in the app browser
if (extension != 'pdf' && url.startsWith(appUrl)) {
app.currentUrl = url;
return;
}
// open website in system browser window
var ref = cordova.InAppBrowser.open(url, '_system', 'location=no');
// since the inapp browser is loading the website too, close it and open it again with the last internal url visited
browser.close();
app.openBrowser();
return;
}
};
app.initialize();