Two identical applications, one won't return id and access tokens.
Describe the bug I have two Angular 11 applications set up with near-identical config calling the same API that uses IdentityServer4. The client config on the Auth API is the same in both cases (except the client names). Both angular apps use authorizeWithPopUp(). On appA, everything works as expected; submitting on the login popup will close the login popup and reload the app in the parent window with the user authenticated. On appB, I'm able to enter my login credentials but upon submit the app reloads in both the parent as well as within the popup, both instances showing the login link indicating the user was not logged in.
To Reproduce Steps to reproduce the behavior:
- Click login link on AppB
- Enter user credentials on login popup, submit
- Page reloads on parent as well as within login window, indicates user not logged in.
Expected behavior 3. AppB should reload in the parent, login popup should close, user should appear as logged in.
Screenshots If applicable, add screenshots to help explain your problem.
Desktop (please complete the following information):
- OS: Windows 10 , Visual Studio 2019
- Browser Chrome, Edge
Additional context Here are some code snippets to show config and how the Auth API is called: config:
export function configureAuth(oidcConfigService: OidcConfigService) { return () => { oidcConfigService.withConfig({ stsServer: environment.authApiBaseUrl, redirectUrl: environment.uiUrl+ '/', postLogoutRedirectUri: environment.uiUrl+ '/', clientId: 'appB', scope: 'openid profile email appB.admin role', responseType: 'code', silentRenew: true, silentRenewUrl:
${environment.uiUrl}/silent-renew.html, logLevel: LogLevel.Debug }); } }
** On Auth API, both clients use "authorization_code" as the allowedGrantType
this.oidc.authorizeWithPopUp().subscribe(({ isAuthenticated, userData, accessToken, errorMessage }) => { console.log("login"); console.log(isAuthenticated); --> AppA: true console.log(userData); --> AppA: js object with user data console.log(accessToken); --> AppA: bearer token console.log(errorMessage); --> undefined });
** AppB never falls into the subscribe anonymous function **
Console messages during login: isAuthenticated: false angular-auth-oidc-client.js:227 STS server: https://localhost:9001 angular-auth-oidc-client.js:227 currentUrl to check auth with: http://localhost:4200/ angular-auth-oidc-client.js:230 Wanted to read 'appB_authzData' but nothing was found angular-auth-oidc-client.js:230 checkAuth completed fired events, auth: false angular-auth-oidc-client.js:230 Wanted to read 'appB_authzData' but nothing was found auth.service.ts:36 checkAuth: false
I read another issue that seemed similar (based on the "wanted to read ____ but nothing was found" message) and the explanation given was that there was an issue with the callback functionality, but I have the same callback component in both applications, and neither has any AuthGuard specified in the routing config.