CODEWITHSUNDEEP
react-nativeexporeact-native-webview
jsnid00
jsnid00

Reputation: 686

crypto.getRandomValues() not supported

I'm getting this error with npm [email protected] 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?

Upvotes: 35

Views: 44598

Answers (9)

Abhay Agnihotri
Abhay Agnihotri

Reputation: 1

For me including this statement at top import "react-native-get-random-values"; in the file where i am using the GooglePlacesAutocomplete Resolved the problem.

Upvotes: 0

Edi
Edi

Reputation: 2301

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

import 'react-native-get-random-values';
import { v4 as uuidv4 } from 'uuid';

Upvotes: 44

alireza
alireza

Reputation: 546

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')

Upvotes: 2

Jatin Gambhir
Jatin Gambhir

Reputation: 119

  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.

Upvotes: 11

Rodrigo Mathias
Rodrigo Mathias

Reputation: 3

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

Upvotes: 0

HussoM
HussoM

Reputation: 1312

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.

Upvotes: 8

Jocelyn Nsa
Jocelyn Nsa

Reputation: 502

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

Upvotes: 0

Ooi Li Ching
Ooi Li Ching

Reputation: 96

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.

Upvotes: 8

Kaloyan Kosev
Kaloyan Kosev

Reputation: 13067

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?

Upvotes: 1

Related Questions