Login callback error: State cookie was missing. #922
Description
Environment
- Operating System:
Darwin - Node Version:
v20.17.0 - Nuxt Version:
3.13.2 - CLI Version:
3.14.0 - Nitro Version:
2.9.7 - Package Manager:
yarn@1.22.22 - Builder:
- - User Config:
- - Runtime Modules:
- - Build Modules:
-
Reproduction
auth: { originEnvKey: "NUXT_AUTH_ORIGIN", globalAppMiddleware: true, provider: { type: "authjs", trustHost: false, defaultProvider: "keycloak", }, }, server/api/auth/[...].ts
providers: [ // @ts-expect-error Use .default here for it to work during SSR. KeycloakProvider.default({ clientId: process.env.NUXT_OAUTH_CLIENT_ID, clientSecret: process.env.NUXT_OAUTH_CLIENT_SECRET, issuer: process.env.NUXT_OAUTH_ISSUER_BASE_URL, }), ], .env
NUXT_SESSION_PASSWORD=<session_password> NUXT_OAUTH_CLIENT_ID=my-app NUXT_OAUTH_CLIENT_SECRET=<secret> NUXT_OAUTH_ISSUER_BASE_URL=http://localhost:8180/realms/my-app NUXT_OAUTH_ADMIN_ENDPOINT_BASE_URL=http://localhost:8180/admin/realms/my-app NUXT_AUTH_ORIGIN=http://localhost:3000 All my pages are protected with global middleware because this is a management app.
So basically if you are not logged in, you are redirected to the Keycloak login page.
http://localhost:8180/realms/my-app/protocol/openid-connect/auth?client_id=management&scope=openid%20email%20profile&response_type=code&redirect_uri=http%3A%2F%2Flocalhost%3A3000%2Fapi%2Fauth%2Fcallback%2Fkeycloak&state=ETqYs5Y5hdmv4VuB4HDiS_YFQTtev8ceXNx58R-4okA&code_challenge=O-wdF_AS8EMq-zupG4A9eTDy0raLnRUxZBAHwrqA5UA&code_challenge_method=S256 Describe the bug
You input username and password and should be redirected to the index page of my app.
But it's not the case. I'm redirected to the default login page that next-auth provides.
[next-auth][error][OAUTH_CALLBACK_ERROR] https://next-auth.js.org/errors#oauth_callback_error State cookie was missing. { error: { TypeError: State cookie was missing. at Object.use (/Users/me/Documents/Projects/my-app/management/node_modules/next-auth/core/lib/oauth/checks.js:103:23) at oAuthCallback (/Users/me/Documents/Projects/my-app/management/node_modules/next-auth/core/lib/oauth/callback.js:89:25) at process.processTicksAndRejections (node:internal/process/task_queues:95:5) at async Object.callback (/Users/me/Documents/Projects/my-app/management/node_modules/next-auth/core/routes/callback.js:52:11) at async AuthHandler (/Users/me/Documents/Projects/my-app/management/node_modules/next-auth/core/index.js:208:28) at async Object.handler (/Users/me/Documents/Projects/my-app/management/node_modules/@sidebase/nuxt-auth/dist/runtime/server/services/authjs/nuxtAuthHandler.js:43:24) at async file:///Users/julien/Documents/Projects/my-app/management/node_modules/h3/dist/index.mjs:1978:19 at async Object.callAsync (file:///Users/me/Documents/Projects/my-app/management/node_modules/unctx/dist/index.mjs:72:16) at async Server.toNodeHandle (file:///Users/me/Documents/Projects/my-app/management/node_modules/h3/dist/index.mjs:2270:7) name: 'OAuthCallbackError', code: undefined }, providerId: 'keycloak', message: 'State cookie was missing.' } For history purposes, at the beginning of the project, I faced a different error when global auth middleware redirects to the index page of my app (that is secured too and occurs to redirect to Keycloak login page then). After have done some investigations, it was an h3 side issue and a PR has been made and merged.
The PR was merged after I started the project. So the version of h3 that Nuxt depends on is older than the PR change.
I wanted to upgrade Nuxt from 3.10 to 3.12 this morning and the problem appeared at that time.
I downgraded to 3.10 but the problem is still there.
I think Nuxt depends on the main branch of h3 and not on a particular version.
So even if the h3 issue is solved, that have produced a new one.
I think the login callback url does not reads the state cookie correctly but I'm not sure.
Someone has an idea ?
Additional context
The signIn callback URL is :
http://localhost:3000/api/auth/callback/keycloak?state=n0XRuLCKwChA4S4TrObsmmxl3nwxfX2m_1TfNfcFYzs&session_state=d1e70b5e-988c-454a-96ab-084ee294745d&iss=http%3A%2F%2Flocalhost%3A8180%2Frealms%2Fmy-app&code=01021367-44db-4389-8e08-9fdd44f457c0.d1e70b5e-988c-454a-96ab-084ee294745d.01e70eef-93ea-4278-95bd-4e732fde9a48
So the state id is passed through query params but not cookie...
Logs
No response