Application Refresh Issue

[aditya-padhi-kbl]

Hi Team, This is nice wrapper & we are using this in our application. However, on successful authentication it is causing the application to refresh a number of times.

If there are any api calls associated then it gets called multiple times as well. Same behavior is seen in IE as well. Can you please let me know what could be the issue?

[cannehag]

I solved this by looking if the window.location.href contains #id_token or #access_token, then I don't perform the other api calls.

Pseudo code ahead: if(service.isAuthenticated && window.location.href not contains #id_token or #access_token) { //do api calls }

[aditya-padhi-kbl]

Thank-you @cannehag. I will try this & share my findings

[aditya-padhi-kbl]

Hi @cannehag , I have injected Adal4Service in my constructor as :- constructor(private service: Adal4Service) My source code:- this.service.handleWindowCallback(); if (!this.service.userInfo.authenticated) { this.service.login(); } if (this.service.userInfo.authenticated && window.location.hash.indexOf('#') === -1) { this.loaderMessage.showLoader = true; this.messageService.LoaderMessage = this.loaderMessage; this.getUser(); } inside handleWindowCallback() method it is written if (window.location.hash) { window.location.href = window.location.href.replace(window.location.hash, ''); }

the Adal4Service is already removing the hashes. (So do I need to check for #id_token & #acquire_token) Still the application is refreshed when I call acquireToken method.

[cannehag]

As you say, adal4service is removing the hash but that means that it will also do a redirect. I have solved it like this in the app.component constructor:

this.authService.init();
this.authService.handleCallback();
if (this.authService.isAuthenticated && !this.authService.isInCallbackRedirectMode) {
   this.initUserSubscription = this.usersService.initialize().subscribe(); //this is an another api call
   this.authService.initGraphAccess(); // this is an aquireToken call
}

The isInCallbackRedirectMode method is as simple as this:

public get isInCallbackRedirectMode(): boolean {
    return window.location.href.indexOf('#access_token') === -1 && window.location.href.indexOf('#id_token') === -1;
}

[aditya-padhi-kbl]

@cannehag Just a short query. Are you using HashLocationStrategy in application. Because the isInCallbackRedirectMode() will surely work, however I cannot stop page to refresh during this.service.handleCallback()'s implementation to clean up the url.

[cannehag]

No, not using that. The handleCallback() SHOULD refresh the page, once. Are you saying it shouldn't or that it gets stuck in a loop ?

[aditya-padhi-kbl]

handleCallback() removes the api_token & access_token. But yes it reloads the application a number of times. (as I cam see main.bundle.js etc. in the console a number of times). After refresh the application is working properly. But when I add a breakpoint and call after sometime say 5 minutes then it refreshes the application again. (I am using angular-cli for my web application)

[cannehag]

Ok, it seems that you are aquiring tokens from time to time and that will cause a redirect. I'm getting my tokens initially, and then store them, thus not aquiring tokens on click events and such.

[aditya-padhi-kbl]

@cannehag Yes, in our application we do the authentication using ADFS. Then for every rest call (api call) we are using acquireToken() method exposed by Angular4. And that causes the application to refresh. On further investigation the api calls are getting cancelled hence it refreshes the application. The approach you suggested may work, however we may still need to use acquireToken() method as it handles other params like token expiry etc.

[geerzo]

Is this still an issue? Or can we close the issue?

[podliponochka]

Hi team, I have the same issue as @aditya-padhi-kbl. for every rest call (api call) I'm using acquireToken() method. Please, tell me how do i solve the issue related to reloading the app? Thank you

[geerzo]

@podliponochka can you post any sample code that demonstrates the problem?

[SampatPenugonda]

I have faced with the same problem, for every few seconds, applications keep on refreshing. I have followed below steps

1. I have removed below line from the constructor , instead, I have written in ngOnInit() of app.components.ts. this.adalService.init(environment.adalConfig);

2. Added window.location.hash.indexOf('#') === -1 in ngOnit()

This solved my issue of app refreshing.

Angular6, #adal-4

[ktanpure]

Hi All, I am using adal-angular4 version - 4.0.12 library in my Angular 7 application for Azure AD Authentication. I have also implemented this.adalService.acquireToken() method to Refresh Token silently 10 minutes before it expires. However, when the token refreshes it also reloads my entire application and redirects User to redirectUri. Also, this happens while User is working on some page. Is there a way that my Token gets refresh and also my application is not reload. @SampatPenugonda can you give more details on the point 2. as to where I should add the condition window.location.hash.indexOf('#') === -1 ? Also, @benbaran and others any help will be appreciated.