I try to setup authentification for an Angular app using authorization code and Azure AD B2C (oidc-client on client side), but I'm getting these errors from Angular:
After looking in B2C audit logs, I found this error message:
Clients must send a client_secret when redeeming a confidential grant.
Here's my client side configuration:
const settings = {
stsAuthority: 'https://supportodqqcdev.b2clogin.com/supportodqqcDev.onmicrosoft.com/v2.0/.well-known/openid-configuration?p=B2C_1_SignUpSignInOdqPlatine',
clientId: '8447df5b-35a0-40a7-944f-5dcce87a2193',
clientRoot: 'https://localhost:4200',
scope: 'openid https://supportodqqcDev.onmicrosoft.com/platineclientdev/read',
};
this.userManager = new UserManager({
authority: settings.stsAuthority,
client_id: settings.clientId,
redirect_uri: `${settings.clientRoot}/signin-callback`,
scope: settings.scope,
response_type: 'code',
post_logout_redirect_uri: `${settings.clientRoot}/signout-callback`,
automaticSilentRenew: true,
silent_redirect_uri: `${settings.clientRoot}/assets/signin-silent-callback.html`,
});
If I switch the above configuration to use a local IdentityServer instance, everthings works has expected.
Is someone able to point me out where or how I should investigate this?
Confidential client applications are apps that run on servers (web apps, web API apps, or even service/daemon apps). They're considered difficult to access, and for that reason can keep an application secret.
The point of not using secrets with SPAs is that they end up in the browser, visible for everyone (including attackers) that load the SPA; that's independent of AJAX or how it is used.
In a text editor (such as Notepad), copy the name of the Application ID and label it as Client ID. Copy the authentication key string to the text editor, and label the string as Client Secret Key. For instructions, see Get application ID and authentication key in the Microsoft documentation.
In the Azure AD B2C App there is now a simpler option to do that. In the Authentication tab where the Web Redirect URIs are you will probably see a message This app has implicit grant settings enabled. If you are using any of these URIs in a SPA with MSAL.js 2.0, you should migrate URIs
. When you click that, a new window will let you choose which Redirect URI you want to move to the SPA Redirect URIs instead:
After that just click Configure
and it should work. The Redirect URI will now be located in the SPA section instead of the Web one.
I had the exact same issue as you and was just able to resolve it.
AD is requesting the client_secret from you, because it isn't configured for PKCE yet. To tell AD that you want to use PKCE for a specific redirect url you need to set its type from 'Web'
to 'Spa'
. This can be done in the manifest.
Search for the property replyUrlsWithType
in the Manifest and look for your .../signin-callback
url. Change its type to 'Spa'
and you should be good.
eg.:
"replyUrlsWithType": [
{
"url": "http://localhost:8080/signin-callback",
"type": "Spa"
},
]
The configured url will now disappear from your Authorization page but thats ok -> it's still present in the Manifest. The MS team is working on this new type.
Also make sure you marked your application as a public client.
For more information, see my answer here: Is Active Directory not supporting Authorization Code Flow with PKCE?
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With