logo标签列表

React Native WebView被调用时导致应用崩溃

javascriptandroidreact-nativewebviewreact-native-webview
8
我正在使用 react-native-webview 库加载网页，在调试中表现良好，但当我创建发布版本并点击标签以加载 webview 时，应用程序会崩溃。以下是错误消息。我在结尾处附加了错误跟踪信息。
我正在使用： react-native: "0.62.0" react-native-webview: "^9.0.2"

sve

这是我点击按钮加载Webview屏幕时的跟踪记录。
> 2020-04-10 11:39:44.812 2584-2646/com.trackplayer E/ReactNativeJS:
> Error: crypto.getRandomValues() not supported. See
> https://github.com/uuidjs/uuid#getrandomvalues-not-supported
>     
>     This error is located at:
>         in n
>         in RCTView
>         in y
>         in Unknown
>         in Unknown
>         in Unknown
>         in Unknown
>         in RCTView
>         in S
>         in RCTView
>         in RCTView
>         in E
>         in RCTView
>         in c
>         in RCTView
>         in Unknown
>         in v
>         in Unknown
>         in w
>         in Unknown
>         in Unknown
>         in Unknown
>         in Unknown
>         in RCTView
>         in RCTView
>         in RCTView
>         in RCTView
>         in k
>         in ForwardRef
>         in PanGestureHandler
>         in RCTView
>         in k
>         in ForwardRef
>         in RCTView
>         in D
>         in Unknown
>         in RCTView
>         in C
>         in RCTView
>         in H
>         in S
>         in h
>         in RNCSafeAreaView
>         in Unknown
>         in Unknown
>         in GestureHandlerRootView
>         in Unknown
>         in b
>         in Unknown
>         in O
>         in Unknown
>         in ForwardRef
>         in Unknown
>         in ForwardRef
>         in S
>         in RCTView
>         in RCTView
>         in E 2020-04-10 11:39:44.818 2584-2646/com.trackplayer E/ReactNativeJS: Error: crypto.getRandomValues() not supported. See
> https://github.com/uuidjs/uuid#getrandomvalues-not-supported
>     
>     This error is located at:
>         in n
>         in RCTView
>         in y
>         in Unknown
>         in Unknown
>         in Unknown
>         in Unknown
>         in RCTView
>         in S
>         in RCTView
>         in RCTView
>         in E
>         in RCTView
>         in c
>         in RCTView
>         in Unknown
>         in v
>         in Unknown
>         in w
>         in Unknown
>         in Unknown
>         in Unknown
>         in Unknown
>         in RCTView
>         in RCTView
>         in RCTView
>         in RCTView
>         in k
>         in ForwardRef
>         in PanGestureHandler
>         in RCTView
>         in k
>         in ForwardRef
>         in RCTView
>         in D
>         in Unknown
>         in RCTView
>         in C
>         in RCTView
>         in H
>         in S
>         in h
>         in RNCSafeAreaView
>         in Unknown
>         in Unknown
>         in GestureHandlerRootView
>         in Unknown
>         in b
>         in Unknown
>         in O
>         in Unknown
>         in ForwardRef
>         in Unknown
>         in ForwardRef
>         in S
>         in RCTView
>         in RCTView
>         in E 2020-04-10 11:39:44.822 2584-2647/com.trackplayer E/unknown:ReactNative: Error: crypto.getRandomValues() not supported.
> See https://github.com/uuidjs/uuid#getrandomvalues-not-supported
>     
>     This error is located at:
>         in n
>         in RCTView
>         in y
>         in Unknown
>         in Unknown
>         in Unknown
>         in Unknown
>         in RCTView
>         in S
>         in RCTView
>         in RCTView
>         in E
>         in RCTView
>         in c
>         in RCTView
>         in Unknown
>         in v
>         in Unknown
>         in w
>         in Unknown
>         in Unknown
>         in Unknown
>         in Unknown
>         in RCTView
>         in RCTView
>         in RCTView
>         in RCTView
>         in k
>         in ForwardRef
>         in PanGestureHandler
>         in RCTView
>         in k
>         in ForwardRef
>         in RCTView
>         in D
>         in Unknown
>         in RCTView
>         in C
>         in RCTView
>         in H
>         in S
>         in h
>         in RNCSafeAreaView
>         in Unknown
>         in Unknown
>         in GestureHandlerRootView
>         in Unknown
>         in b
>         in Unknown
>         in O
>         in Unknown
>         in ForwardRef
>         in Unknown
>         in ForwardRef
>         in S
>         in RCTView
>         in RCTView
>         in E, stack:
>     default@717:132
>     f@722:329
>     n@714:2621
>     Bn@92:31529
>     ui@92:49357
>     ja@92:72034
>     Oa@92:71959
>     Ia@92:69253
>     Ia@-1
>     <unknown>@92:25480
>     unstable_runWithPriority@183:3503
>     dn@92:25427
>     fn@92:25362
>     Pe@92:90879
>     Re@92:13478
>     Ie@92:13664
>     receiveTouches@92:14448
>     value@27:3544
>     <unknown>@27:840
>     value@27:2798
>     value@27:812
>     value@-1 2020-04-10 11:39:44.831 2584-2647/com.trackplayer E/AndroidRuntime: FATAL EXCEPTION: mqt_native_modules
>     Process: com.trackplayer, PID: 2584
>     com.facebook.react.common.JavascriptException: Error: crypto.getRandomValues() not supported. See
> https://github.com/uuidjs/uuid#getrandomvalues-not-supported
>     
>     This error is located at:
>         in n
>         in RCTView
>         in y
>         in Unknown
>         in Unknown
>         in Unknown
>         in Unknown
>         in RCTView
>         in S
>         in RCTView
>         in RCTView
>         in E
>         in RCTView
>         in c
>         in RCTView
>         in Unknown
>         in v
>         in Unknown
>         in w
>         in Unknown
>         in Unknown
>         in Unknown
>         in Unknown
>         in RCTView
>         in RCTView
>         in RCTView
>         in RCTView
>         in k
>         in ForwardRef
>         in PanGestureHandler
>         in RCTView
>         in k
>         in ForwardRef
>         in RCTView
>         in D
>         in Unknown
>         in RCTView
>         in C
>         in RCTView
>         in H
>         in S
>         in h
>         in RNCSafeAreaView
>         in Unknown
>         in Unknown
>         in GestureHandlerRootView
>         in Unknown
>         in b
>         in Unknown
>         in O
>         in Unknown
>         in ForwardRef
>         in Unknown
>         in ForwardRef
>         in S
>         in RCTView
>         in RCTView
>         in E, stack:
>     default@717:132
>     f@722:329
>     n@714:2621
>     Bn@92:31529
>     ui@92:49357
>     ja@92:72034
>     Oa@92:71959
>     Ia@92:69253
>     Ia@-1
>     <unknown>@92:25480
>     unstable_runWithPriority@183:3503
>     dn@92:25427
>     fn@92:25362
>     Pe@92:90879
>     Re@92:13478
>     Ie@92:13664
>     receiveTouches@92:14448
>     value@27:3544
>     <unknown>@27:840
>     value@27:2798
>     value@27:812
>     value@-1
>     
>         at com.facebook.react.modules.core.ExceptionsManagerModule.reportException(ExceptionsManagerModule.java:79)
>         at java.lang.reflect.Method.invoke(Native Method)
>         at com.facebook.react.bridge.JavaMethodWrapper.invoke(JavaMethodWrapper.java:372)
>         at com.facebook.react.bridge.JavaModuleWrapper.invoke(JavaModuleWrapper.java:151)
>         at com.facebook.react.bridge.queue.NativeRunnable.run(Native Method)
>         at android.os.Handler.handleCallback(Handler.java:883)
>         at android.os.Handler.dispatchMessage(Handler.java:100)
>         at com.facebook.react.bridge.queue.MessageQueueThreadHandler.dispatchMessage(MessageQueueThreadHandler.java:27)
>         at android.os.Looper.loop(Looper.java:214)
>         at com.facebook.react.bridge.queue.MessageQueueThreadImpl$4.run(MessageQueueThreadImpl.java:226)
>         at java.lang.Thread.run(Thread.java:919) 2020-04-10 11:39:44.850 2584-2647/com.trackplayer I/Process: Sending signal. PID:
> 2584 SIG: 9
7个回答
10

新版本似乎存在一个错误，但根据这份文档（https://github.com/react-native-community/react-native-webview/issues/1312），可以通过以下方法解决：

首先安装react-native-get-random-values，然后在文件顶部导入它。

import 'react-native-get-random-values';
import React, { Component } from 'react';
import { WebView } from 'react-native-webview';
import {
  StyleSheet,
  View,
  Text,
} from 'react-native';

export default class MyWeb extends Component {
  render() {
    return (
      <View style={{ backgroundColor: 'blue',flex: 1 }}>
        <WebView
          source={{ uri: 'https://url.ngrok.io' }}
          style={{ marginTop: 20, }}
        />
      </View>
    );
  }
}
6

安装 'react-native-get-random-values' 包。

然后在你的 React Native 应用程序入口文件中添加 "import 'react-native-get-random-values'"，例如使用 React Native CLI 创建应用程序时的 index.js 文件。

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

class MyWebComponent extends Component {
    render() {
        return <WebView source={{ uri: 'https://reactnative.dev/' }} />;
    }
}
3
我在将react-native-webview升级到版本9.1.3后遇到了同样的错误，降级到9.1.1后错误消失。未检查版本9.1.2。
2020年4月12日更新。 在版本9.1.4中该错误仍然存在。按照下面描述的方式使用'react-native-get-random-values'可以解决问题。我正在使用CLI版本。
2020年4月24日更新。 在版本9.2.2中，该错误已经被修复。我删除了“react-native-get-random-values”包，所有功能正常运行。
我安装了9.0.2版本。我不知道为什么npm安装了这个较低的版本，但是我通过以下答案解决了这个错误。 - Muhammad Ehtesham Anwar
我可以确认版本9.1.2无法工作并出现错误，但版本9.1.1运行良好。 - Arvind Sedha
3

解决了我的问题: `react-native-webview : "8.0.4",

3
将属性 androidHardwareAccelerationDisabled={true} 添加到 webview。
<WebView
   source={{ uri: 'https://reatnative.com' }}
   androidHardwareAccelerationDisabled={true}
/>
这对我有效，针对这个看起来与使用react-native-screens组合时发生的错误。 - Sebastiaan
1

这对我有用。我只是使用了它。

 expo install react-native-webview
 "react-native-webview": "8.1.1"

 import { WebView } from 'react-native-webview'
 <WebView source={{ uri: 'https://expo.io' }} style={{ marginTop: 20, height: 500 }} />
0

安装react-native-get-random-values包。然后，尝试将导入移动到文件的顶部。

index.js

这种方式对我有效...

import 'react-native-get-random-values';
import {AppRegistry} from 'react-native';
import App from './App';
import {name as appName} from './app.json';

AppRegistry.registerComponent(appName, () => App);
网页内容由stack overflow 提供, 点击上面的
可以查看英文原文，
原文链接