Replies: 31 comments 22 replies
-
|
This is the same as https://next-auth-example.vercel.app just redeployed, right? I am not sure I understand this:
This is the intended behavior. 🤔 If you are not logged in and try accessing the |
Beta Was this translation helpful? Give feedback.
-
That happend AFTER you have logged in. He can access "ME" because the validation on the middleware only blocks the "ADMIN" page (always return true if its not the admin page being accessed). Hope that explanation has made the described error clearer! |
Beta Was this translation helpful? Give feedback.
-
|
The next-auth/apps/example-nextjs/middleware.ts Lines 6 to 13 in b7065a6 If your |
Beta Was this translation helpful? Give feedback.
-
|
Hey @balazsorban44 ! Thanks for the answer! I tought that the first suspect would be NEXTAUTH_SECRET be missing, that is why i even shared an screenshot showing that i did inform that env at the VERCEL env's dashboard! Also, like i explained, only thing not working is the middleware, the rest works (data from logged user is displayed, and if i tru to access user data at ServerSideProps it also works). And middleware works when i run locally (problem only happens when deployed to vercel). So i really dont think its the browser policy (even because your example works when i try it). I also tested on Safari on iPad other then Chrome on Windows, and in both the problem happens. Didnt u had to do any other type of configuration on your Vercel account for the middleware to work? |
Beta Was this translation helpful? Give feedback.
-
|
Well, i deployed the same test on my Personal Vercel account (Hobby account). Also, tried on my computer from work, and got the same error. I find it hard to believe that this same code deployed in another account works and the problem is happening only on my accounts! =S |
Beta Was this translation helpful? Give feedback.
-
|
Looks like this person is facing something similar to what i'm facing: import { NextResponse } from 'next/server'
import type { NextRequest } from 'next/server'
import { getToken } from 'next-auth/jwt'
export async function middleware(req: NextRequest) {
console.log('Testing!');
console.log('req!', req);
const secret = process.env.NEXTAUTH_SECRET
console.log('secret!', secret);
const token = await getToken({ req, secret });
console.log('token!', token);
// Else just pass through
return NextResponse.next();
}
export const config = { matcher: ['/dashboard/:path*'] }The output is: I guess that there is some problem with "req" and that is why NextAuth middleware isnt working? |
Beta Was this translation helpful? Give feedback.
-
|
Indeed, the log here is weird but likely unrelated (I forwarded this to our team to have a look.), as the cookie values are there, it's only the Everything should still work #4969 (comment) |
Beta Was this translation helpful? Give feedback.
-
|
Good morning! I'm still trying to figure out what the error is.... My latest code is available at https://github.com/raphaelpc/middleware-test @balazsorban44 to be 100% sure its not a cookie policy problem, i made this test: import { withAuth } from "next-auth/middleware"
// More on how NextAuth.js middleware works: https://next-auth.js.org/configuration/nextjs#middleware
export default withAuth({
callbacks: {
authorized: ({ req, token }) => {
console.log('token!', token);
console.log('token?.userRole!', token?.userRole);
const secret = process.env.NEXTAUTH_SECRET;
console.log('secret!', secret);
const { cookies } = req;
console.log('cookies!', cookies);
console.log('cookies instanceof Map!', cookies instanceof Map);
console.log('cookies.keys()!', cookies.keys());
const cookieSessionToken = cookies.get('__Secure-next-auth.session-token');
console.log('cookie "__Secure-next-auth.session-token"!', cookieSessionToken);
const cookieCallbackUrl = cookies.get('__Secure-next-auth.callback-url');
console.log('cookie "__Secure-next-auth.callback-url"!', cookieCallbackUrl);
const cookieCsrfToken = cookies.get('__Host-next-auth.csrf-token');
console.log('cookie "__Host-next-auth.csrf-token"!', cookieCsrfToken);
const allCookies = cookies.entries();
console.log('allCookies!', allCookies);
// /admin requires admin role, but /me only requires the user to be logged in.
return req.nextUrl.pathname !== "/admin" || token?.userRole === "admin";
},
},
})
export const config = { matcher: ["/admin", "/me"] }This is the log on the Vercel dashboard: As you can see, all NextAuth cookies are available at the middleware. Any suggestion of things i should try? Thanks in advance. |
Beta Was this translation helpful? Give feedback.
-
|
I redeployed our example repo here: https://balazsorban44-na-4969-balazsorban.vercel.app/ with no changes, again, it works as expected. 🤔 |
Beta Was this translation helpful? Give feedback.
-
|
That is so strange! I’m starting to think it’s something with my vercel accounts. Maybe my region? (I’m in Brazil). I will try to open a ticket with them. I will update here if I find anything else. |
Beta Was this translation helpful? Give feedback.
-
|
I'll let our team know as well. 👍 |
Beta Was this translation helpful? Give feedback.
-
|
@balazsorban44 same problem here! |
Beta Was this translation helpful? Give feedback.
-
|
@balazsorban44 I'm having the opposite issue here. Works on Vercel but not on my local machine. Exact same code, checked all the environment variables, token is always null in the middleware callback. After login I'm redirected back to the login page when trying to access any 'secure' routes. If I remove the middleware the pages work as expected after logging in. envinfo: |
Beta Was this translation helpful? Give feedback.
-
|
Same problem here. This is my middleware. |
Beta Was this translation helpful? Give feedback.
-
|
Not sure how I missed this issue in my research but the solution (for me) was: Downgrade Related issue: #5008 |
Beta Was this translation helpful? Give feedback.
-
|
I've been trying to find the solution, but I'm already running |
Beta Was this translation helpful? Give feedback.
-
|
Sorry, I didn't find anything else that might be causing this. I would wait for a fix from Vercel. If it helps; NodeJS 16.16.0, Yarn 3.2.2 |
Beta Was this translation helpful? Give feedback.
-
|
|
Beta Was this translation helpful? Give feedback.
-
|
Works locally but not on Vercel 😢 |
Beta Was this translation helpful? Give feedback.
-
|
Wait it works on netlify tho, I think it has something has to do with caching of the builds |
Beta Was this translation helpful? Give feedback.
-
|
Same, I don't get what the issue is. Works locally no problem. |
Beta Was this translation helpful? Give feedback.
-
|
I'm having the same issue. I thought moving from auth0 to next auth with next-middleware would work smoother and I am majorly regretting it. Everything works fine locally but the deployed version on vercel does unexpected things |
Beta Was this translation helpful? Give feedback.
-
|
Had the same issue here, the fix which worked for me was removing the |
Beta Was this translation helpful? Give feedback.
-
|
Had the same problem on |
Beta Was this translation helpful? Give feedback.
-
|
It worked thanks. |
Beta Was this translation helpful? Give feedback.
-
|
I love how they don't make this clear at all on the documentations 🤡 https://authjs.dev/getting-started/deployment#auth_trust_host |
Beta Was this translation helpful? Give feedback.
-
|
Any solutions? We've tried 12.2.2, 12.2.5, 12.2.6 - some deployments work, some doesn't, but everything works locally. |
Beta Was this translation helpful? Give feedback.
-
|
We migrated off next-auth now, never got this fixed for us sadly |
Beta Was this translation helpful? Give feedback.
-
|
Still having this issue locally with node v16.18.1 and next v13.2.4. I tried several versions but the token and session are always null in the middleware after authenticating. |
Beta Was this translation helpful? Give feedback.
-
|
After digging into this a bit more, in my case, it seems that the problem is that the JWT secret key is not there to get the token. I tried to pass the secret from the middleware without success However this worked for me I don't know if I'm forgetting to pass the secret key in some way or if it's a bug in the library. |
Beta Was this translation helpful? Give feedback.
-
|
Hey @rodrigo-arias I am having the same issue, but I don't get it this callback |
Beta Was this translation helpful? Give feedback.
-
|
@bymoe I'm wrapping the Next.js middleware, a more complete snippet below. |
Beta Was this translation helpful? Give feedback.
-
|
After testing and debugging for a day following the ideas from this thread, my working solution in my localhost is as follows. |
Beta Was this translation helpful? Give feedback.
-
|
Hello, I solved the problem with these steps : 1- add this code like mine to your middleware file that code will fix the problem 2- you should add that code in your Callbacks in the [...nextauth] file that code will fix the problem : 3- Removing the |
Beta Was this translation helpful? Give feedback.
-
|
Thx man it's been bugging (bun intended) me for along time |
Beta Was this translation helpful? Give feedback.
-
|
I am encountering an issue with the "[...nextAuth].ts" file when I deploy my code on Vercel, but it works fine when I run it on my localhost. here is the code (I'm using nextAuth 3.0 here): import NextAuth, { NextAuthOptions } from "next-auth";
import Provider from "next-auth/providers";
export const authOptions: NextAuthOptions = {
providers: [
Provider.Credentials({
name: "Credentials",
credentials: {
username: { label: "Username", type: "text", placeholder: "jsmith" },
password: { label: "Password", type: "password" },
},
async authorize(credentials) {
//^ destructuring the credentials
const { username, password } = credentials as any;
const response = await fetch("http://localhost:3000/api/auth/login", {
method: "POST",
headers: {
"Content-Type": "application/json",
},
body: JSON.stringify({ username, password }),
});
if (response.status === 422) {
const resData = await response.json();
console.log(resData);
throw new Error(resData.message);
}
if (!response.ok) {
const resData = await response.json();
throw new Error(resData.message || "Something went wrong");
}
const user = await response.json();
return { name: user.name, id: user.id, email: user.accessToken };
},
}),
],
session: {
jwt: true,
},
pages: {
signIn: "/",
signOut: "/gallery",
},
};
export default NextAuth(authOptions); |
Beta Was this translation helpful? Give feedback.
-
|
Hi! export default async function middleware(req) {
// Setting the Secure cookie
if (
!req.cookies.has('next-auth.session-token')
&& req.cookies.has('__Secure-next-auth.session-token') ) {
console.log('Relaying auth cookie...');
req.cookies.set({
...req.cookies.get('__Secure-next-auth.session-token'),
name: 'next-auth.session-token'
})
}
// Getting the token
const token = await getToken({ req: req, secret: authOptions.secret });
// ...Obs: I'm using the NEXTAUTH_URL environment variable. |
Beta Was this translation helpful? Give feedback.
-
|
I had this problem recently. I solved it with the following steps:
I'm using middleware and the code is: My api/auth/[...nextauth]/route.tsx is: It works for me |
Beta Was this translation helpful? Give feedback.
-
|
Thanks I worked for this code!!! |
Beta Was this translation helpful? Give feedback.
-
|
Great this is indeed the fix for my problem as well. |
Beta Was this translation helpful? Give feedback.
-
|
I added the |
Beta Was this translation helpful? Give feedback.
-
|
removing the nextauthurl environment variable from vercel worked for me |
Beta Was this translation helpful? Give feedback.
-
|
I had the same problem. But my solution was to add NEXTAUTH_URL instead of remove it. |
Beta Was this translation helpful? Give feedback.
-
|
me too |
Beta Was this translation helpful? Give feedback.
-
|
somehow this works for me. I just removed NEXTAUTH_URL from the env in vercel, and also replaced NEXTAUTH_SECRET by generating it at https://generate-secret.vercel.app/32 . after all that, I redeployed my application, and somehow it managed to make the middleware work as expected |
Beta Was this translation helpful? Give feedback.
-
|
I identified a potential solution I wanted to share in case it helps others. I noticed my |
Beta Was this translation helpful? Give feedback.
-
|
Hey, you also saved me. This also work for me. |
Beta Was this translation helpful? Give feedback.
-
|
Hey, guys. I was facing the same issue, my application was working perfectly locally, however when I deployed occured some errors. First, I realized that the cookie token name is different in production, so I had to do this, in my middleware: And I provided a variable called "NODE_ENV" with the value "production" on vercel enviroments variables:
But, even if doing this my application wasn't working in production. Checking the runtime logs I saw this error: [next-auth][error][NO_SECRET] Then, I realized that I had set this property on my authOptions, but I hadn't defined this variable on Vercel enviroment variables. It was like that:
So, I just defined this variable (NEXTAUTH_URL) with the value of my deploy (https://task-manager-maik.vercel.app/) on Vercel and the error was gone. Now it's working normally. I hope this helps. 😉 |
Beta Was this translation helpful? Give feedback.
-
|
The solution for me was very easy, the documentation for NextAuth says that in a Vercel deployment is not necesary to add NEXTAUTH_URL, that's how I fixed my problem. I hope this helps you guys c: |
Beta Was this translation helpful? Give feedback.
-
|
This worked for me. |
Beta Was this translation helpful? Give feedback.
-
|
@raphaelpc "next-auth": "^5.0.0-beta.21", This is my middleware. export default auth(async (req) => { export const config = { Here is the vercel env variables
Here is the vercel logs
|
Beta Was this translation helpful? Give feedback.
and others
-
Environment
Vercel
Reproduction URL
https://github.com/raphaelpc/middleware-test
Describe the issue
Hello everyone!
I'm trying to use the updated middleware as described here.
The problem is that the solution works great when i run it locally, but it don't work at all when i deploy it on Vercel.
Any idea of what could be the reason?
I even created a new project from the example @balazsorban44 shared, and even it doesnt work:
https://github.com/raphaelpc/middleware-test
I deployed it on: https://bolt-middleware-test.vercel.app/
As you can check, the Sign in process works: when you go to "ME", you see the info about the logged in user.
The problem is that when you try to access the "ADMIN" page, you are redirected to the login page.
I did some little changes to the middleware function to try to debug what was happening:
This is what is logged at the Functions Vercel Dashboard when i try to access the "admin" page:
Again: when i work everything locally it works great, problem happens when i try to deploy it on vercel =/
I've set all the env variables specified at the .env.examples:
I've also tried with next-auth versions 4.9.0 and 4.10.0.
Thanks in advance!
How to reproduce
Login in the system and try to access the ADMIN page.
You will be redirected to the login page.
You should be able to access the ADMIN page after logging in.
Expected behavior
The middleware protection should work when deployed on Vercel.
Currently, the token returned has "null" value.
Beta Was this translation helpful? Give feedback.
All reactions