Auth0 Home Blog Docs

Auth0 10 Lock Not Hiding

auth0-lock

#1

My problems started since Passworless Legacy Auth was taken off from Auth0.

Now We are Integrating, Auth0 Lock10 with AngularJS1.x,
Have followed all the steps, Issue I am having is
**Auth0Lock is Not Hiding after Login, i have the option autoclose: true,
**

Auth0-Angular Also has a issues
lock.interceptHash = function() { … }
has var hash = $location.hash();, but this has value is always an empty string,
hence I had to have my own implemention.


#2

Can you please provide the specific versions of Lock and angular-lock you are using. Can you please also update your question with a code sample for your Lock initialisation.


#3

Hi,
Below are the details of the implmentation
angular-lock - V2.0.2
"auth0-js": "^8.4.0"
“auth0-lock” : “version”: “10.18.0”,

//Step1.Initialization Code
app.config(function (lockProvider) {
  // Initialization for the angular-auth0 library
    lockProvider.init({
        clientID: AUTH0_CLIENT_ID,
        domain: AUTH0_DOMAIN,
        options: {
          _idTokenVerification: false,
            autoclose: true,
              allowedConnections: 'facebook', 'linkedin']
        },
        loginState:'loginlock',
        auth: {
          responseType: 'token',
          redirect: false,
        }
    });
//Step2
app.run(function(lock,authService) {  
  // For use with UI Router
  console.log("intervice and onAutheticated called")
 //lock.interceptedHash()
  authService.interceptHash();  
})
//Step3 - Auth Service
//incertpedHash function is derived from Angular-Lock.js as , .hash() function 
//was not working there., we derive the params
interceptHash: function() {
            if (typeof auth0.WebAuth !== 'function') {
                throw new Error('Auth0.js version 8 or higher must be loaded');
            }
            $rootScope.$on('$locationChangeStart', function(event, location) {
                if (/id_token=/.test(location) || /error=/.test(location)) {
                    //this is a klugde to get the id_token out of the location
                    var p1 = $location.path().substring(1)
                    var url_string="http://www.example.com/t.html?"+p1
                    var url = new URL(url_string);
                    var idToken = url.searchParams.get("id_token");  
                    var auth0AccessToken = url.searchParams.get("access_token");  
                    event.preventDefault()                    
                    var authResult = {
                        id_token: idToken,
                        access_token : auth0AccessToken
                    }
                    lock.emit('authenticated', authResult);
                    invokePostLockTokenLogin(idToken,auth0AccessToken)                                  
                }
            });
        }
//step4 - invokePostLockToken
function invokePostLockTokenLogin(idToken,auth0AccessToken){
        localStorage.setItem(byConstants.ID_TOKEN, idToken);
        lock.getUserInfo(auth0AccessToken, function(error, profile) {
            if (!error) {
                var authData = {
                    token : idToken,
                    profileData : profile
               }
                $rootScope.$broadcast('event:auth0ProfileSet', authData);
            }else{
                $state.go('loginlock')
            }
        });
    }

//so even after successful login , Login Lock stays ethere

#4

Hi

Was able to figure out the issues, after redirect, it again calls the login, where I was doing lock.show, added a check to see if the access_token is recieved, in that case do not call the lock.show again


#5