WebView（react-native-webview）在 Expo SDK36 中获取错误代码 -1答案

【问题标题】：WebView (react-native-webview) getting error code -1 in Expo SDK36WebView（react-native-webview）在 Expo SDK36 中获取错误代码 -1
【发布时间】：2020-05-20 15:43:15
【问题描述】：

我的 Expo App 的 WebViewScreen 代码：

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

export default WebViewScreen = () => (
    <WebView
        originWhitelist={['*']}
        source={{ uri: 'https://www.google.com' }}
    />
);

但是当我运行它时，我得到以下错误：

Encountered an error loading page, Object {
  "canGoBack": false,
  "canGoForward": false,
  "code": -1,
  "description": "net::ERR_CACHE_MISS",
  "loading": false,
  "target": 3,
  "title": "Web page not available",
  "url": "https://www.google.com/",
}

注意：
我的 Android 手机已连接到 wifi，并且我几乎可以在 Expo 应用程序的每个屏幕上使用后端服务器 API，这证实了 可以访问互联网并且我的应用程序有权使用互联网。

我的环境：
Android 三星手机（Android 版本 5.1.1），
EXPO SDK版本为36，
react-native-webview版本8.0.6，
Expo client app版本2.14.0

PS：
对于react-native-webview，
我没有做npm install --save react-native-webview，
相反，我用expo-cli做了expo install react-native-webview > 版本 3.11.7

PPS：我尝试在手机上通过二维码扫描从here（官方？）运行webview的expo小吃，但得到同样的错误（"code": -1）。

有人可以指导如何摆脱此错误并启动并运行 webview 吗？

【问题讨论】：

标签： javascript react-native expo react-native-webview

【解决方案1】：

您是否在清单中设置了正确的权限？

<uses-permission android:name="android.permission.INTERNET"/>

在你的情况下它应该是 App.json 文件

【讨论】：

在 Expo 应用程序中，app.json 不包含任何 <uses-permission ... > 标签，我已阅读有关 Expo 的 app.json here 的官方文档。有趣的是，我在那里发现 “要使用 Expo 支持的所有权限，请不要指定“权限”键。”，我没有。对于某些权限，我在运行时明确要求用户提供相机/位置权限。 另外请注意，我几乎可以在我的 Expo 应用程序的每个屏幕上使用后端服务器 API，这证实了我的应用程序有权使用互联网。

【解决方案2】：

您是否尝试过here 发布的临时修复？

他们说网站服务人员可能存在问题（由于 Chrome 75 中的 bug）。

解决方案是将这个 JS 脚本注入到WebView，以取消注册停滞的服务人员：

navigator.serviceWorker.getRegistrations().then(function(registrations) {
    for (let registration of registrations) {
        registration.unregister();
    }
});

【讨论】：