Angular-oauth2-oidc: Error getting access-token when using code flow + pkce

[david-stranders]

Hello,

I'm trying to use the library with the code flow + pkce. I use Azure AD B2C as identity provider. For testing purposes, I have created a new test app (Angular 8), with the following code in the AppComponent:

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {

  constructor(readonly oauthService: OAuthService){
    this.oauthService.configure(authCodeFlowConfig);

    this.oauthService.tokenValidationHandler = new JwksValidationHandler();

    this.oauthService.loadDiscoveryDocument("https://<<app-name>>.b2clogin.com/<<tenantId>>/v2.0/.well-known/openid-configuration?p=B2C_1_LocalAccountSignIn").then( resp => {
      return this.oauthService.tryLoginCodeFlow();
    }).then(_ => {
      if (!this.oauthService.hasValidAccessToken()) {
        this.oauthService.initCodeFlow();
      }
    })
    .catch(err => {
      console.log('error: ', err)
    });
  }
}

When browsing to http://localhost:4200, it does redirect to the oauth server login page (login.microsoftonline.com/...) and after having logged in succesfully, it redirects back to localhost:4200, but Chrome console logs shows this error from angular-oauth2-oidc.js:

'Error getting token' with the message: 'Http failure response for https://<<app-name>>.b2clogin.com/<<tenantId>>/oauth2/v2.0/token?p=b2c_1_localaccountsignin: 0 Unknown Error'

The funny thing is that the identity provider does return a 200 OK response including the expected payload, but either Angular or the framework still interpret it as an Http Error Response.

When replaying the exact same POST using Postmen, it returns the expected 200 OK response including an access_token, refresh_token. etc) in the response body.

So it seems like the library isn't able to pick up the response...

[jeroenheijmans]

Thx for the extensive report, sorry to hear you're having trouble.

Nonetheless, a rather specific server setup seems needed to reproduce the issue (at least, I've never seen this case before with other IDS solutions) - so we might be relying on you or another community member with easy access to the same setup to debug this problem...

[daanstolp]

I am a colleague of the OP, working on the same project. We have put together a sample application to help debug this issue. The code can be found here: https://github.com/daanstolp/oidc-angular-azure-b2c. This application exhibits the exact problem as described in this issue.

This project is configured to authenticate using our Azure AD B2C identity provider. The issuer URL, client id/secret, etc. are all pre-configured and ready to go.

@jeroenheijmans we have created a test user account for you or any other community member that is willing to help us debug this issue. If anyone wants access, please let us know in a reply here where we can send the credentials.

[TbLtzk]

I'm trying the same. AccessCode + PKCE with AAD B2C.
I'm getting an access code. But when I want to get a token with this code I get the error

{"error":"invalid_client","error_description":"AADSTS7000218: The request body must contain the following parameter: 'client_assertion' or 'client_secret'.\r\nTrace ID: 1bd0543d-fc82-4412-8da4-e9fb578d0200\r\nCorrelation ID: 8441dd3b-13e3-456a-bb20-59f42a7aabac\r\nTimestamp: 2020-03-03 10:11:42Z","error_codes":[7000218],"timestamp":"2020-03-03 10:11:42Z","trace_id":"1bd0543d-fc82-4412-8da4-e9fb578d0200","correlation_id":"8441dd3b-13e3-456a-bb20-59f42a7aabac","error_uri":"https://login.microsoftonline.com/error?code=7000218"}

[sidyes]

I'm trying the same. AccessCode + PKCE with AAD B2C.
I'm getting an access code. But when I want to get a token with this code I get the error

{"error":"invalid_client","error_description":"AADSTS7000218: The request body must contain the following parameter: 'client_assertion' or 'client_secret'.\r\nTrace ID: 1bd0543d-fc82-4412-8da4-e9fb578d0200\r\nCorrelation ID: 8441dd3b-13e3-456a-bb20-59f42a7aabac\r\nTimestamp: 2020-03-03 10:11:42Z","error_codes":[7000218],"timestamp":"2020-03-03 10:11:42Z","trace_id":"1bd0543d-fc82-4412-8da4-e9fb578d0200","correlation_id":"8441dd3b-13e3-456a-bb20-59f42a7aabac","error_uri":"https://login.microsoftonline.com/error?code=7000218"}

Same for my application switching from implicit flow to code flow when authenticating with AAD (at least trying with Postman). Using the web application I get the same error as the creator of this thread together with a CORS error.

[npinciak]

I happened to stumble across this a few minutes after struggling the same issue as well.

However, after removing responseType: 'code', the errors seemed to disappear 🤔

_This isnt a solution this is just my 2 cents, still looking for a solution_ :)

[joscht]

Concerning the CORS error: Azure AD B2C does not currently support CORS on the token endpoints. Therefore it's not possible to use the code flow in a browser app and you'll need to use the implicit flow.
They seem to be working on it though: https://feedback.azure.com/forums/169401-azure-active-directory/suggestions/37689847-cors-for-token-endpoint

[manfredsteyer]

Yes, unfortunatelly. Honestly, I would change to code flow as it can be configured quite easily and as implicit flow will be deprecated by OAuth 2.1