Firebase reauthenticateAndRetrieveDataWithCredential 问题

Question

方法reauthenticateAndRetrieveDataWithCredential 需要credential。

我试过了，但它给了我一个错误：

const user = firebase.auth().currentUser;
const credential = firebase.auth.OAuthCredential;
await user.reauthenticateAndRetrieveDataWithCredential(credential);
await user.updateEmail(email);
return email;

错误信息

reauthenticateAndRetrieveDataWithCredential 失败：第一个参数“凭据”必须是有效凭据。

我只有宣誓认证（没有电子邮件+密码）。所以我不知道credential firebase 需要什么。有什么帮助吗？

编辑： 出于某种原因，我的 firebase.auth.OAuthCredential 或 (firebase.auth.AuthCredential) 返回未定义。用户已登录/验证。

Answer 1

在一个 Vue.js 项目中遇到了这个问题，我们有一个 firebase.js 文件来处理 const 的模块导入和导出。

希望这将有助于某人在使用类似设置时节省时间。

文件：firebase.js

import firebase from 'firebase/app'
import 'firebase/auth'
import 'firebase/database'


// Initialize Firebase
const app = firebase.initializeApp(options)
export const fb = firebase
export const auth = app.auth()
export const db = app.database()
export const functions = app.functions()

changePassword() 在其他脚本文件或*.vue 中的示例

import { fb, auth } from './firebase.js'
...
changePassword() {
  if (yourFormValidation == true) {
    let user = auth.currentUser

    const credentials = fb.auth.EmailAuthProvider.credential(
      user.email,
      this.current_password
    )
    user.reauthenticateAndRetrieveDataWithCredential(credentials)
      .then(() => {
        user.updatePassword(this.new_password)
          .then(() => {
            console.log('your password was successfully changed.')
          })
          .catch(error => console.log(error))
      })
      .catch(error => console.log(error.message))
  }
}

我遇到Cannot read property 'credential' of undefined"...

只导入{ auth } from './firebase.js，然后调用auth.EmailAuthProvider()。

如何访问firebase.auth()上的其他课程...

1. export const fb = firebase in firebase.js

2. import { fb, auth } from './firebase.js' 编写函数的位置

3. 致电fb.auth.EmailAuthProvider.credential() 或其他需要的课程

Answer 2

documentation for reauthenticating the user 显示了这个例子：

var user = firebase.auth().currentUser;
var credential;

// Prompt the user to re-provide their sign-in credentials

user.reauthenticateAndRetrieveDataWithCredential(credential).then(function() {
  // User re-authenticated.
}).catch(function(error) {
  // An error happened.
});

您的代码未能正确实现注释。您需要提示用户再次提供他们的凭据，将其放入正确的凭据对象类型中，然后将其传入。

例如：

var credential = firebase.auth.EmailAuthProvider.credential(
    email,
    password
);

Answer 3

您需要使用订阅来观察更改。使用 AngularFire 观察他们何时登录并获取 UID（假设您在 Firebase 中使用身份验证登录，以便使用 UID 作为树路径保存所有数据。

您还可以添加设置超时以在给定时间后取消订阅

   import { AngularFirestore } from 'angularfire2/firestore';
    import { AngularFireDatabase, AngularFireList } from 'angularfire2/database';
    import { AngularFireAuth } from 'angularfire2/auth';
    import { switchMap, map } from 'rxjs/operators';
    import { Observable,  pipe } from 'rxjs';
    import { Observable, Subscription } from 'rxjs';
    import firebase as firebase from 'firebase/app';

private myOAuthSubscription: Subscription;
private myDatasubscription: Subscription;    
public userloggedin:boolean = false;
public uid:string = '';
private functionhasrun:boolean = false;

    public this.items:any = [];

    constructor(
      public _DB: AngularFireDatabase,
      public _afAuth: AngularFireAuth,
    ) {

    //check that the user is logged in 
    try {
      this.myOAuthSubscription = this._afAuth.authState.subscribe(user => {

        if (user && user.uid) {

          console.log('loggedin = true');
          this.userloggedin = true;
          this.uid = String(user.uid);

          if(this.functionhasrun==false){

           this.functionhasrun = true;
           this.funDoDB():

          }

        } else {

        console.log('loggedin = false');
        this.userloggedin = true;
        this.uid = '';

        }
      });
    } catch (e) {
      console.error("fbData_subscription", e);
    }



    }

    ngOnDestroy() {
      this.myOAuthSubscription.unsubscribe();
      this.myDatasubscription.unsubscribe();
    }


    private funDoDB(){
          if(this.userloggedin == true){
          try {

        //subscription using AngulaFire
        this.myDatasubscription = this._DB.list('myDataPath/' + this.uid).snapshotChanges().pipe(map(actions => {
            return actions.map(action => ({ key: action.key, val: action.payload.val() }));
          }))
          .subscribe(items => {

            this.items = [];
            this.items = items.map(item => item);

            console.log("db results",this.items);

            var icount=0;

            for (let i in this.items) {

             console.log("key",this.items[i].key);
             console.log("val",this.items[i].val); 
             console.log("----------------------------------);

             //checking if something exists
             if (this.items[i].key == 'SomeNodePath') {
               var log = this.items[i].val;
             }

            }


          } catch (e) {
            console.error(e);
          }


          });
        }
        }

    npm install --save angularfire2 firebase
    npm install -D rxjs@6.2.2 rxjs-compat@6.2.2