snippets-web icon indicating copy to clipboard operation
snippets-web copied to clipboard

Recaptcha Verifier throws an error

Open Mark-WebHabit opened this issue 1 year ago • 0 comments

I'm pretty sure i'm doing it right, but the RecaptchaVerifier is causing this error: TypeError: Cannot read property 'prototype' of undefined, js engine: hermes, it is written in react native: import { StatusBar } from "expo-status-bar"; import { StyleSheet, Text, View, Button } from "react-native"; import { auth } from "./firebaseConfig"; import { useRef } from "react"; import { RecaptchaVerifier, signInWithPhoneNumber } from "firebase/auth";

export default function App() { let phone = "+639612895391"; const myRef = useRef();

const generateRecaptcha = () => { window.recaptchaVerifier = new RecaptchaVerifier( myRef.current, { size: "invisible", callback: (response) => { // reCAPTCHA solved, allow signInWithPhoneNumber. // onSignInSubmit(); }, }, auth ); };

const requestOtp = () => { generateRecaptcha(); let appVerifier = window.recaptchaVerifier; signInWithPhoneNumber(auth, phone, appVerifier) .then((confirmationResult) => { // SMS sent. Prompt user to type the code from the message, then sign the // user in with confirmationResult.confirm(code). window.confirmationResult = confirmationResult; // ... console.log("success"); }) .catch((error) => { // Error; SMS not sent // ... console.log(error); }); }; return ( <View style={styles.container}> <Text>Open up App.js to start working on your app!</Text> <StatusBar style="auto" /> <View ref={myRef}></View> <Button title="request otp" onPress={requestOtp} /> </View> ); }

const styles = StyleSheet.create({ container: { flex: 1, backgroundColor: "#fff", alignItems: "center", justifyContent: "center", }, }); config: import { getAuth } from "firebase/auth"; import { initializeApp } from "firebase/app";

const firebaseConfig = { apiKey: "AIzaSyCCyEg_qMyEl-9y55DjJSlcEs3JJIbzLxc", authDomain: "authentication-4e981.firebaseapp.com", projectId: "authentication-4e981", storageBucket: "authentication-4e981.appspot.com", messagingSenderId: "1046042873971", appId: "1:1046042873971:web:d4d737ed3fc47757929a06", };

const app = initializeApp(firebaseConfig);

export const auth = getAuth(app);

Mark-WebHabit avatar May 30 '23 00:05 Mark-WebHabit