NextJS on Auth0 fails with "Missing state cookie from login request"

I am new to Auth0 and am looking to add authentication to a NextJS application being hosted on AWS Amplify. I followed the guide here.

The issue

Everything works great locally. When running on Amplify, I get the following error:

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

If anyone has ideas on what I should do to debug this further, it would be greatly appreciated. I am currently out of ideas.

Context

This happens after I hit “log in,” sign in through the UI and get returned to my site.

In the logs from Amplify, before the error, I see the log, which appears to suggest the cookie is being set:

[x-amplify-log][INFO] app response status_code=302 Found headers=set-cookie: redacted (134), set-cookie: redacted (120), set-cookie: redacted (170), set-cookie: redacted (156), set-cookie: redacted (142), set-cookie: redacted (128), location: redacted (454), date: Sun, 19 Mar 2023 01:35:05 GMT, connection: keep-alive, keep-alive: redacted (9), transfer-encoding: chunked, x-amplify-internal-request-id: 48xxx

My amplify domain is “https://staging.xxx.amplifyapp.com/”, and I have a callback URL configured for “https://staging.xxx.amplifyapp.com/api/auth/callback”, so that should be correct. That is in the same format as my localhost callback, which works correctly.

Following other threads I found, I set “AUTH0_COOKIE_SAME_SITE” env var to “none” to no avail.

In Chrome dev tools, I can see that there are no cookies set when I am returned to my website.

1 Like