CODEWITHSUNDEEP
javascripthtmlfirebasefirebase-realtime-database
Henry Zhu
Henry Zhu

Reputation: 2618

Uncaught Reference Error: Firebase is not defined

I have the following piece of code I'm trying to use to authenticate a newly registered user, although it fails to even initialize firebase, popping up this error:

Uncaught ReferenceError: firebase is not defined

Below is my code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
    <title>register</title>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.2/jquery.min.js"></script>
    <script src='https://cdn.firebase.com/js/client/2.4.2/firebase.js'></script>
</head>
<body>
    <script>
        var config = {
            databaseURL: 'https://apcs-4bfaa.firebaseio.com/'
        };
        firebase.initializeApp(config);

        var ref = new Firebase("https://apcs-4bfaa.firebaseio.com/");

        function registerUser() {
            var email = document.getElementById("email").value;
            var password = document.getElementById("password").value;
            ref.auth().createNewUserWithEmailAndPassword(email, password);
        }
    </script>

    <div class="form">
        <div id="error"></div>
        <form onsubmit="registerUser();">
            <label>Email:</label>
            <input type="text" name="email" id="email"><br>
            <label>Password:</label>
            <input type="password" name="pwd" id="password"><br>
            <input type="submit" value="Sign Up"><br>
        </form>
    </div>
</body>
</html>

Upvotes: 3

Views: 3472

Answers (1)

David East
David East

Reputation: 32604

Your code is mixed up between the older 2.4.2 API and the the 3.0 SDK.

There are no more new Firebase() calls. You need to use the new SDK, currently 3.0.3, and then configure your app.

<script src="https://www.gstatic.com/firebasejs/3.0.3/firebase.js"></script>
<script>
  // Initialize Firebase
  var config = {
    apiKey: '<your-api-key>',
    authDomain: '<your-auth-domain>',
    databaseURL: '<your-database-url>',
    storageBucket: '<your-storage-bucket>'
  };
  firebase.initializeApp(config);
</script>

After configuring you can then create references.

firebase.database().ref()

So in your case it would be:

<script>
    var config = {
        databaseURL: 'https://apcs-4bfaa.firebaseio.com/'
    };
    firebase.initializeApp(config);

    // new 3.0 SDK method!
    var ref = firebase.database().ref();

    function registerUser() {
        var email = document.getElementById("email").value;
        var password = document.getElementById("password").value;
        firebase.auth().createNewUserWithEmailAndPassword(email, password);
    }
</script>

Check out the docs for more info.

Upvotes: 9

Related Questions