SvelteKitAuth giving “response” is not a conform Authorization Server Metadata response on Sign in

[nmowatt]

Provider type

Azure Active Directory B2C

Environment

  System:
    OS: macOS 12.6
    CPU: (10) arm64 Apple M1 Max
    Memory: 995.92 MB / 64.00 GB
    Shell: 5.8.1 - /bin/zsh
  Binaries:
    Node: 18.16.0 - ~/.nvm/versions/node/v18.16.0/bin/node
    Yarn: 1.22.19 - /opt/homebrew/bin/yarn
    npm: 9.5.1 - ~/.nvm/versions/node/v18.16.0/bin/npm
  Browsers:
    Chrome: 114.0.5735.133
    Safari: 15.6.1

Reproduction URL

Client project. Using svelte.

Describe the issue

I'm using SvelteKitAuth with the AzureADB2C provider, but it fails whenever I try to sign in.

[auth][error][SignInError]: Read more at https://errors.authjs.dev#signinerror
[auth][cause]: OperationProcessingError: “response” is not a conform Authorization Server Metadata response
    at Module.processDiscoveryResponse (file:///<LOCAL_PATH>/node_modules/oauth4webapi/build/index.js:215:15)
    at getAuthorizationUrl (file:///<LOCAL_PATH>/node_modules/@auth/sveltekit/node_modules/@auth/core/lib/oauth/authorization-url.js:19:28)
    at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
    at async Module.signin (file:///<LOCAL_PATH>/node_modules/@auth/sveltekit/node_modules/@auth/core/lib/routes/signin.js:14:20)
    at async AuthInternal (file:///<LOCAL_PATH>/node_modules/@auth/sveltekit/node_modules/@auth/core/lib/index.js:115:36)
    at async Proxy.Auth (file:///<LOCAL_PATH>/node_modules/@auth/sveltekit/node_modules/@auth/core/index.js:100:30)
    at async Module.respond (/<LOCAL_PATH>/node_modules/@sveltejs/kit/src/runtime/server/respond.js:274:20)
    at async file:///<LOCAL_PATH>/node_modules/@sveltejs/kit/src/exports/vite/dev/index.js:505:22
[auth][details]: {
  “provider”: “azure-ad-b2c”
}

Here's my code:

import { SvelteKitAuth } from "@auth/sveltekit"
import AzureADB2C from '@auth/core/providers/azure-ad-b2c'
import { B2C_TENANT, B2C_TENANT_ID, B2C_CLIENT_ID, B2C_CLIENT_SECRET, AUTH_SECRET} from '$env/static/private';

export const handle = SvelteKitAuth({
  providers: [
    AzureADB2C({ 
      clientId: B2C_CLIENT_ID, 
      clientSecret: B2C_CLIENT_SECRET, 
      issuer: `https://${B2C_TENANT}.b2clogin.com/${B2C_TENANT_ID}/v2.0/` }) as any
    ],
    secret: AUTH_SECRET
})

How to reproduce

1. Use signIn('azure-ad-b2c') or signIn() and click on the Azure B2C button which shows up
2. Shows generic error page on the client. Server prints the above error.

Expected behavior

Should be prompted with a sign in form

[KillianGDK-FDTI]

Here is my working configuration :

		AzureADB2C({
			issuer: `https://${B2C_TENANT}.b2clogin.com/${B2C_TENANT_ID}/v2.0/`,
			wellKnown: `https://${B2C_TENANT}.b2clogin.com/${B2C_TENANT}.onmicrosoft.com/${B2C_POLICY}/v2.0/.well-known/openid-configuration`,
			authorization: {
				url: `https://${B2C_TENANT}.b2clogin.com/${B2C_TENANT}.onmicrosoft.com/${B2C_POLICY}/oauth2/v2.0/authorize`,
				params: { scope: B2C_CLIENT_ID }
			},
			token: `https://${B2C_TENANT}.b2clogin.com/${B2C_TENANT}.onmicrosoft.com/${B2C_POLICY}/oauth2/v2.0/token`,
			clientId: B2C_CLIENT_ID,
			clientSecret: B2C_CLIENT_SECRET,
			allowDangerousEmailAccountLinking: true
		})

Hope it helps

[Assassyn]

HI @KillianGDK-FDTI

This was very helpful. But after applying your sugesstions I am getting a problem with the redirect uri. To be precise the error in the GET path is:

http://localhost:5173/?error=redirect_uri_mismatch

In the Azure b2c I have the SPA app with the URL pointing to a localhost domain.

[sneakyPad]

I encounter the same error, but with Auth0 as a provider. I created a discussion here https://github.com/orgs/vercel/discussions/4591, but it seems like this would be a better place.

[KillianGDK-FDTI]

Hello @Assassyn, I haven't work on this recently, so it will be difficult to find the working config I had.

Maybe try to add http://localhost:5173/auth/callback/azure-ad-b2c as a redirect URI in Azure B2C (SPA and / or web)

[Assassyn]

Hello @KillianGDK-FDTI , the url fix worked. I even managed to find the information about it on other providers.

However, now I have an issue with

http://localhost:5173/auth/error?error=CallbackRouteError

I hope that documentation is better for this case.

EDITED:
I will continue my issue here. I have managed to debug the code and the issue is with Client Secret. When it is left blank I am getting the error:

auth][cause]: TypeError: "client.client_secret" property must be a non-empty string
    at assertClientSecret (file:///C:/Users/szymo/source/repos/BeFunctional/test/sveltekit-auth-example/node_modules/oauth4webapi/build/index.js:380:15)
    at clientAuthentication (file:///C:/Users/szymo/source/repos/BeFunctional/test/sveltekit-auth-example/node_modules/oauth4webapi/build/index.js:402:78)
    at authenticatedRequest (file:///C:/Users/szymo/source/repos/BeFunctional/test/sveltekit-auth-example/node_modules/oauth4webapi/build/index.js:823:11)
    at tokenEndpointRequest (file:///C:/Users/szymo/source/repos/BeFunctional/test/sveltekit-auth-example/node_modules/oauth4webapi/build/index.js:844:12)
    at Module.authorizationCodeGrantRequest (file:///C:/Users/szymo/source/repos/BeFunctional/test/sveltekit-auth-example/node_modules/oauth4webapi/build/index.js:990:12)
    at handleOAuth (file:///C:/Users/szymo/source/repos/BeFunctional/test/sveltekit-auth-example/node_modules/@auth/core/lib/oauth/callback.js:58:37)
    at async Module.callback (file:///C:/Users/szymo/source/repos/BeFunctional/test/sveltekit-auth-example/node_modules/@auth/core/lib/routes/callback.js:20:41)
    at async AuthInternal (file:///C:/Users/szymo/source/repos/BeFunctional/test/sveltekit-auth-example/node_modules/@auth/core/lib/index.js:65:38)
    at async Proxy.Auth (file:///C:/Users/szymo/source/repos/BeFunctional/test/sveltekit-auth-example/node_modules/@auth/core/index.js:100:30)
    at async Module.respond (/node_modules/@sveltejs/kit/src/runtime/server/respond.js:282:20)

However, when it is specified, I am getting an error response from Azure AAD b2c:

{
  error: "invalid_request",
  error_description: "AADB2C90084: Public clients should not send a client_secret when redeeming a publicly acquired grant.\r\nCorrelation ID: 15e6b98f-6304-4928-bf63-94c72b7b3bad\r\nTimestamp: 2023-10-25 19:42:07Z\r\n",
}

So this is caused by misconfiguration on my side but I am not sure what I did wrong.

EDIT2:

Following the ticket on next-auth: #4706 I did manage to move little bit forward but now I am failing on missing the access_token in my response:

[auth][cause]: OperationProcessingError: "response" body "access_token" property must be a non-empty string
    at processGenericAccessTokenResponse (file:///C:/Users/szymo/source/repos/BeFunctional/test/sveltekit-auth-example/node_modules/oauth4webapi/build/index.js:892:15)
    at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
    at async Module.processAuthorizationCodeOpenIDResponse (file:///C:/Users/szymo/source/repos/BeFunctional/test/sveltekit-auth-example/node_modules/oauth4webapi/build/index.js:1010:20)
    at async handleOAuth (file:///C:/Users/szymo/source/repos/BeFunctional/test/sveltekit-auth-example/node_modules/@auth/core/lib/oauth/callback.js:75:24)
    at async Module.callback (file:///C:/Users/szymo/source/repos/BeFunctional/test/sveltekit-auth-example/node_modules/@auth/core/lib/routes/callback.js:20:41)
    at async AuthInternal (file:///C:/Users/szymo/source/repos/BeFunctional/test/sveltekit-auth-example/node_modules/@auth/core/lib/index.js:65:38)
    at async Proxy.Auth (file:///C:/Users/szymo/source/repos/BeFunctional/test/sveltekit-auth-example/node_modules/@auth/core/index.js:100:30)
    at async Module.respond (/node_modules/@sveltejs/kit/src/runtime/server/respond.js:282:20)
    at async file:///C:/Users/szymo/source/repos/BeFunctional/test/sveltekit-auth-example/node_modules/@sveltejs/kit/src/exports/vite/dev/index.js:510:22

[Assassyn]

A new comment to add the solution.
It seems that auth.js needs to receive an access_token with a request. To get it working you need to specify the Application (Client ID) as a scope. You can do it in the B2c Tennant configuration section:

Remember to grant the the admin consent for a new scope.

The second step is to request this permission as a scope in the configuration section :

const config = {
  issuer: `https://${B2C_TENANT}.b2clogin.com/${B2C_TENANT_ID}/v2.0/`,
  wellKnown: `https://${B2C_TENANT}.b2clogin.com/${B2C_TENANT}.onmicrosoft.com/${B2C_POLICY}/v2.0/.well-known/openid-configuration`,
  authorization: {
    url: `https://${B2C_TENANT}.b2clogin.com/${B2C_TENANT}.onmicrosoft.com/${B2C_POLICY}/oauth2/v2.0/authorize`,
    params: { scope: `${B2C_CLIENT_ID} <application (client) id>` }
  },
  token:`https://${AZURE_AD_B2C_TENANT_NAME2}.b2clogin.com/${AZURE_AD_B2C_TENANT_NAME2}.onmicrosoft.com/${B2C_POLICY}/oauth2/v2.0/token`,
  clientId: AZURE_AD_B2C_CLIENT_ID,
  allowDangerousEmailAccountLinking: true,
  client: {
    token_endpoint_auth_method: 'none'
  },
} satisfies OIDCUserConfig<AzureADB2CProfile>;

[Waba-tron]

same problem but I'm using nextjs