Cordova,为什么需要InAppBrowser插件才能在系统浏览器中打开链接
Cordova, why would InAppBrowser plugin be required to open links in system browser
我有一个 Cordova 应用程序,它是一个带有单个 HTML 文件的单页应用程序。
所有 link 都应在系统浏览器中打开。我不想要 "embedded" InAppBrowser,而是真正的本机系统/外部浏览器。
我们到处都可以找到使用 InAppBrowser 的代码示例,例如:
window.open('http://apache.org', '_system');
但为什么我们需要安装 InAppBrowser,即使我们甚至不打算使用嵌入式浏览器?
关于 link 的目标,有人能真正解释 WebView 的行为应该是什么吗?目前还不清楚它应该用 target=_blank
做什么,但除了打开一个新浏览器 window 之外,我看不到它还能做什么。
请注意,问题似乎只出现在 iOS 上,因为 Android(使用 Crosswalk 插件)使用 target=_blank
似乎总是可以正常工作并在新的本机浏览器中打开 window.
所以我用我发现的来回答我自己的问题。
请注意,我只在 Cordova 5.1.1 上处理 iOS 和 Android(使用 Crosswalk 插件),并且它可能不适用于其他 platforms/versions.
需要 InAppBrowser
即使您不需要嵌入式浏览器,也需要 InAppBrowser 插件。这使得 _system
目标可用,触发本机插件代码打开 system/external 浏览器。
所以看起来这个插件在某种程度上是一个“二合一”插件:它允许使用嵌入式浏览器+它允许安全地强制打开外部系统浏览器。
目前还不清楚默认的 WebView 行为应该与 _blank
链接相关(也不清楚它是否以任何方式针对 WebView 进行了标准化),但我发现无法在 iOS 没有这个插件或本机代码。
在 WebView 中打开 _self
,并在本机浏览器中打开 _blank
如果你像我一样不关心嵌入式浏览器,只是想在现有应用程序中将所有 _blank
目标打开到本地外部浏览器,而不会有太多痛苦(特别是如果应用程序是还有一个移动网站...),您可以 运行 在您的应用程序开头添加以下代码:
function openAllLinksWithBlankTargetInSystemBrowser() {
if ( typeof cordova === "undefined" || !cordova.InAppBrowser ) {
throw new Error("You are trying to run this code for a non-cordova project, " +
"or did not install the cordova InAppBrowser plugin");
}
// Currently (for retrocompatibility reasons) the plugin automagically wrap window.open
// We don't want the plugin to always be run: we want to call it explicitly when needed
// See https://issues.apache.org/jira/browse/CB-9573
delete window.open; // scary, but it just sets back to the default window.open behavior
var windowOpen = window.open; // Yes it is not deleted !
// Note it does not take a target!
var systemOpen = function(url, options) {
// Do not use window.open becaus the InAppBrowser open will not proxy window.open
// in the future versions of the plugin (see doc) so it is safer to call InAppBrowser.open directly
cordova.InAppBrowser.open(url,"_system",options);
};
// Handle direct calls like window.open("url","_blank")
window.open = function(url,target,options) {
if ( target == "_blank" ) systemOpen(url,options);
else windowOpen(url,target,options);
};
// Handle html links like <a href="url" target="_blank">
// See https://issues.apache.org/jira/browse/CB-6747
$(document).on('click', 'a[target=_blank]', function(event) {
event.preventDefault();
systemOpen($(this).attr('href'));
});
}
我有一个 Cordova 应用程序,它是一个带有单个 HTML 文件的单页应用程序。
所有 link 都应在系统浏览器中打开。我不想要 "embedded" InAppBrowser,而是真正的本机系统/外部浏览器。
我们到处都可以找到使用 InAppBrowser 的代码示例,例如:
window.open('http://apache.org', '_system');
但为什么我们需要安装 InAppBrowser,即使我们甚至不打算使用嵌入式浏览器?
关于 link 的目标,有人能真正解释 WebView 的行为应该是什么吗?目前还不清楚它应该用 target=_blank
做什么,但除了打开一个新浏览器 window 之外,我看不到它还能做什么。
请注意,问题似乎只出现在 iOS 上,因为 Android(使用 Crosswalk 插件)使用 target=_blank
似乎总是可以正常工作并在新的本机浏览器中打开 window.
所以我用我发现的来回答我自己的问题。 请注意,我只在 Cordova 5.1.1 上处理 iOS 和 Android(使用 Crosswalk 插件),并且它可能不适用于其他 platforms/versions.
需要 InAppBrowser
即使您不需要嵌入式浏览器,也需要 InAppBrowser 插件。这使得 _system
目标可用,触发本机插件代码打开 system/external 浏览器。
所以看起来这个插件在某种程度上是一个“二合一”插件:它允许使用嵌入式浏览器+它允许安全地强制打开外部系统浏览器。
目前还不清楚默认的 WebView 行为应该与 _blank
链接相关(也不清楚它是否以任何方式针对 WebView 进行了标准化),但我发现无法在 iOS 没有这个插件或本机代码。
在 WebView 中打开 _self
,并在本机浏览器中打开 _blank
如果你像我一样不关心嵌入式浏览器,只是想在现有应用程序中将所有 _blank
目标打开到本地外部浏览器,而不会有太多痛苦(特别是如果应用程序是还有一个移动网站...),您可以 运行 在您的应用程序开头添加以下代码:
function openAllLinksWithBlankTargetInSystemBrowser() {
if ( typeof cordova === "undefined" || !cordova.InAppBrowser ) {
throw new Error("You are trying to run this code for a non-cordova project, " +
"or did not install the cordova InAppBrowser plugin");
}
// Currently (for retrocompatibility reasons) the plugin automagically wrap window.open
// We don't want the plugin to always be run: we want to call it explicitly when needed
// See https://issues.apache.org/jira/browse/CB-9573
delete window.open; // scary, but it just sets back to the default window.open behavior
var windowOpen = window.open; // Yes it is not deleted !
// Note it does not take a target!
var systemOpen = function(url, options) {
// Do not use window.open becaus the InAppBrowser open will not proxy window.open
// in the future versions of the plugin (see doc) so it is safer to call InAppBrowser.open directly
cordova.InAppBrowser.open(url,"_system",options);
};
// Handle direct calls like window.open("url","_blank")
window.open = function(url,target,options) {
if ( target == "_blank" ) systemOpen(url,options);
else windowOpen(url,target,options);
};
// Handle html links like <a href="url" target="_blank">
// See https://issues.apache.org/jira/browse/CB-6747
$(document).on('click', 'a[target=_blank]', function(event) {
event.preventDefault();
systemOpen($(this).attr('href'));
});
}