Microsoft-authentication-library-for-js: Redirect user to a specific Uri instead of previous window location

[brianharwell]

When I redirect a user to the sign in page at Microsoft the user is redirected back to the page they were on when they were redirected and not the redirect uri that I specified.

[rohitnarula7176]

@brianharwell The redirectUri is just used to add to the authorization request. By design, Msal tries to take you back to the page where you started from when you clicked login to start the authentication process.

[brianharwell]

But why? The idea with redirect uri is to tell the browser where to go after the user authenticates with the identity provider, is it not? I have not tried cookie authentication but I remember this being the case in the demos I have watched. I have a use case for wanting the user redirected to a different page than their initial launch point and it seems odd that msal would completely ignore this.

[spottedmahn]

Yes, please allow us to control if we want this behaior

private handleAuthenticationResponse(hash: string): void {

        ...

    if (window.parent === window && !isPopup && [I_WANT_THIS_TO_HAPPEN]) {
        window.location.href = self._cacheStorage.getItem(Constants.loginRequest);
    }
}

[brianharwell]

I'll take a look this weekend and see if I can create a pull request

[spottedmahn]

Hi @brianharwell - I would wait for their response first. You might end up wasting your time 😞

[brianharwell]

The constructor for UserAgentApplication takes in an options object. There is a redirectUri property and a postLogoutRedirectUri property. If you do not set them the default is to use the current url. If you do set either of them then the user will be redirected to the specified url after the redirection from Microsoft.

[hakimio]

By design, Msal tries to take you back to the page where you started from when you clicked login to start the authentication process.

@rohitnarula7176 This undocumented behavior doesn't make any sense and is a bug.

[spottedmahn]

Hi @hakimio - for some people, it's probably a nice feature but for others, it is not. We, as the consumers of the library, should be able to choose IMHO.

It should definitely be documented though, as you stated.

[rohitnarula7176]

@spottedmahn @hakimio @brianharwell You can now pass navigateToLoginRequestUrl:false as follows:

        var userAgentApplication = new Msal.UserAgentApplication(applicationConfig.clientID, null, authCallback, { navigateToLoginRequestUrl:false });

In this case , Msal will set the hash to '' and call your callback where you can perform your custom navigation.

Along with this change, there is one more thing that will be part of our next release. We have made the constructor function synchronous.

So to access an instance of userAgentApplication in your callback , you will need to use "this" in the function scope as the control to the constructor is returned after calling your callback.

 var userAgentApplication = new Msal.UserAgentApplication(applicationConfig.clientID, null, authCallback);
        function authCallback(errorDesc, token, error, tokenType) {
                   console.log(userAgentApplication) //this will print undefined, use this instead
                    var self  = this// self is instance of userAgentApplication
           }

Can you please test the change using the dev branch and confirm if it works for you.

[SushanthYethonda]

Hi @rohitnarula7176 ,

https://github.com/AzureAD/microsoft-authentication-library-for-js/issues/238#issuecomment-365453972

i followed this and i have not given redirectUri property value

//Factory method

var storeLatestTokenInLocalStorage = function(){
var defered =  $q.defer();
userAgentApplication.acquireTokenSilent(['user.read files.read files.readwrite'], '', '', {navigateToLoginRequestUrl:false}).then(function (accessToken) {                    
        //AcquireTokenSilent Success
        window.localStorage.setItem("tokenBizAzureApp", accessToken); 
       defered.resolve(true);
},function(error){
      defered.reject(false);
});
};

//Controller method
$scope.ajaxcall.promise.then(function () {
            console.log('ggggg');
        });
//
$scope.CheckTokenExist = function(){
       factory.storeLatestTokenInLocalStorage().then(function(response){
            //Doing something after latest token appears in localstorage
           if(response){
              ........
           }
      });
};

acquireTokenSilent it is loading whole page silently instead where it is called like $scope.CheckTokenExist, is it possible to redirect previous function only where it is called.