能否向已构建的React Native应用WebView注入JavaScript？

1. 优先禁用JavaScript（业务允许的话） #

如果你的WebView不需要运行任何JavaScript，直接关闭JS支持是最彻底的防护手段：

<WebView
  source={{ uri: 'https://your-trusted-site.com' }}
  javaScriptEnabled={false}
/>

这样任何注入的JS代码都无法执行，从根源上消除风险。

2. 严格限制加载的域名 #

通过originWhitelist只允许信任的域名加载资源，拒绝所有未授权的来源：

<WebView
  source={{ uri: 'https://your-trusted-site.com' }}
  originWhitelist={['https://your-trusted-site.com', 'https://another-safe-domain.org']}
/>

非白名单内的域名会被直接拦截，避免恶意页面加载后注入JS。

3. 过滤用户可控的输入与通信 #

如果必须启用JavaScript，需严格处理WebView和原生的通信，以及动态加载的内容：

• 处理onMessage回调时，不要直接将收到的内容作为JS执行，必须做严格的格式校验和过滤；
• 动态生成HTML内容时，绝对不要拼接用户输入的内容，避免XSS注入。比如禁用这种危险写法：

  // 危险：直接拼接用户输入
  const html = `<div>${userInput}</div>`;
  

  改用安全的方式插入内容，比如React的JSX（本地HTML场景）或DOM转义函数处理用户输入。

4. 禁用危险的系统权限 #

在Android和iOS的原生配置中关闭高风险权限：

• Android：在AndroidManifest.xml中配置WebView禁用文件访问：

  <webview
    android:allowFileAccess="false"
    android:allowUniversalAccessFromFileURLs="false"
  />
  

• iOS：在原生代码中设置allowsFileAccess为false：

  webView.configuration.allowsFileAccess = false
  

这些权限如果开启，可能让恶意JS访问本地文件，进而执行注入攻击。

5. 避免使用不可信的第三方WebView扩展 #

不要随意引入第三方WebView插件或自定义封装，除非完全信任其代码实现——很多第三方组件可能默认开启危险配置，或存在未被发现的漏洞。

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