使用 phone 号码在 Firebase 上进行身份验证

Question

我查看了 Firebase 的文档，似乎我们需要提供电子邮件来验证用户。

不过我靠phone号。

有办法吗？

Answer 1

可以使用自定义令牌，完全是任意数据

Answer 2

刚遇到这个问题..您可以将您的域添加到 phone 号码的末尾，并仍然将其作为电子邮件。 787654889@mydomain.com。确保为注册和登录添加这个。这就是我正在做的。这种方法的唯一缺点是您不能使用 firebase 提供的功能向用户发送密码重置电子邮件。您必须实施自己的服务来提供它。

Answer 3

我的用例不同。我必须允许我的用户通过邮件和 phone 号码进行登录。我是怎么做的：

在 Firebase 数据库中分别存储 emailId 和 phone 号码。

现在通过电子邮件和密码登录：

使用signInWithEmailAndpassword

通过 phone 号码和密码登录：

通过传递用户提供的 phone 否
如果没有电子邮件 ID returns，显示 phone 没有映射到任何帐户或帐户不存在的错误
收到电子邮件 ID 后，调用 signInWithEmailAndpassword 并传递收到的电子邮件和用户提供的密码

这只是我发现的一种解决方法。我仍然可以使用 Firebase 的重置密码功能:)

Answer 4

Firebase 现在支持 Phone 号码的身份验证：https://firebase.google.com/docs/auth/web/phone-auth

更新： link 用于官方 doku，因此请阅读所有说明，因为。

我建议使用 firebaseui 库，它可以为您完成所有身份验证 UI。这是网络版本：https://github.com/firebase/firebaseui-web 还有一些用于 Android 和 iOS 项目。

这里还有一个演示应用程序，您可以用来启动自己的应用程序： https://github.com/TarikHuber/react-most-wanted

它还有一个运行演示：https://www.react-most-wanted.com/ 您可以在那里尝试所有的身份验证方法。

如果使用firebaseui，实际实现起来还是很简单的。这是我的 React 组件。

import React, {Component} from 'react';
import PropTypes from 'prop-types';
import { connect } from 'react-redux';
import {injectIntl} from 'react-intl';
import { Activity } from '../../components/Activity';
import muiThemeable from 'material-ui/styles/muiThemeable';
import { push } from 'react-router-redux';
import firebase from 'firebase';
import firebaseui from 'firebaseui';
import {firebaseAuth} from '../../utils/firebase';

var authUi = new firebaseui.auth.AuthUI(firebaseAuth);

class SignIn extends Component {

  componentDidMount() {
    const {router, browser}= this.props;

    const redirect =((router || {}).location || {}).search;

    var uiConfig = {
      signInSuccessUrl: redirect.slice(1),
      signInFlow: browser.greaterThan.medium?'popup':'redirect',
      callbacks: {
        signInSuccess: function(user, credentials, redirect) {

          push(redirect || '/');

          //To avoid page reload on single page applications
          return false;
        }
      },
      signInOptions: [
        firebase.auth.GoogleAuthProvider.PROVIDER_ID,
        firebase.auth.FacebookAuthProvider.PROVIDER_ID,
        firebase.auth.TwitterAuthProvider.PROVIDER_ID,
        firebase.auth.GithubAuthProvider.PROVIDER_ID,
        firebase.auth.EmailAuthProvider.PROVIDER_ID,
        firebase.auth.PhoneAuthProvider.PROVIDER_ID
      ]
    };

    authUi.start('#firebaseui-auth', uiConfig);
    
  }

  componentWillUnmount() {
    authUi.reset();
  }

  render(){

    const  {intl} = this.props;

    return (
      <Activity
        title={intl.formatMessage({id: 'sign_in'})}>
        <div style={{paddingTop: 35, width: '100%'}}>
          <div id="firebaseui-auth" style={{width: '100%'}}></div>
        </div>
      </Activity>
    );

  }

}


SignIn.propTypes = {
  push: PropTypes.func.isRequired,
  intl: PropTypes.object.isRequired,
  router: PropTypes.object.isRequired,
  muiTheme: PropTypes.object.isRequired,
};


const mapStateToProps = (state) => {
  const {router, browser } = state;
  return {
    router,
    browser
  };
};


export default connect(
  mapStateToProps,
  { push}
)(injectIntl(muiThemeable()(SignIn)));

使用 phone 号码在 Firebase 上进行身份验证

Authenticate on Firebase with phone number

firebase