javascript - Getting 'Uncaught' after catching error in firebase.auth() with async - Stack Overflow

admin管理员组

文章数量:1327665

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

This is an action in Vuex. When this runs, I expect the mit('seteError', err) to be a valid error handler for the error returned from catch (err). Instead, I get an 'Uncaught' exception and execution stops.

Would appreciate any insights from anyone who managed to use async with firebase.auth()

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

This is an action in Vuex. When this runs, I expect the mit('seteError', err) to be a valid error handler for the error returned from catch (err). Instead, I get an 'Uncaught' exception and execution stops.

Would appreciate any insights from anyone who managed to use async with firebase.auth()

• javascript
• firebase
• async-await
• firebase-authentication

Share Improve this question Follow asked Aug 13, 2018 at 9:37 Cesar Martinez DominguezCesar Martinez Dominguez 49655 silver badges2121 bronze badges 4

• Please include your Exception/Error as a Code Sample ({}) in your Question. Is the Exception really just 'Uncaught'? – Luca Kiebel Commented Aug 13, 2018 at 9:38
• Indeed, that's the whole message: Uncaught K {ob: Observer}. Here K is the error object returned by err, which I'm passing to mit – Cesar Martinez Dominguez Commented Aug 13, 2018 at 9:43
• 1 I have the same issue. Uncaught L {code: "auth/invalid-email", message: "The email address is badly formatted."}. Cesar, did you ever find an answer? – Justin Noel Commented Oct 23, 2018 at 11:58
• I'm having the same issue. Uncaught Bg {code: "auth/account-exists-with-different-credential", message: "An account already exists with the same email addr…ng a provider associated with this email address.", email: "XXXXXX", credential: Vf}. I am catching the error and can log it, but it still shows up as uncaught... – Pascal Commented Jan 8, 2019 at 22:50

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 11

I ran into the same issue today - it appears to be due to the implementation of the Closure promise library that firebase auth uses. There is a closed issue in the firebase-js-sdk project here with some details on it. Ultimately, what is happening with this implantation is a timeout is getting set that throws an exception outside of the scope of the try/catch:

To avoid this, the exception needs to be handled by calling .catch() on the returned promise e.g.:

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

As I have all of my firebase logic wrapped and centralized, what I ended up doing is wrapping the firebase Promise in one of my own:

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

The wrapper function can then be called using async await:

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

This is how I managed to handle firebase authentication with async in Vuex. I needed to use onAuthStateChanged

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

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

Where the 'session' dispatch simply does:

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

and the userInSession function uses onAuthStateChanged:

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

本文标签： javascriptGetting 39Uncaught39 after catching error in firebaseauth() with asyncStack Overflow