question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Implicit Flow in Angular 5 Application: Successfully Authenticating but getIdentityClaims() returning NULL Values

See original GitHub issue

Describe the bug There are at least two (2) other issues on GitHub that are similar to this one, but neither of them provide a clear solution to the problem. In my Angular 5 application, I am using a public API for authentication. I do not have “system administrator” access to the authentication/resource server, so I am unable to make any changes in this regard. I do know that its a Microsoft machine and does not have a discovery document (hence, I am using the tryLogin() method).

On the client side, I am able to initialize the Implicit Flow and make the call from within my Angular 5 code. There is no login button for the user to click: If the app does not detect an access_token, it automatically redirects the user to the login form, prompts them to authenticate using a Smart Card, and if successful, redirects them back to the app with the access_token and id_token in the URL query string.

At this point, everything works as expected. But when I attempt to run getIdentityClaims(), it returns null. In other issues I’ve read, some have asked are there console errors at this point. In my application IS a console error (in an earlier post I wrote that there wasn’t a console error): Error validating tokens. Wrong Issuer. This is odd because a token is returned in the URL.

The following are code snippets from my application. I’ve trimmed it down a lot for simplicity purposes, but will provide more detail if requested.

app.module.ts

imports: [
 OAuthModule.forRoot({
      resourceServer: {
          allowedUrls: ['https://apigw-stg.cdc.gov:8443/openid/connect/v1/userinfo'],
          sendAccessToken: true
      }
  })
]

authConfig.ts

export const authConfig: AuthConfig = {
  oidc: true, 
  issuer: 'https://apigw-stg.cdc.gov:8443/auth/oauth/v2',   
  loginUrl: "https://apigw-stg.cdc.gov:8443/auth/oauth/v2/authorize",
  redirectUri:  window.location.href,
  clientId: xxx,
  responseType: 'id_token token',
  scope: "openid profile email",
  tokenEndpoint:  'https://apigw.cdc.gov:8443/auth/oauth/v2/token',
  userinfoEndpoint: "https://apigw-stg.cdc.gov:8443/openid/connect/v1/userinfo",
  showDebugInformation: true,
  strictDiscoveryDocumentValidation: false, 
}

app.component.ts

constructor(private route: ActivatedRoute, private router: Router, private injector: Injector, private http: HttpClient, private oAuthService: OAuthService) {
     this.oAuthCall();
}

oAuthCall() {
     this.oAuthService.configure(authConfig); 
     this.oAuthService.setStorage(sessionStorage);
     this.oAuthService.tokenValidationHandler = new JwksValidationHandler();
     this.oAuthService.tryLogin();
}

runOnAppLoad() {
     let accessToken = SharedUtilities.getURLHashValue('access_token');  // Get token from URL
     if (accessToken) {                  
        const claims = this.oAuthService.getIdentityClaims();
        console.log(claims);  // VALUE IS NULL!
     else {
        this.oAuthService.initImplicitFlow();
     } 
}

Expected behavior Once authentication is successful and the user is redirected back to the application, calling getIdentityClaims() should return object or value other than null.

Desktop (please complete the following information):

  • OS: Windows 10
  • Browser: Chrome (Version 76.0.3809.100)

Issue Analytics

  • State:closed
  • Created 4 years ago
  • Comments:8

github_iconTop GitHub Comments

1reaction
TommyHubbardcommented, Aug 26, 2019

Fair enough. Thanks for your help.

1reaction
jeroenheijmanscommented, Aug 26, 2019

Hmm, okay that’s good. Let’s see:

So I think it’ll be something specific to your situation, or something I overlooked glancing at your code. Here’s some suggested ways to debug this:

  • Set a breakpoint in loadUserProfile() and inside its lambda functions. This should be your best bet in learning what exactly is going on.
  • Check the network tab of the dev tools to see what happens with the call to userinfoEndPoint: what does it return?
  • Add some additional logging to see what’s going on.
  • Check the relevant tab of your dev tools to see what items are set in sessionStorage

Good luck!

Read more comments on GitHub >

github_iconTop Results From Across the Web

Implicit flow authentication using angular-oauth2 ... - LinkedIn
These flows dictate how authentication is handled by the OpenID Connect Provider, including what can be sent to client application and how.
Read more >
oauthService.getIdentityClaims() returns null when using ...
I can login (redirecting to keycloak login page), and session has created inside keycloak for loggedin user. However, oauthService.
Read more >
Implicit flow authentication using angular-oauth2-oidc (Angular)
This is the OAuth2/OIDC flow best suitable for SPA. It sends the user to the IdentityProvider's login page (Identity Server). After logging in, ......
Read more >
Angular Authentication with OpenID Connect and Okta in 20 ...
In this article, you'll see how build a simple web application with Angular CLI, a tool for Angular development. You'll also create an ......
Read more >
The Complete Guide to Angular User Authentication with Auth0
Once your users log in successfully, Auth0 redirects them back to your Angular application, returning tokens with their authentication and ...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found