CODEWITHSUNDEEP
javascriptfirebasefirebase-authentication
Luke Strong
Luke Strong

Reputation: 19

Access Firebase User From Multiple Pages

I am trying to access a firebase authentication user from multiple pages. I tried this on 1.html, 2.html, and code.js. 1.HTML

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title></title>
        <script src="https://www.gstatic.com/firebasejs/4.10.0/firebase.js"></script>
    </head>
    <body>
        <input type="email" id="email">
        <input type="password" id="password">
        <button onclick="sign()">Yo</button>
    </body>
    <script src="code.js"></script>
</html>

2.HTML

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title></title>
        <script src="https://www.gstatic.com/firebasejs/4.10.0/firebase.js"></script>
    </head>
    <body>
        <p id="p" onload="runIt()">TEST</p>
    </body>
    <script src="code.js"></script>
</html>

CODE.JS

var config = {
    apiKey: "xxxxxxxxxxxxxxxxxxxxxxxxxxxxx",
    authDomain: "xxxxxxxxxxxxxxxxxxxxxxxxx.com",
    databaseURL: "https://xxxxxxxxxxxxxxxxxxxxxx.com",
    projectId: "xxxxxxxxxxxxxxxxxxxx",
    storageBucket: "xxxxxxxxxxxxxxxx.appspot.com",
    messagingSenderId: "xxxxxxxxxxx"
};
firebase.initializeApp(config);
function sign() {
    var email = document.getElementById('email').value;
    var password = document.getElementById('password').value;
    firebase.auth().signInWithEmailAndPassword(email, password).then(function() {
        window.location = "2.html";
    });
}
function runIt() {
   console.log(firebase.auth().currentUser.uid);
}

How would I be able to log, in the console, the user's uid from the second page? Thanks!

Upvotes: 0

Views: 1639

Answers (3)

Ronnie Smith
Ronnie Smith

Reputation: 18555

You are loading the shared Firebase JavaScript SDK and firebase config file on both pages being served from the same domain/ipaddr. An authorization token is granted and persists as configured. Every new page load results in a state change, .firebase.auth().onAuthStateChanged

Authentication State Persistence

You can specify how the Authentication state persists when using the Firebase JS SDK. This includes the ability to specify whether a signed in user should be indefinitely persisted until explicit sign out, cleared when the window is closed or cleared on page reload.

Expected behavior across browser tabs

The following expected behavior will apply when different persistence types are used in different tabs. The requirement is that at any point, there should never be multiple types of saved states at the same time (eg. auth state saved in session and local types of storage):

  • Users can sign in using session or none persistence with different users on multiple tabs. Each tab cannot see the state of the other tab.
  • Any attempt to sign in using local persistence will be detected and synchronized on all tabs. If the user was previously signed in on a specific tab using session or none persistence, that state will be cleared.
  • If the user was previously signed in using local persistence with multiple tabs opened and then switches to none or session persistence in one tab, the state of that tab will be modified with the user persisted in session or none and on all other tabs, the user will be signed out.

Upvotes: 2

Luke Strong
Luke Strong

Reputation: 19

What happened is it called the function before it signed in the user. You have to give it a second. You can write:

function initApp() {
    firebase.auth().onAuthStateChanged(function(user) {
        if (user) {
            // User is signed in.
            console.log(firebase.auth().currentUser.uid);
        }
    });
}

Then, it will log the uid after there is a change in the auth state, or when the user signs in.

Upvotes: 0

Diego Ven&#226;ncio
Diego Ven&#226;ncio

Reputation: 6007

Do you try:

var user = firebase.auth().currentUser;

if (user != null) {
  uid = user.uid; 
}

Upvotes: 0

Related Questions