使用React JS进行Firebase手机号码身份验证

时间:2018-12-14 07:24:27

标签: reactjs firebase-authentication

我正在尝试使用react js设置firebase移动身份验证的响应。

注册页面有问题。 初始化RecaptchaVerifier时遇到类似这样的错误

TypeError:
_WEBPACK_IMPORTED_MODULE_2__FirbaseAuthAPi_js__.a.auth.RecaptchaVerifier is not a constructor
  

Test.js文件在下面

  import React, { Component } from 'react';
import ReactDOM from "react-dom";
import firebase from "./FirbaseAuthAPi"

export default class Test extends Component {
    componentDidMount()
    {
let window='';
        firebase.auth().languageCode = 'india';
        var phoneNumber ="mobilenumber";
        var appVerifier = window.recaptchaVerifier;
        window.recaptchaVerifier = new firebase.auth.RecaptchaVerifier('sign-in-button', {
            'size': 'invisible',
            'callback': function(response) {
                // reCAPTCHA solved, allow signInWithPhoneNumber.
                onSignInSubmit();
            }
        });


        firebase.auth().signInWithPhoneNumber(phoneNumber, appVerifier)
            .then(function (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(confirmationResult);
                var code = prompt("Please enter your code", " verification");
                confirmationResult.confirm(code).then(function (result) {
                    // User signed in successfully.
                    console.log("verification sucess");
                    var user = result.user;
                    console.log(result)
                    // ...
                }).catch(function (error) {
                    console.log('verification faild')
                    // User couldn't sign in (bad verification code?)
                    // ...
                });



            }).catch(function (error) {
            console.log('err');
        });

    }
    render(){
        return(
            <div id="sign-in-button"> </div>
        )
    }
}


if (document.getElementById('example')) {

    ReactDOM.render(<Test />, document.getElementById('example'));
}
  

firebaseauthApi.js

import firebase from "firebase";
import 'firebase/auth';



const config = {
    apiKey: "key",
    authDomain: "doamin",
    databaseURL: "dburl",
    projectId: "projectid",
    storageBucket: "buckedid",
    messagingSenderId: "messagingSenderId"
};
export default firebase.initializeApp(config);

任何人都可以提供有关如何在响应中使用Firebase手机号码身份验证的示例的帮助。

0 个答案:

没有答案