Callback handler failed. CAUSE: Missing state cookie from login request (check login URL, callback URL and cookie config)

moisestech · March 21, 2024, 12:46pm

Hello, I’m having trouble getting our staging site to log us in successfully online on Vercel. Locally it is working but not in the deployed URL https://www.staging.loremachine.world

We are using the Multi-Tenant recommendation from the Auth0 Blog

as well as the Subdomain URL Placeholders

Here is a screen-shot of the screen that displays when trying that login URL.

Allowed Callback URLs

http://localhost:3000/api/page-router-auth/callback, 
http://localhost:3000/page-router, 
https://*.loremachine.world,
https://www.staging.loremachine.world/page-router, http://localhost:3000/api/auth/callback, https://www.staging.loremachine.world/api/auth/callback

App Login URI

Allowed Web Origins
http://localhost:3000, https://www.staging.loremachine.world

In our NextJS app the Auth0 SDK lives under pages/api/auth/[...auth0].ts
Here is a gist of that file fore reference.

gist.github.com

https://gist.github.com/moisestech/00a30cd1f70870016da77f363bff4a27

[...auth0].ts

import type { NextApiRequest, NextApiResponse } from 'next';

// third party
import { handleAuth, handleCallback, Session } from '@auth0/nextjs-auth0';
import { AfterCallback as Auth0AfterCallback } from '@auth0/nextjs-auth0/dist/handlers/callback';
import jwt from 'jsonwebtoken';

// utils
import { devLog } from '../../../utils/devLog';

This file has been truncated. show original

On Vercel we have the environment variables provided to us in the Staging Tenant linking to our staging.loremachine.world only not to the production URL.

# AUTH0 STAGING
AUTH0_TRANSACTION_COOKIE_SAME_SITE=none
AUTH0_SECRET= #encrypt the session cookie
AUTH0_CLIENT_ID=
AUTH0_ISSUER_BASE_URL=https://staging-loremachine.us.auth0.com
AUTH0_CLIENT_SECRET=

What is it that we need to change to get this resolved?

Kindly,

Moises