Cordova10打包Angular安卓应用出现URL被白名单拦截问题

核心原因 #

你当前的配置仅添加了<access origin="*">和<allow-intent>规则，但缺少控制WebView内部发起网络请求、页面跳转的<allow-navigation>配置，这是Cordova 10默认搭载的cordova-android 9.0+版本的强制规则要求。

具体操作步骤 #

步骤1：添加allow-navigation配置 #

在config.xml的根节点下（或者<platform name="android">节点内）添加如下配置：

<!-- 测试阶段可先用通配符放行所有请求，验证问题根源 -->
<allow-navigation href="*" />
<!-- 正式环境建议替换为实际用到的域名，缩小权限范围，示例如下 -->
<allow-navigation href="http://192.168.178.5:4003/*" />
<allow-navigation href="https://fonts.googleapis.com/*" />

步骤2：适配安卓明文HTTP请求限制 #

你请求的局域网地址为HTTP协议，安卓9及以上系统默认禁止明文HTTP流量，需要额外开启权限：

1. 首先给config.xml的根<widget>节点添加安卓命名空间：

<widget id="de.acme.app" version="1.0.0" xmlns="http://www.w3.org/ns/widgets" 
    xmlns:cdv="http://cordova.apache.org/ns/1.0"
    xmlns:android="http://schemas.android.com/apk/res/android">

2. 然后在<platform name="android">节点内添加明文权限配置：

<edit-config file="app/src/main/AndroidManifest.xml" mode="merge" target="/manifest/application">
    <application android:usesCleartextTraffic="true" />
</edit-config>

步骤3：清理缓存重新构建 #

配置修改后必须清理旧的构建缓存才能生效，按顺序执行以下命令：

# 移除旧的安卓平台
cordova platform rm android
# 可选操作：删除残留的plugins、node_modules、package-lock.json文件避免冲突
# 重新添加安卓平台
cordova platform add android
# 重新构建应用
cordova build android

注意事项 #

• Cordova 10已经内置白名单能力，无需手动安装cordova-plugin-whitelist，重复安装会导致配置冲突，可先执行cordova plugin rm cordova-plugin-whitelist卸载残留插件
• 测试验证通过后，建议把allow-navigation的通配符*替换为实际用到的域名，提升应用安全性

内容的提问来源于stack exchange，提问作者Robert Hofmann