概述
在 Cordova 应用程序开发中，我们经常需要在应用程序中嵌入其他网站或者 API。但是，由于 Cordova 应用程序的跨域策略，我们不得不使用 列白名单插件 以避免访问被阻止。Cordova 的 cordova-plugin-whitelist 插件提供了这个功能，它允许我们定义一组白名单规则，只允许应用程序访问特定的域。
安装 cordova-plugin-whitelist 插件
第一步是在 Cordova 应用程序中安装插件。首先，我们需要在终端中通过 npm 命令行安装插件。使用以下命令安装 cordova-plugin-whitelist 插件：
$ cordova plugin add cordova-plugin-whitelist
该命令将从 npm 存储库中下载和安装插件。
在 config.xml 文件中配置白名单规则
一旦您已经安装了 cordova-plugin-whitelist 插件，您也需要在 config.xml 文件中定义白名单规则。这是通过在 config.xml 文档的根元素中添加这些规则来实现的：
<widget ... xmlns:cdv="http://cordova.apache.org/ns/1.0">
...
<allow-navigation href="http://www.example.com/*" />
<allow-intent href="http://*/*" />
<access origin="http://www.example.com/" />
...
</widget>在上面的代码中，我们定义了以下几个白名单规则：
- allow-navigation：允许应用程序导航到 http://www.example.com/*。
- allow-intent：允许应用程序与任何网站进行交互。
- access：允许访问 http://www.example.com/。
示例代码
下面是 Cordova 应用程序的一个例子，它定义了一个白名单规则并加载了一个外部网页：
-- -------------------- ---- -------
--------- -----
------
------
----- --------------- --
----- --------------- ---------------------------- -----------------
------------- ----------------
------- --------------------------
-------
------
---- ------------
---------- -------------
----- --- --- --- ----- ---- ------- -- ------- ----
-------------- --- --- ---- -- -------- ---------------------
------- ---------------------------- ------------ ----------------------
------
------- ---------------------------
-------
-------在上面的代码中，我们定义了一个 allow-navigation 白名单规则，允许应用程序导航到 http://www.example.com/*。然后，我们在 iframe 标记中加载了这个外部网页。
总结
通过 cordova-plugin-whitelist 插件，您可以定义一组白名单规则，以便您的 Cordova 应用程序可以与特定的网站或 API 进行交互。上述教程提供了一些指导性的内容，使您轻松了解插件的使用方法，并介绍了如何在 Cordova 应用程序中定义白名单规则。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/61006