无法在 React Native canOpenURL 上使用 WebView 打开本地 html 文件：URL 失败答案

【问题标题】：Cant open local html file with WebView on React Native canOpenURL: failed for URL无法在 React Native canOpenURL 上使用 WebView 打开本地 html 文件：URL 失败
【发布时间】：2020-01-29 17:49:23
【问题描述】：

    2020-01-29 20:32:22.470194+0300 Myapp[8905:2391245] 
-canOpenURL: failed for URL: "file:///private/var/containers/Bundle/Application/146EA027-7A**/Myapp.app/assets/src/assets/policy.html" - error: "This app is not allowed to query for scheme file"

我在 真实设备 上的 xCode 控制台输出中收到此错误。在模拟器上，一切正常。

这是我的简单完整代码：

import React, { Component } from 'react';
import { WebView } from 'react-native-webview';

const PolicyHTML = require('../assets/policy.html');



export default class PolicyScreen extends React.Component {


  render() {
    return (
            <WebView
            source={PolicyHTML}
            style={{flex: 1}}
            />
    );
  }
}

在网上找不到太多解决方案，我错过了什么？

【问题讨论】：

您是否将此 HTML 文件作为资源/资产添加到您的 XCode 项目中？
没有。它仅在反应项目文件夹中

标签： reactjs xcode react-native uiwebview react-native-ios

【解决方案1】：

我的解决方案是在<WebView> 组件中添加originWhitelist={['*']}，然后iOS 会正确加载HTML。

【讨论】：

【解决方案2】：

我遇到了同样的问题，我正在使用 webview 并想在该 webview 中加载我的本地 html 文件，该文件在 Android 中运行良好，但在 IOS 设备中却没有。经过大量研究，我最终得到了以下解决方案。

我已将我的 html 文件放在以下路径中：

MyReactNativeProjectFolder>app>views>monthly>trip.html

monthly 是我自己创建的自定义文件夹，其中有一个名为 trip.html 的本地 html 文件。

在视图中，让我们说 MyView.js，我想在其中调用我的 html 文件，我使用了以下语法：

<WebView originWhitelist={['*']} source={require('./monthly/trip.html')} ref={( webView1 ) => this.webView1 = webView1} />

MyView.js 位于以下路径中：

 MyReactNativeProjectFolder>app>views>MyView.js

如果您在模拟器上没有收到任何错误，那么这将解决您的问题，否则请尝试更改我上面提到的 html 文件路径，即在 views 文件夹中，然后重试。

我希望这可以解决错误无法打开 URL 文件：///private/var/containers/Bundle/Application/146EA027-7A/Myapp.app/assets/src/assets/policy.html

【讨论】：

【解决方案3】：

我不知道这是否可以被认为是正确的解决方案，但这里我是如何解决的；

我不确定，但由于我认为 Xcode 不允许在 html 文件上使用某些代码，所以我想到在 google 上发现了一些网站，它们将 html 文件转换为“干净的 html 文件”并删除了不必要的代码。清理后，我用旧文件替换了新的清理文件，它工作正常。

希望它有所帮助（尤其是在隐私政策文件中）。

【讨论】：