Error: verifier._reset is not a function. when trying to Sign in with phone using firebase, react native and Expo

user_13203322 0
Viewed 915

I am trying to implement Phone Sign In in mu react native app, but I am getting the following error:

verifier._reset is not a function. (In 'verifier._reset()', 'verifier._reset' is undefined)
at http://192.168.1.2:19000/node_modules/expo/AppEntry.bundle?platform=android&dev=true&hot=false&minify=false:126633:27 in <unknown>
at node_modules/tslib/tslib.js:60:8 in createExporter
at node_modules/tslib/tslib.js:18:0 in <global>
at http://192.168.1.2:19000/node_modules/expo/AppEntry.bundle?platform=android&dev=true&hot=false&minify=false:116838:35 in rejected

This is how I have tried to implement the signing:


const SignUp = () => {
    const [phoneNumber, setPhoneNumber] = useState("")
    const recaptchaVerifier = React.useRef(null);
    const auth = getAuth(app)

    const sendCode = async () => {
        console.log(recaptchaVerifier.current)
        signInWithPhoneNumber(auth, phoneNumber, recaptchaVerifier.current!)
            .then(r => {
            console.log("Hej!")
        }).catch(err=>{
            console.log(err)
        })
    }

    return (
        <SafeAreaView
        style={tw.style('w-full')}>
            <FirebaseRecaptchaVerifierModal
                ref={recaptchaVerifier}
                firebaseConfig={app.options}
                attemptInvisibleVerification={true}
            />
            <TextInput
                style={tw.style('w-1/2', 'shadow', 'border', 'rounded', 'py-2', 'px-3', 'text-gray-700')}
                onChangeText={setPhoneNumber}
                keyboardType="phone-pad"
            />
           <Button title={"Send Code"} onPress={sendCode}/>
        </SafeAreaView>
    )

}

export default SignUp

I have also tried to implement it like this: const phoneProvider = new PhoneAuthProvider(auth) const verificationId = await phoneProvider.verifyPhoneNumber(phoneNumber, recaptchaVerifier.current!) but I get the same result.

I am all out of ideas, so any help would be much appreciated.

expo firebase-authentication react-native
4 Answers

Updating to the latest version of expo-firebase-recaptcha should fix it.

user_62460740

Open this file: node_modules\expo-firebase-recaptcha\build\FirebaseRecaptchaVerifier.js And add

export default class FirebaseRecaptchaVerifier {
    token;
    constructor(token) {
        this.token = token;
    }
    get type() {
        return 'recaptcha';
    }
    async verify() {
        return this.token;
    }
    async _reset(){
    }
}

add the _reset() function there and save it! the error will be fixed.

user_80707680

This answer is close, but even after patching the package I had the same problem. This appears to be a recent issue, and the OP is using the Modal form, not the raw verifier.

Instead, add the following to node_modules/expo-firebase-recaptcha/build/FirebaseRecaptchaVerifierModal.js around line 31:


    async _reset() {
        return
    }
user_45634600

Just update your expo package, it has been resolve. (see here)

user_158319860
Related