Azure AD B2C: Clients must send a client_secret when redeeming a confidential grant
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?
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.
Your image shows a CORS error.
I'm not sure if oidc-client works OOTB with B2C. It's more for identityserver.
Have a look at the msal.js sample.