FirebaseUI doesn't allow users to sign-in to an existing account

104 Views Asked by At

So I have a FirebaseUI web app that allows users to create an account. However, when a user tries to sign-in to an account that they created, it asks them to change the password - specifically, it says "This email already exists without any means of sign-in. Please reset the password to recover.". I've already made an iOS app with the same Firebase project, and I don't have the problem in the iOS app. It only appears on the Webapp. I've seen other Stack overflow posts with the same problem (FirebaseUI only allowing users to create an account but not sign-in to exsiting account). The solution recommended is to clear email enumeration protection. However, I have this already cleared, and it still doesn't work. The program is below:

<!DOCTYPE html>
<html lang="en">
<head>
  <script src="https://www.gstatic.com/firebasejs/ui/6.0.1/firebase-ui-auth.js"></script>
  <link type="text/css" rel="stylesheet" href="https://www.gstatic.com/firebasejs/ui/6.0.1/firebase-ui-auth.css" />
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Firebase Signup</title>
    <!-- The core Firebase JS SDK is always required and must be listed first -->
  <script src="https://www.gstatic.com/firebasejs/8.6.8/firebase-app.js"></script>
  <script src="https://www.gstatic.com/firebasejs/8.6.8/firebase-auth.js"></script>
    <!-- Replace the following config with your Firebase project configuration -->
    <script>
const firebaseConfig = {
.... my config
};

        // Initialize Firebase
        firebase.initializeApp(firebaseConfig);
    </script>
</head>
<body>
    <div id="signup-container">
        <h1>Firebase Signup</h1>
        <form id="signup-form">
            <label for="email">Email:</label>
            <input type="email" id="email" required>

            <label for="password">Password:</label>
            <input type="password" id="password" required>

            <button type="submit">Sign Up</button>
        </form>
    </div>

    <script>
        document.getElementById('signup-form').addEventListener('submit', function (e) {
            e.preventDefault();

            const email = document.getElementById('email').value;
            const password = document.getElementById('password').value;

            // Create user with email and password
            firebase.auth().createUserWithEmailAndPassword(email, password)
                .then((userCredential) => {
                    // Signed up
                    const user = userCredential.user;
                    console.log("Signed up as:", user.email);
                    // Redirect or perform other actions upon successful signup
                })
                .catch((error) => {
                    const errorCode = error.code;
                    const errorMessage = error.message;
                    console.error("Signup error:", errorCode, errorMessage);
                    // Handle signup error (e.g., display an error message)
                });
        });
    </script>
</body>
</html>
1

There are 1 best solutions below

1
Doug Stevenson On

The code you're showing tries to create a new account using createUserWithEmailAndPassword. That won't work if there is already an account with the same email address. If you just want someone to be able to sign in to an existing account using email and password, then you should follow the examples using signInWithEmailAndPassword in the documentation.