1

I am attempting to implement login functionality using Firebase auth, in NextJS. Calling the function with invalid login details logs an error to the console, despite the empty catch statement in the handler for the login function. How do I suppress Firebase from logging this error to the console?

Login function handler:

const signinWithEmail = async (email, password) => {
    setLoading(true);
    signInWithEmailAndPassword(auth, email, password)
        .then((response) => {
            handleUser(response.user);
            Router.push("/");
        })
        .catch((error) => {
            // Do nothing
        });
};

Error in console (blurred due to exposed API key):

enter image description here

Dharmaraj
  • 47,845
  • 8
  • 52
  • 84
Hassan A
  • 337
  • 2
  • 10

1 Answers1

3

Those network error logs are shown by the browser when the request returns an error. The catch block in code still works as intended. This can be disabled but by users themselves. Checkout: Suppress Chrome 'Failed to load resource' messages in console

The API key visible in the request is meant to be public and that's not an issue. Checkout: Is it safe to expose Firebase apiKey to the public?

Dharmaraj
  • 47,845
  • 8
  • 52
  • 84
  • I see, thanks for your reply. I suppose the only workaround here would be to fiddle around with API routes in Next so a 200 is returned every time, regardless of valid/invalid sign-in. – Hassan A Feb 12 '22 at 13:13
  • Using `console.clear()` is one way i.e. clearing console from the catch block but that doesn't work if user has preserve logs enabled. – Dharmaraj Feb 12 '22 at 13:14