Discuss NextAuth.js v5 #8487
Replies: 101 comments 202 replies
-
|
@balazsorban44 I got the latest version and i want to provide multi-authentication in my app(manuel one and Google provider). In middleware i use |
Beta Was this translation helpful? Give feedback.
-
"overrides": {
"@auth/core": "0.13.0"
}should not be needed anymore either |
Beta Was this translation helpful? Give feedback.
-
|
I have this issue with the latest version |
Beta Was this translation helpful? Give feedback.
-
|
@yekdagets did you end up fixing this? Am in the same situation now : client component that runs |
Beta Was this translation helpful? Give feedback.
-
|
auth works server side, so if you want to use auth in client component you can declare a function on another file with 'use server' at the top something like this 'use server' export async function getSession() { and you can import getSession in a client component, hope this help you |
Beta Was this translation helpful? Give feedback.
-
|
I was looking everywhere for how to do this. thank you so much! |
Beta Was this translation helpful? Give feedback.
-
|
@balazsorban44 is OAuth va OIDC supported on the edge runtime with v5? I've only seen credential provider and email-http provider mentioned so far. I've hit the following error when using It looks like this has been raised before (1 2), but issues were closed without fixes. It seems logical as Have I misconfigured something or is this a known issue? |
Beta Was this translation helpful? Give feedback.
-
Beta Was this translation helpful? Give feedback.
-
|
@samtgarson did u figure out with Google provider and middleware together? |
Beta Was this translation helpful? Give feedback.
-
|
Thanks @balazsorban44, I knew it must be something like this. I’ll give it a try this evening and let you know @yekdagets 🤞 |
Beta Was this translation helpful? Give feedback.
-
|
@samtgarson if u handle it, can you share with us? |
Beta Was this translation helpful? Give feedback.
-
|
Cleaning up my versions as described in that linked reply worked (at least, I’ve moved forward to a different error…) |
Beta Was this translation helpful? Give feedback.
-
|
Just came across something - maybe - missing?! When we try to use the ExamplePath: Gives me this TS error: Did I miss something about this in the PR discussion? |
Beta Was this translation helpful? Give feedback.
-
|
I am also getting the same issue as well, when working with my app, it does work, not sure if it's just TypeScript that is complaining. |
Beta Was this translation helpful? Give feedback.
-
|
@Dimitry-prog Can you please share a example config? I'm facing the same issue. |
Beta Was this translation helpful? Give feedback.
-
|
Solution -- Just end the control with a simple return. |
Beta Was this translation helpful? Give feedback.
-
|
I found out if you combine the middleware with auth.config, it will solve the overload match issue, but I had other issues with callbacks, the best solution is to return if clauses by NextResponse.next(); which works perfectly. |
Beta Was this translation helpful? Give feedback.
-
|
i have same issue. how can we solve that? any example code? @balazsorban44 |
Beta Was this translation helpful? Give feedback.
-
|
What's the latest story with supporting lower level HTTP client options? There was a pretty length discussion #3944 about struggles folks have been running into with corporate proxies. It seemed to boil down to people having to maintain their own fork or patch the library to pass custom HTTP agents. Luckily my use case #8491 only requires a simple pass through of a https://authjs.dev/guides/corporate-proxies/corporate-proxy and the v5 migration guide should probably be updated at the very least. |
Beta Was this translation helpful? Give feedback.
-
|
Hi ! I face the same error as above : my package.json: I try the override method but it doen't seem to work for me. |
Beta Was this translation helpful? Give feedback.
-
|
You do not need the @auth/core as dependency. Just as override. That is a safe fix for the "raw" issue. How did you setup the override? And what package manager do you use? |
Beta Was this translation helpful? Give feedback.
-
|
Thank you I didn't know for I'm using pnpm. Setup: "pnpm": {
"overrides": {
"@auth/core": "0.13.0"
}
}
Seems to be working now. Thanks |
Beta Was this translation helpful? Give feedback.
-
|
should not be needed anymore either. |
Beta Was this translation helpful? Give feedback.
-
|
Hi! I'm quite new to Nextjs and with next-auth. I'm currently rewrite an app with Nextjs App router & i'm using Next-Auth v5. You always need to be authenticated to use the app. I'm facing two main issue with Next-auth at the moment : 1. Redirect to provider login screen instead of next-auth when user is not logged in Currently i created a 2. Logout should also log out from the provider For signout i use server actions : import { CSRF_experimental } from '@/auth'
export function SignOut(props: any) {
return (
<form action='/api/auth/signout' method='post'>
<button {...props} />
<CSRF_experimental />
</form>
)
}I think to use the |
Beta Was this translation helpful? Give feedback.
-
|
Been using NextAuth v5 for a while now and overall I'm super happy. However, I have one major issue with this new update, especially regarding the decision not to run the session callback. What is the recommended way to retrieve more user info in v5 now that the session callback isn't invoked on the server? Before it was trivial to return extra user / session fields from the adapter and have access to that in the session callback, but now it doesn't seem like that's the case. It doesn't matter what my adapter returns, since you cut half of it away anyways... I don't understand this decision since it seems to just make it harder to modify the default behaviors... Example usecase, I put an Can you shed some light on how to achieve this with this new update? Right now I'm patching next-auth to invoke this callback with all info, as the calls are on the server I don't have to care about leaking this to the client anyways... Auth core patch: diff --git a/lib/routes/session.js b/lib/routes/session.js
index e496d921578b735e640d1fc766582831dcbfdb1c..3ce6dcae1c2544fa4f439b551b5cecf3f561ad17 100644
--- a/lib/routes/session.js
+++ b/lib/routes/session.js
@@ -89,9 +89,8 @@ export async function session(params) {
// Pass Session through to the session callback
// @ts-expect-error
const sessionPayload = await callbacks.session({
- // By default, only exposes a limited subset of information to the client
- // as needed for presentation purposes (e.g. "you are logged in as...").
session: {
+ ...session,
user: { name: user.name, email: user.email, image: user.image },
expires: session.expires.toISOString(),
},NextAuth patch: diff --git a/lib/index.js b/lib/index.js
index 5a75f390e1ed59db192587176cf6fabd229cdf84..d123a9aea1b4d861ae78a23951e1feecf831c57c 100644
--- a/lib/index.js
+++ b/lib/index.js
@@ -9,17 +9,7 @@ async function getSession(headers, config) {
headers: { cookie: headers.get("cookie") ?? "" },
});
config.useSecureCookies ?? (config.useSecureCookies = origin.protocol === "https:");
- return Auth(request, {
- ...config,
- callbacks: {
- ...config.callbacks,
- // Since we are server-side, we don't need to filter out the session data
- // See https://nextjs.authjs.dev/v5#authenticating-server-side
- session({ session, user, token }) {
- return { ...session, user: user ?? token };
- },
- },
- });
+ return Auth(request, config);
}
function isReqWrapper(arg) {
return typeof arg === "function"; |
Beta Was this translation helpful? Give feedback.
-
|
Or simply add your custom fields as columns to the User table if you use a DB Adapter. |
Beta Was this translation helpful? Give feedback.
-
|
As far as I know, you can't include data from other models for the session, such as a (I updated my example to include a |
Beta Was this translation helpful? Give feedback.
-
Still dont understand why we cant do the same with sessions...
But maybe i dont want to expose all fields? |
Beta Was this translation helpful? Give feedback.
-
|
FWIW I totally agree -- I'd love to continue using sessions instead of JWT, but the solution I shared was the only thing that worked for me for the time being. @balazsorban44 If you could provide any insight on the decision here, or if there is another way to achieve this with sessions, it would be much appreciated! |
Beta Was this translation helpful? Give feedback.
-
|
This raised my eyebrow for me while reading the v5 docs. Hopefully we can get the reasoning behind this direction. |
Beta Was this translation helpful? Give feedback.
-
|
Hi, @balazsorban44, thanks for the v5! I ran into an issue when deploying it to Cloud Run (basically behind a proxy). The request origin is resolved to Now, I believe the issue isn't specific for v5. But it seems that there are options to bypass this in v4. Since v5 only exports the handlers and I haven't found a way to build a modified NextRequest myself, there probably isn't a workaround. What would you suggest as a fix? Should I create an issue/PR for v4? I'm happy to contribute, but would need some hints :) Edit: The patch below isn't needed. See the thread for a nicer fix! Here's a hacky patch that I'm currently applying and fixes the issue |
Beta Was this translation helpful? Give feedback.
-
|
Doesn't something like this work? // api/[...nextauth]/route.ts
import { handlers } from "~/auth"
export const GET = (req: NextRequest) => {
// do stuff
const url = ...
return handlers.GET({...req, url });
}
// ... |
Beta Was this translation helpful? Give feedback.
-
|
Julius' suggestion is the correct way/equivalent of advanced init in a Route Handler. 👍 |
Beta Was this translation helpful? Give feedback.
-
|
I tried that earlier, but it doesn't work. That's why I wrote that I cannot construct/modify the request by hand 😞 Maybe I'm missing something. But That leads to various errors in NextAuth internals, such as
And the same is also signalled by TS |
Beta Was this translation helpful? Give feedback.
-
|
What if you make a new object with your modified URL? export const GET = (req: NextRequest) => {
const url = new URL(req.url);
url.pathname = url.pathname.replace("/api/auth", "");
return getHandler(new NextRequest(url, req));
}; |
Beta Was this translation helpful? Give feedback.
-
|
@juliusmarminge yes, that worked! Thank you 🙌 If anyone finds this thread, here's my full import {GET as authGET, POST as authPOST} from '@/auth'
import {NextRequest} from 'next/server'
export const GET = (req: NextRequest) => {
const patchedUrl = patchUrl(req.url)
return authGET(new NextRequest(patchedUrl, req))
}
export const POST = (req: NextRequest) => {
const patchedUrl = patchUrl(req.url)
return authPOST(new NextRequest(patchedUrl, req))
}
/**
* Next doesn't properly handle requests when behind a proxy (e.g. Cloud Run).
* There's an existing env var, but it's not used in all places.
*
* Here, we patch the url to use the NEXTAUTH_URL env var and leave the rest of the request intact.
* Hopefully it doesn't break anything, but it's only used for the auth routes.
*/
function patchUrl(url: string) {
const urlObj = new URL(url)
const origin = process.env.NEXTAUTH_URL ?? urlObj.origin
return url.replace(urlObj.origin, origin)
} |
Beta Was this translation helpful? Give feedback.
-
Beta Was this translation helpful? Give feedback.
-
|
In Server Components use |
Beta Was this translation helpful? Give feedback.
-
|
Did something change in the type-definition for the I'm looking to implement the HTTP-based Email provider following this doc but TypeScript is very unhappy that I do not provide the It also requires that It's not a huge deal as I can always do the following: {
id: "email",
type: "email",
name: "Email",
from: "",
server: "",
maxAge: 60 * 10,
options: {},
async sendVerificationRequest(...) { ... },
}But it feels kinda dirty 😅 |
Beta Was this translation helpful? Give feedback.
-
|
Related #8601 |
Beta Was this translation helpful? Give feedback.
-
|
@Punie do you happen to have a working example of the email provider that you can share? I keep getting |
Beta Was this translation helpful? Give feedback.
-
|
In my case i had to do it like this Also there is no way to change the id to 'mailgun' or whatever, is enforced to be 'id' so you can't have 2 email providers |
Beta Was this translation helpful? Give feedback.
-
|
@balazsorban44 since solving the previous issue I've encountered another critical issue, possibly due to my set up but I cannot fathom what I'm doing wrong: Right now, the OAuth handshake is succeeding and the session is being passed to the frontend correctly ( The What's more, the I have done everything I can to ensure the versions of my packages are correct, including clearing my lock file. I currently only have |
Beta Was this translation helpful? Give feedback.
-
|
Likely same as #7423 (comment)
|
Beta Was this translation helpful? Give feedback.
-
|
|
Beta Was this translation helpful? Give feedback.
-
|
RSC: log: |
Beta Was this translation helpful? Give feedback.
-
|
Any progress on that? Auth() returning null for me as well with Auth0Provider |
Beta Was this translation helpful? Give feedback.
-
|
work with @auth/prisma-adapter, the auth object received in the authorized callback (or inside the middleware - req.auth) is always null |
Beta Was this translation helpful? Give feedback.
-
|
Has anyone been able to successfully use v5 with a |
Beta Was this translation helpful? Give feedback.
-
|
Did you find a solution to this? I'm also seeing this error :( |
Beta Was this translation helpful? Give feedback.
-
|
Have you tried deleting the |
Beta Was this translation helpful? Give feedback.
-
|
Can't find a solution for this even though they say it is supported. I guess they've just written the docs before solving it. Kind of annoying tbh. Perhaps time to re-write to app folder.. |
Beta Was this translation helpful? Give feedback.
-
|
Deleting and Re-Installing |
Beta Was this translation helpful? Give feedback.
-
|
same issue on my side |
Beta Was this translation helpful? Give feedback.
-
|
@balazsorban44 It seems that once cannot import anything into middleware that has |
Beta Was this translation helpful? Give feedback.
-
|
Ignore ORMs, what about the auth configs... that is super sensitive stuff that you would want to put |
Beta Was this translation helpful? Give feedback.
-
|
What's sensitive? Your envs wont be accesible to client with or without server-only |
Beta Was this translation helpful? Give feedback.
-
|
True... but that means anything you include in middleware cannot be included on your server. And there are things that are sensitive. |
Beta Was this translation helpful? Give feedback.
-
As soon as this file gets marked as This is not exclusive to Auth, really anything that you need a middleware for, can't be marked as |
Beta Was this translation helpful? Give feedback.
-
|
@barryengineerapart for what it's worth, I am also concerned, not only because of this but also because the notion of importing the same At first I wasn't sure what to think about this API, but after using it, while I get the convenience of only having one |
Beta Was this translation helpful? Give feedback.
-
|
Code Error Code Error |
Beta Was this translation helpful? Give feedback.
-
|
Route handlers in the app directory have a slightly different implementation to API routes in the pages directory. Go checkout the next docs for Route Handlers, they have some clear examples. (This isn’t anything to do with NextAuth though |
Beta Was this translation helpful? Give feedback.
-
Hi, I have already tried to implement these solutions, but the error still seems to appear. |
Beta Was this translation helpful? Give feedback.
-
export async function GET(req: NextRequest) {
// Check if user is logged in
const session = await auth(); // shouldn't need to pass req to auth functions, headers are globally available
if (!session || !session.user) {
console.log("User not logged in");
return NextResponse.json("You must be logged in to upload.", { status: 401 });
}
// Query the database by email to get the number of generations left
const user = await prisma.user.findUnique({
where: {
email: session.user.email!,
},
select: {
credits: true,
location: true,
},
});
return NextResponse.json({
remainingGenerations: user?.credits
});
} |
Beta Was this translation helpful? Give feedback.
-
|
In order to implement a custom signin page, what is the new method to get the provider list? Before it was |
Beta Was this translation helpful? Give feedback.
-
|
You can fetch /api/auth/providers ? |
Beta Was this translation helpful? Give feedback.
-
|
no, that does not work |
Beta Was this translation helpful? Give feedback.
-
|
@TSV-KG It does work, but we need type definitions, I'm looking to make PR for that. |
Beta Was this translation helpful? Give feedback.
-
|
if it does not work, check your sessionprovider implementation |
Beta Was this translation helpful? Give feedback.
-
|
Hi folks, someone experimented an issue with next.js 14.1.4 and Keycloak? and this redirect error from Keycloak: KeycloakProvider({
id: 'keycloak',
clientId: process.env.KC_CLIENT_ID,
clientSecret: process.env.AUTH_SECRET,
issuer: process.env.KC_ISSUER_URL,
client: {
token_endpoint_auth_method: 'none',
}}) |
Beta Was this translation helpful? Give feedback.
-
|
Added a bug report (that was autoclosed, thanks to the rigid config) and pull request for the tiktok bug. See here: #10727 and #10728 |
Beta Was this translation helpful? Give feedback.
-
|
how can i pass the request to the auth function in nextauth v5 when i try to use the auth() in the pages /api directory it gives me this error |
Beta Was this translation helpful? Give feedback.
-
|
Never tested it on the page router myself, but I think we should pass in the |
Beta Was this translation helpful? Give feedback.
-
|
I'm a bit confused this apparently hasn't been discussed anywhere. The new |
Beta Was this translation helpful? Give feedback.
-
|
Is it possible to use the Would it make sense to make another instance of |
Beta Was this translation helpful? Give feedback.
-
|
here is the guide for edge compatiblity, they recommend splitting config for middleware and for server https://authjs.dev/getting-started/migrating-to-v5#edge-compatibility |
Beta Was this translation helpful? Give feedback.
-
|
This has been fixed by Vercel for quite some time now.
|
Beta Was this translation helpful? Give feedback.
-
|
I assume you were replying to me, but what do you mean that it was fixed and how? |
Beta Was this translation helpful? Give feedback.
-
|
Does anyone have a client side example of the custom sign-in? We originally had our previous implementation designed with using the interception pattern in mind, and with only finding rsc as a working example makes this challenging to want to continue to support |
Beta Was this translation helpful? Give feedback.
-
|
NextAuth.js v5 doesn't seem to work properly with keycloak. Keycloak authenticates the user, but next-auth doesn't update or set the session. More details: #11237 |
Beta Was this translation helpful? Give feedback.
-
|
We really need a way to modify the token endpoint request #10728 |
Beta Was this translation helpful? Give feedback.
-
|
While I understand the default position that the Credentials provider should not support server sessions, there are use cases where this limitation means the whole application can't avail of server sessions when in fact there is no reason for this constraint. For example, in development we use a mock login that allows testers to quickly switch in and out of different roles without requiring management of a dozen oAuth credentials. This massively boosts productivity. Replicating this with Auth.js requires using the Credentials provider but I have to set session strategy to JWT. Could this be just a default, and support a provider option to allow server sessions? Note, while the community have some work arounds (e.g.https://nneko.branche.online/next-auth-credentials-provider-with-the-database-session-strategy/) these will no doubt break as the API changes over time so a first party solution would be best I think. |
Beta Was this translation helpful? Give feedback.
-
|
Please anyone help me to fix this, providers: [ This is my credential provider and working fine on dev environment , but in deployment , this gives me timeout error [note: during deployment if I gave local IP related to my LAN for a deployed app it's working fine , but when providing public IP address , issue comes] please suggest me how t o fix this issue |
Beta Was this translation helpful? Give feedback.
-
|
Looks like your |
Beta Was this translation helpful? Give feedback.
-
|
I would really like to implement the following flow: User signs in with credentialsProvider and obtains jwt token from my backend (dj-rest-auth) Is it possible to link provider accounts to one main account with the jwt strategy? |
Beta Was this translation helpful? Give feedback.
-
|
Could anyone help me with this issue: #11648 Works locally but not in production: Next-Auth ^5.0.0-beta.20 / Keycloak 18.0.2 / Next: ^14.2.2 full explanation and code in the post |
Beta Was this translation helpful? Give feedback.
-
|
Using JWT strategy and credentials provider, how do I set max token age? No refresh token just the access token? I would like the user to be logged out when the age expires. |
Beta Was this translation helpful? Give feedback.
-
|
As in Twitter OAuth 2.0, there is no way to get the user's email address. Twitter does not provide any Scope to get an authenticated user's email address. Even if you check "Request email from users" in the Twitter App you won't get the email address. But if you use OAuth 1.0A you can request email using "include_email=true" scope. Currently, in v5 there is only an OAuth 2.0 way in Twitter but we can't get email address. Please add OAuth 1.0A support that we have in v4 Please add legacy Twitter OAuth 1.0A provider in V5 |
Beta Was this translation helpful? Give feedback.
and others
-
Let's discuss #7443 here.
Keep the PR comments to discuss actual issues/concerns about the ongoing implementation. You can ask for help specific to your project here, or if you are not sure why something isn't working.
Beta Was this translation helpful? Give feedback.
All reactions