Auth0 isAuthenticated() is always false

user_2417419 0
Viewed 294

I'm using Extjs and I used this tutorial on setting up the app and auth0. Here's the code for the login :

userLogin: function() {     
    //Create auth0 client
    createAuth0Client({
      domain: ".....auth0.com",
      client_id: ".....",
      useRefreshTokens: true
    }).then(function(auth0) {
        try {
            //Check if the user is authenticated, if not authenticate him, if yes insert his token in every ajax request
            auth0.isAuthenticated().then(function(authenticated) {
                if(!authenticated)
                {                      
                    auth0.loginWithRedirect({ redirect_uri: window.location.origin }).then();
                }
                else{
                    auth0.getTokenSilently().then(function(token) {
                        Ext.Ajax.setDefaultHeaders({ 'Authorization' : 'Bearer ' + token });
                    });
                }
            })
        } catch (err) {
            console.log("Log in failed", err);
        }
    });
}

On the first try, isAuthenticated is false (normal behaviour), so the user is redirected to auth0 login prompt, the user enters his credentials and is logged in, auth0 redirect to the app, now isAuthenticated is still false, the user is redirected to auth0 but no login prompt as he is already logged in, redirect back to the app and now an infinite loop start...

Application in auth0 is set to SPA (Single Page Application). Tried to change the cache location but didn't change anything.

Any ideas?

auth0 extjs authentication
1 Answers

I figured it out. You need to use the auth0.handleRedirectCallback() function:

try {
    auth0.isAuthenticated().then(async function (authenticated) {
        if (!authenticated) {
            const query = window.location.search;
            const shouldParseResult = query.includes("code=") && query.includes("state=");
            if (shouldParseResult) {
                console.log("> Parsing redirect");
                try {
                    const result = await auth0.handleRedirectCallback();
                    console.log("Logged in!");
                } catch (err) {
                    console.log("Error parsing redirect:", err);
                }
                window.history.replaceState({}, document.title, "/");
            } else {
                auth0.loginWithRedirect({ redirect_uri: window.location.origin });
            }
        } else {
            auth0.getTokenSilently().then(function (token) {
                Ext.Ajax.setDefaultHeaders({ 'Authorization': 'Bearer ' + token });
            });
        }
    })
} catch (err) {
    console.log("Log in failed", err);
}

Alternatively, you can useloginWithPopup():

if(!authenticated) {                      
    auth0.loginWithPopup().then(token => {
        auth0.getUser().then(user => {
            console.log(user);
        });
    })
 }
user_194510190
Related