使用异步捕获firebase.auth（）中的错误后获取“未捕获”

Question

async login({ commit }, { email, password }) {
  let result
  try {
    result = await firebase.auth().signInWithEmailAndPassword(email, password)
    commit('setUser', result.user)
  } catch (err) {
    commit('setError', err)
  }
}

这是Vuex中的操作。运行此程序时，我希望commit('seteError', err)是从catch (err)返回的错误的有效错误处理程序。相反，我遇到了“未捕获”异常，执行停止。

对于将async与firebase.auth()结合使用的任何人的见解，我们将不胜感激。

Answer 1

这是我在Vuex中设法通过异步处理Firebase身份验证的方式。我需要使用onAuthStateChanged

async login({ commit, dispatch }, { email, password }) {
  try {
    await firebase.auth().signInWithEmailAndPassword(email, password)

    await dispatch('session')
  } catch (err) {
    commit('setError', err)
  }
}

“会话”分派只是在哪里执行：

async session({ commit }) {
  let user
  try {
    user = await userInSession()
    commit('setUser', user)
  } catch (err) {
    console.error(err)
    commit('setUser', {})
  }
}

并且userInSession函数使用onAuthStateChanged：

const userInSession =  function () {
  return new Promise((resolve, reject) => {
    firebase.auth().onAuthStateChanged((user) => {
      if (user) {
        resolve(user.uid)
      } else {
        reject(Error('No user authenticated'))
      }
    })
  })
}

Answer 2

我今天遇到了同样的问题-这似乎是由于Firebase auth使用的Closure Promise库的实现所致。 firebase-js-sdk项目here中有一个封闭的问题，其中有一些详细信息。最终，这种植入发生的是超时设置，该超时抛出了try/catch范围之外的异常：

为避免这种情况，需要通过对返回的承诺调用.catch()来处理异常，例如：

firebase.auth().signInWithEmailAndPassword(email, password)
  .catch((ex) => { /* handle exception */ });

由于我将所有Firebase逻辑打包并集中，最终我要做的是将Firebase Promise打包为自己的一个：

export async function signIn(email, password) {
  return new Promise((resolve, reject) => {
    firebase.auth().signInWithEmailAndPassword(email, password)
      .then((userCreds) => resolve(userCreds))
      .catch((reason) => reject(reason));
  });
}

然后可以使用async await调用包装函数：

try {
  const result = await signIn(email, password)
  // Do what you need to with the result
} catch (ex) {
  // Handle any exceptions
}