使用插件访问从 phonegap Cordova 中的外部 URL 加载 Webste

Posted 2023-03-15

【中文标题】使用插件访问从 phonegap Cordova 中的外部 URL 加载 Webste

【英文标题】：Load Webste from external URL in phonegap Cordova with plugin access

【发布时间】：2015-11-06 09:16:38

【问题描述】：

我希望从我的 Cordova Phonegap 项目中的外部 URL 加载我的应用程序 (android/ios) 的内容。虽然我可以在应用程序中加载网站，但没有插件访问。我曾尝试在本地应用程序和网站上托管插件，但这些方法似乎都不起作用。

那么如何通过插件访问从科尔多瓦的外部 url 加载网站？

编辑 1：我现在尝试在 Android Cordova 中提供资产文件夹的 url。但是出现如下错误。

Error: [Error] initializing Cordova: Class Not Found.

【参考方案1】：

您可以使用 AJAX 请求加载页面。 试试这个article:

/**
 * Load page into url
 *
 * @param url           The url to load
 */
function loadPage(url) 
    var xmlhttp = new XMLHttpRequest();

    // Callback function when XMLHttpRequest is ready
    xmlhttp.onreadystatechange=function()
        if (xmlhttp.readyState === 4)
            if (xmlhttp.status === 200) 
                document.getElementById('container').innerhtml = xmlhttp.responseText;
            
        
    ;
    xmlhttp.open("GET", url , true);
    xmlhttp.send();

在主文件中

/**
 * Function called when page has finished loading.
 */
function init() 

    // Load first page into container
    loadPage("screen1.html");

【讨论】：

HOW TO apply the Cordova/Phonegap the whitelist system 如果有帮助请告诉我

不是白名单问题。我已允许导航到所有内容 (*)。我正在尝试对已加载的外部 url 进行插件访问。问题是cordova 类没有初始化。我已经完成了 res->xml->config.xml 的事情。

【参考方案2】：

@Emanuele Spatola 的回答似乎是唯一可行的方法。

config.xml 不应受到干扰，content-src 应指向 index.html。

<content src="index.html" />

你的项目需要的所有插件都应该在你的应用本地安装，并将cordova.js添加到本地的index.html中。

然后创建一个容器（如 div ）元素并进行 ajax 调用以加载其中的 html 文件。

虽然现在需要加载远程 .html 文件中存在的所有脚本文件，但可以使用 Jquery 的 getscript() 方法。

【参考方案3】：

除了接受的答案之外，当涉及到使用来自 xmlHttpRequest 或任何其他 XSS/Ajax 调用的结果来操作 DOM 时，接受的答案会完成这项工作，直到外部内容包含应该在 DOM 更新后运行的脚本或标签.因此：

document.getElementById('container').innerHTML = xmlhttp.responseText;

由于安全原因，在将内容添加到 DOM 时，.innerHTML 函数会将xmlhttp.responseText 呈现为纯文本和 html，而忽略此处包含的任何标记或脚本，因此不适用于包含 javascript 的页面；请参阅https://www.w3.org/TR/2008/WD-html5-20080610/dom.html#innerhtml0 了解更多信息。 解决此问题的最快方法是使用已解决此问题的 JQuery .html() 函数：

$('#container').html(xmlhttp.responseText);

上面的代码将呈现内容并运行附加的任何脚本。

【讨论】：

你的脚本没有运行很奇怪；您有工作示例/代码供我们审查吗？您也可以尝试 eval 或者如果您知道附加到代码的脚本的位置；您可以自己单独附加它们；这可以通过遍历从请求接收到的代码中的所有脚本标签并使用正式的源属性创建新的 DOM 元素（脚本标签）来完成。 - 顺便说一句，这就是 .html() 应该为你做的。