19

I'm getting this error with npm react-native-webview@9.0.1 when I try to generate a QR code with react-native-qrcode-generator

I'm using react-native with an expo managed workflow. And the thing is it works on iOS, and i only get the error on Android

I searched for a solution myself and I tried installing react-native-get-random-values but that also didn't work.

Any thoughts?

jsnid00
  • 528
  • 1
  • 4
  • 8

8 Answers8

27

React Native

Install react-native-get-random-values
Import it before uuid:

import 'react-native-get-random-values';
import { v4 as uuidv4 } from 'uuid';
Edi
  • 1,900
  • 18
  • 27
6

I just had the same issue on android. Works fine on iOS.

I solved it with:

  1. Uninstall the existing one npm uninstall react-native-webview
  2. Use expo install react-native-webview instead.
Ooi Li Ching
  • 76
  • 2
6
  1. Install react-native-get-random-values using this command- 
    npm install react-native-get-random-values
  2. Import react-native-get-random-values before uuid like this- 
    import "react-native-get-random-values";
import { v4 as uuidv4 } from "uuid";

It worked for me. I hope it will work for you as well.

Jatin Gambhir
  • 61
  • 1
  • 2
4

Here is what worked for me

  1. Install react-native-get-random-values

    npm install --save react-native-get-random-values

  2. Import react-native-get-random-values before webview import (VERY IMPORTANT)

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

For more information, please read this issue.

HussoM
  • 1,272
  • 13
  • 7
1

I made a snack with Expo SDK 37 and the exact versions you mention:

{
  "dependencies": {
    "react-native-webview": "9.0.1",
    "react-native-qrcode-generator": "1.2.1"
  }
}

It works just fine on my Android phone. The issue must be somewhere else in your implementation.

If you've changed versions recently, try to delete your node_modules and install packages again. Double-check my example and let me know if you do something different?

Kaloyan Kosev
  • 12,483
  • 8
  • 59
  • 90
  • 1
    Thanks, i checked the snack and it worked and then updated to react-native-webview@9.0.1 and it also worked so it must have been some other dependancy **So the moral here is that it wasn't an issue with react-native-webview** – jsnid00 Apr 13 '20 at 05:26
  • @jsnid00 I replied quicker. I double-checked with you the versions of the libraries. I created a snack to double-check and proof that it works. My answer was correct. I spent a lot of effort to help and I'm quite disappointed that you actually marked the other answer as "accepted", but not mine :( I don't think that's fair. – Kaloyan Kosev Apr 14 '20 at 16:34
0

Try to use : npm install --save react-native-webview
It's works for me.

Jocelyn Nsa
  • 474
  • 6
  • 10
0

They fixed it in the webview tag 9.2.2, as shown in the changelog https://github.com/react-native-community/react-native-webview/releases/tag/v9.2.2

Rodrigo Mathias
  • 3
  • 2
0

I spent 2 days to solve the issue, I have inlineRequires: false, in metro config and changing it breaks the app.

I installed yarn add react-native-get-random-values.

Then imported react-native-get-random-values before crypto-js but it didn't work.

After hours of debugging, I found it's Babel's compiling order issue. crypto-js is always compiled earlier than react-native-get-random-values. In another word crypto-js looks for global.crypto before react-native-get-random-values assigns it. imports compile with higher priority than the rest of codes.

My file was:

import 'react-native-get-random-values'
import crypto from 'crypto-js`

The fix was lowering the compile order of crypto-js to make sure it compiles after global.crypto is assigned:

import 'react-native-get-random-values'
const crypto = require('crypto-js')
alireza
  • 518
  • 5
  • 15