CODEWITHSUNDEEP
javascriptfirebasewebfirebase-realtime-database
kunal kumar barman
kunal kumar barman

Reputation: 13

Data is not going to firebase database in javascript

Here i am using firebase auth , so i also upload the data given by the user into the firebase real time database but my data is going one time only when a server is started , and if i add more user in one time when serer is started then data is not going to firebase and even not showing any short of error , working smothly. One warning is coming. enter image description here

I dont know where is the problem , as user.uid is also printing well and username is also printing well.

This is my code

<html>

<head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Firebase Server Auth</title>
    <link rel="stylesheet" href="/css/mvp.css" type="text/css" />

    <script src="https://cdn.jsdelivr.net/npm/js-cookie@rc/dist/js.cookie.min.js"></script>

</head>

<body>

    <section>
        <form id="signup">
            <label>
                    Username
                </label>

            <input type="text" name="username" id="username" required/>
            <label>Full Name</label>
            <input type="text" name="name" id="name" required/>

            <label>Email</label>
            <input type="text" name="email" id="email" required/>
            <label>Contact</label>
            <input type="number" name="phone" id="phone" required/>



            <label>Password</label>
            <input type="password" name="password" id="password" required/>
            <button type="submit" id="signup">Sign up</button>

        </form>
        <form action="/login" method="GET">
            <button type="submit">Having Account</button>
        </form>
    </section>
    <script src="https://www.gstatic.com/firebasejs/7.15.0/firebase-app.js"></script>
    <script src="https://www.gstatic.com/firebasejs/7.15.0/firebase-auth.js"></script>
    <script src="https://www.gstatic.com/firebasejs/7.15.0/firebase-database.js"></script>



    <script>
        var firebaseConfig = {
            apiKey: "",
            authDomain: "",
            databaseURL: "",
            projectId: "",
            storageBucket: "",
            messagingSenderId: "",
            appId: "",
            measurementId: ""
        };
        // Initialize Firebase
        firebase.initializeApp(firebaseConfig);

        firebase.auth().setPersistence(firebase.auth.Auth.Persistence.NONE);

        document
            .getElementById("signup")
            .addEventListener("submit", (event) => {
                event.preventDefault();
                var email = document.getElementById("email").value;
                var password = document.getElementById("password").value;
                var username = document.getElementById("username").value;
                var name = document.getElementById("name").value;
                var phone = document.getElementById("phone").value;

                firebase
                    .auth()
                    .createUserWithEmailAndPassword(email, password)
                    .then(({
                        user
                    }) => {
                        console.log(user.uid)
                        console.log(username);

                        firebase.database().ref(user.uid).set({
                            "Username": username,
                            "Name": name,
                            "Phone": phone,
                            "Email": email
                        });

                        return user.getIdToken().then((idToken) => {
                            return fetch("/sessionLogin", {
                                method: "POST",
                                headers: {
                                    Accept: "application/json",
                                    "Content-Type": "application/json",
                                    "CSRF-Token": Cookies.get("XSRF-TOKEN"),
                                },
                                body: JSON.stringify({
                                    idToken
                                }),
                            });
                        });
                    })
                    .then(() => {
                        window.location.assign("/login");
                    }).catch(err => {
                        alert("Email Already exist");
                        window.location.assign("/login");
                        console.log(err);
                    })
                return false;
            });
    </script>
</body>

</html>

Upvotes: 0

Views: 104

Answers (1)

Renaud Tarnec
Renaud Tarnec

Reputation: 83058

It is probably because you assign the submit type to your button: your form is submitted before the createUserWithEmailAndPassword() Firebase method is triggered.

You should change the button type to button (See the W3 specification for more detail on button types).

Something like the following (untested):

    <form id="signup">
        //...
        <button type="button" id="signupButton">Sign up</button>

    </form>


    //...

<script>
    var firebaseConfig = {
      //...
    };
    // Initialize Firebase
    //...

    document
        .getElementById("signupButton")
        .addEventListener("click", function() => {...})

Upvotes: 1

Related Questions