通过插件访问从phonegap Cordova的外部URL加载Webste

Load Webste from external URL in phonegap Cordova with plugin access

本文关键字:外部 URL 加载 Webste Cordova phonegap 插件 访问      更新时间:2023-09-26

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

那么,我如何通过插件访问从cordova的外部url加载网站呢?

编辑1:我现在正试图给出Android Cordova中资产文件夹的url。但出现以下错误。

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

您可以使用AJAX请求加载页面。试试下面这篇文章:

/**
 * 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");
}

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

config.xml不应受到干扰,内容src应指向index.html.

<content src="index.html" />

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

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

尽管现在还有一个额外的麻烦,就是加载remote.html文件中的所有脚本文件,Jquery的getscript()方法可以用于这些文件。

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

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

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

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

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