I am getting error in signInWithEmailAndPassword in React: Firebase: Error (auth/network-request-failed)

Viewed 28

I was creating user auth with React and writing sign in logic with signInWithEmailAndPassword in Firebase, I got this error that says Firebase: Error (auth/network-request-failed). I have no clue why this is occurring. I did attempt to disable CORS, and remove the type="submit" from my submit button, and changed the Form element to a div. Tried all, but nothing works. Is there a solution to this problem?

                        <Form.Group className="mb-3" controlId="formBasicEmail">

                            <Form.Control type="email" placeholder="Enter email" onChange={(e) => { setemail(e.target.value) }}/>

                        </Form.Group>

                        <Form.Group className="mb-3" controlId="formBasicPassword">

                            <Form.Control type="password" placeholder="Password" onChange={(e) => { setpassword(e.target.value) }}/>
                        </Form.Group>


                        <Button variant="primary" onClick={logInWithEmailAndPassword}>
                            Submit
                        </Button>
                        
                    </Form>

Here is my logic for the sign in part:

 const auth = getAuth();
    const logInWithEmailAndPassword = async (email, password) => {
        try {
          await signInWithEmailAndPassword(auth, email, password);
        } catch (err) {
          console.error(err);
          alert(err.message);
        }
      };
1 Answers

I encountered this problem couple of days ago and I also replace the submit (in short I did the same solution as yours), however this solution works on my side.

  1. I change my form component into div
  2. I replace the submit into onClick (same as yours)
  3. I wrapped the entire former form into div.

from this:

<form> ... </form>

to this:

<div>
     <div>...</div>
</div>
Related