[SOLVED]JWT_TOKEN_ERROR NextAuth

Answered

Spot-billed Duck posted this in #help-forum

Spot-billed DuckOP

2023-10-08T14:42:19.000Z

hey guys, I have some issues with nextauth and my configuration;

declare module "next-auth" {
    interface Session extends DefaultSession {
        user: {
            id: string;
            isStaff: boolean
        } & DefaultSession["user"];
    }

    interface User {
        // ...other properties
        isStaff: boolean
    }
}
export const authOptions: NextAuthOptions = {
    callbacks: {
        session: async ({session, user, token}) => (
            {
            user: (await db.select({
                id: users.id,
                name: users.name,
                surname: users.surname,
                email: users.email,
                isStaff: users.isStaff,
            }).from(users).where(eq(users.id, user.id)))[0],

        }),

    },
    pages: {
        //signOut: '/api/auth/signout',
        newUser: "/api/auth/register"

    },

    adapter: DrizzleAdapter(db, pgTable),
    providers: [
        DiscordProvider({
            clientId: env.DISCORD_CLIENT_ID,
            clientSecret: env.DISCORD_CLIENT_SECRET,
        }),

        GoogleProvider({
            clientId: env.GOOGLE_CLIENT_ID,
            clientSecret: env.GOOGLE_CLIENT_SECRET
        }),
        Credentials({
            authorize: async (credentials, request) => {
                const creds = await signInSchema.parseAsync(credentials);

                const user = await db.select().from(users).where(eq(users.email, creds.email));

                if (!user[0]) {
                    return null;
                }
                console.log(user)

                const isValidPassword = await verify(user[0].password, creds.password);

                console.log(isValidPassword)

                if (!isValidPassword) {
                    return null;
                }

                return {
                    user: user[0]
                }
            }

        }),
        
    ],
};

export const getServerAuthSession = () => getServerSession(authOptions);

Answered by Spot-billed Duck

Just follow the nextauth docs, then drizzle docs if u use drizzle

View full answer

139 Replies

Spot-billed DuckOP

2023-10-08T14:42:44.000Z

(for credentials)

Capelin

2023-10-08T14:53:19.000Z

what happns if you return { ...token, ...user } in the callback?

@Capelin what happns if you return { ...token, ...user } in the callback?

Spot-billed DuckOP

2023-10-08T15:04:50.000Z

i'll try it, but it works with other adapters

Capelin

2023-10-08T15:06:35.000Z

credentials provider is a bit weird... How would you like the user object to look like?

And I assume you want it returned on succesful login request?

@Capelin credentials provider is a bit weird... How would you like the user object to look like? And I assume you want it returned on succesful login request?

Spot-billed DuckOP

2023-10-08T15:08:03.000Z

yeah, but as you can see I just get it from DB

@Capelin what happns if you return { ...token, ...user } in the callback?

Spot-billed DuckOP

2023-10-08T15:27:48.000Z

callbacks: {
        session: async ({session, user, token}) => (
            {
                user: (await db.select({
                    id: users.id,
                    name: users.name,
                    surname: users.surname,
                    email: users.email,
                    isStaff: users.isStaff,
                }).from(users).where(eq(users.id, user.id)))[0],
                ...token

            }),

    },

like that ?

Credentials({
            authorize: async (credentials, token) => {
                const creds = await signInSchema.parseAsync(credentials);

                const user = await db.select().from(users).where(eq(users.email, creds.email));

                if (!user[0]) {
                    return null;
                }
                console.log(user)

                const isValidPassword = await verify(user[0].password, creds.password);

                console.log(isValidPassword)

                if (!isValidPassword) {
                    return null;
                }

                return {
                    ...user
                }
            }

        }),

Capelin

2023-10-08T15:29:35.000Z

    async session({ session, token, user }) {

          "fun stuff"

      return{ ...session, ...token, ...user };
    },

Spot-billed DuckOP

2023-10-08T15:29:51.000Z

I keep my user ?

like in the first code ?

Capelin

2023-10-08T15:32:54.000Z

if youre looking to return from the login you could do:

user.username = user[0].name

return user

hmm that's weird though since the user should be the db response

Spot-billed DuckOP

2023-10-08T15:33:56.000Z

so, smthg like that?

callbacks: {
        session: async ({session, user, token}) => {
           
            return  {...user,...session, ...token}

        },
    },

Capelin

2023-10-08T15:34:14.000Z

yeah, try that,

it'll show you the objects for debugging

Spot-billed DuckOP

2023-10-08T15:34:17.000Z

(without the usr)

Capelin

2023-10-08T15:34:55.000Z

"You can use the session callback to customize the session object returned to the client if you need to return additional data in the session object."

Spot-billed DuckOP

2023-10-08T15:35:49.000Z

so in my credentials i did something like that:

Credentials({
            authorize: async (credentials, token) => {
                const creds = await signInSchema.parseAsync(credentials);

                const user = await db.select().from(users).where(eq(users.email, creds.email));

                if (!user[0]) {
                    return null;
                }
                console.log(user)

                const isValidPassword = await verify(user[0].password, creds.password);

                console.log(isValidPassword)

                if (!isValidPassword) {
                    return null;
                }

                return user[0].email
            }

        }),

when I appeal it:

    const session = await getServerAuthSession()

    console.log(session?.user)

in the layout:

    return (
        <html lang="en">
        <head>
            <link rel="preconnect" href="https://fonts.googleapis.com"/>
            <link rel="preconnect" href="https://fonts.gstatic.com"/>
            <link href="https://fonts.googleapis.com/css2?family=Londrina+Solid:wght@100;300;400&display=swap"
                  rel="stylesheet"/>
        </head>
        <body className={`font-sans ${inter.variable}`}>
        <SessionProvider>
            <TRPCReactProvider headers={headers()}>{children}</TRPCReactProvider>
        </SessionProvider>

        <div className="pt-20">


        </div>
        </body>
        </html>
    );

return undefined

Capelin

2023-10-08T15:37:59.000Z

what about just

const session = await getSession()

console.log(session)

Spot-billed DuckOP

2023-10-08T15:38:34.000Z

null

Capelin

2023-10-08T15:40:01.000Z

Can you see a cookie in the browser?

Spot-billed DuckOP

2023-10-08T15:41:48.000Z

a session cookie appear

then disa

no, no session stored

Capelin

2023-10-08T15:46:49.000Z

 callbacks: {

    async jwt({ token, user}) {

console.log(token, user)
return { ...token, ...user,
}}

}

and console logging the session object inside callback?

Spot-billed DuckOP

2023-10-08T15:48:10.000Z

cookie is not stored

when I log

it logs that:

{
  name: undefined,
  email: undefined,
  picture: undefined,
  sub: undefined
} wailrothcs@gmail.com

but when I go to another page

it doesn't work

Capelin

2023-10-08T15:50:29.000Z

and it works for github provider?

Spot-billed DuckOP

2023-10-08T15:50:42.000Z

yeah, the discord one too

i'll become mad

Capelin

2023-10-08T15:54:56.000Z

I've been surfing my blood preassure for the past months working with the credentials provider

it's horrible

Spot-billed DuckOP

2023-10-08T15:55:05.000Z

my session cookie appear, then disappear

Spot-billed DuckOP

2023-10-08T16:01:41.000Z

AZHHHHHH

IT WORKS

IDK HOW

THANKS GOD

THANKS MOM FOR FOOD

THANKS DAD FOR FIRST COMPUTER

what i did:

callbacks: {
        async jwt({token, user, account, profile, isNewUser}) {
            user && (token = {...token, ...user});
            return token;
        },
        async session({session, token}) {
            if (token) {
                session.user = {...session, ...token};
            }

            return session;
        },
    },
    pages: {
        //signOut: '/api/auth/signout',
        newUser: "/api/auth/register"

    },
    session: {
        jwt: true,
        strategy: "jwt"
    },
    jwt: {
        maxAge: 60 * 60 * 24 * 30 * 6,
    },

@Capelin I've been surfing my blood preassure for the past months working with the credentials provider

Spot-billed DuckOP

2023-10-08T16:37:11.000Z

so I did something like that:

export const authOptions: NextAuthOptions = {
    callbacks: {
        async jwt({token, user, account, profile}) {
            user && (token = {...token, ...user});
            return token;
        },
        async session({session, token}) {

            const user = await db.select().from(users).where(eq(users.email, token.email))

            if (!user[0]) return null;

            return {
                name: user[0].name,
                surname: user[0].surname,
                id: user[0].id,
                email: user[0].email,
                delivery: {
                    city: user[0].city,
                    address: user[0].address,
                    postal_code: user[0].postal_code
                },
            }
        },
    },
  
    },
    session: {
        jwt: true,
        strategy: "jwt"
    },
    jwt: {
        maxAge: 60 * 60 * 24 * 30 * 6,
    },
    secret: env.NEXTAUTH_SECRET,
        CredentialsProvider({
            name: "credentials",
            authorize: async (credentials, token) => {
                const creds = await signInSchema.parseAsync(credentials);

                const user = await db.select().from(users).where(eq(users.email, creds.email));

                if (!user[0]) {
                    return null;
                }
                const isValidPassword = await verify(user[0].password, creds.password);

                if (!isValidPassword) {
                    return null;
                }

                return {
                    name: user[0].name,
                    surname: user[0].surname,
                    id: user[0].id,
                    email: user[0].email,
                    delivery: {
                        city: user[0].city,
                        address: user[0].address,
                        postal_code: user[0].posta
                    },
                }
            },
            type: "credentials"
        }),

    ],
};

Capelin

2023-10-08T16:55:32.000Z

nice ðŸ˜„ glad you got it working

Do you think it was splitting up the user object that did it?

@Capelin nice ðŸ˜„ glad you got it working Do you think it was splitting up the user object that did it?

Spot-billed DuckOP

2023-10-08T19:11:44.000Z

I used JWT tokens

Spot-billed DuckOP

2023-10-25T15:15:18.000Z

Hi @Capelin , I have a new issue with the code that was before;
it worked, but no more with credentials ? (idk why)
The session dispaerar from my cookies,
and I have this error:

[next-auth][error][JWT_SESSION_ERROR] 
https://next-auth.js.org/errors#jwt_session_error UNDEFINED_VALUE: Undefined values are not allowed {
  message: 'UNDEFINED_VALUE: Undefined values are not allowed',

(and up for everyone ^^)

Capelin

2023-10-25T17:38:04.000Z

Are you checking so the value is not undefined before you set it?

@Capelin Are you checking so the value is not undefined before you set it?

Spot-billed DuckOP

2023-10-25T18:15:36.000Z

what do you mean by that ?

user is never undefined

Spot-billed DuckOP

2023-10-25T18:44:46.000Z

full stack:

[next-auth][error][JWT_SESSION_ERROR] 
https://next-auth.js.org/errors#jwt_session_error UNDEFINED_VALUE: Undefined values are not allowed {
  message: 'UNDEFINED_VALUE: Undefined values are not allowed',
  stack: 'Error: UNDEFINED_VALUE: Undefined values are not allowed\n' +
    '    at handleValue (webpack-internal:///(rsc)/./node_modules/.pnpm/postgres@3.3.5/node_modules/postgres/src/types.js:124:87)\n' +
    '    at eval (webpack-internal:///(rsc)/./node_modules/.pnpm/postgres@3.3.5/node_modules/postgres/src/connection.js:148:96)\n' +
    '    at Array.forEach (<anonymous>)\n' +
    '    at build (webpack-internal:///(rsc)/./node_modules/.pnpm/postgres@3.3.5/node_modules/postgres/src/connection.js:148:29)\n' +
    '    at Object.execute (webpack-internal:///(rsc)/./node_modules/.pnpm/postgres@3.3.5/node_modules/postgres/src/connection.js:108:13)\n' +
    '    at go (webpack-internal:///(rsc)/./node_modules/.pnpm/postgres@3.3.5/node_modules/postgres/src/index.js:255:18)\n' +
    '    at Query.handler (webpack-internal:///(rsc)/./node_modules/.pnpm/postgres@3.3.5/node_modules/postgres/src/index.js:250:33)\n' +
    '    at Query.handle (webpack-internal:///(rsc)/./node_modules/.pnpm/postgres@3.3.5/node_modules/postgres/src/query.js:118:69)',
  name: 'Error'
}

export const authOptions: NextAuthOptions = {
    callbacks: {
        async jwt({token, user, account, profile}) {
            user && (token = {...token, ...user});

            return token;
        },
        async session({session, token}) {

            const user = await db.select().from(users).where(eq(users.email, token.email))

            if (!user[0]) return null;

            return {
                name: user[0].name,
                surname: user[0].surname,
                id: user[0].id,
                email: user[0].email,
                delivery: {
                    city: user[0].city,
                    address: user[0].address,
                    postal_code: user[0].postal_code
                },
            }
        },
    },

    pages: {
        //signOut: '/api/auth/signout',
        newUser: "/api/auth/register"

    },
    session: {
        jwt: true,
        strategy: "jwt"
    },
    jwt: {
        maxAge: 60 * 60 * 24 * 30 * 6,
    },
    secret: env.NEXTAUTH_SECRET,

    adapter: DrizzleAdapter(db, pgTable),
    providers: [...

        CredentialsProvider({
            name: "credentials",
            authorize: async (credentials, token, session) => {
                const creds = await signInSchema.parseAsync(credentials);

                const user = await db.select().from(users).where(eq(users.email, creds.email));

                if (!user[0]) {
                    return null;
                }

                console.log("user: ", user[0])



                const isValidPassword = await verify(user[0].password!, creds.password);


                if (!isValidPassword) {
                    return null;
                }


                return {
                    user: {
                        name: user[0].name,
                        surname: user[0].surname,
                        id: user[0].id,
                        email: user[0].email,
                        isStaff: user[0].isStaff,

                        delivery: {
                            city: user[0].city,
                            address: user[0].address,
                            postal_code: user[0].postal_code
                        },
                    }
                }

            },
            type: "credentials"
        }),

    ],

Dunker

2023-10-25T18:50:43.000Z

remove here if (!user[0]) return null;

also if user is undef, user[0] will be undef and .name too

so you need to check everything

@Dunker remove here `if (!user[0]) return null;`

Spot-billed DuckOP

2023-10-25T18:51:53.000Z

when I log user[0] is never null

even with this removed, it doesnt work

Dunker

2023-10-25T18:52:26.000Z

its saying undefined, not null

user itself can be undefined,

Spot-billed DuckOP

2023-10-25T18:54:10.000Z

if (!user[0] || !user ) {
                console.log("BIG ISSUE")
                return null;
            }

Dunker

2023-10-25T18:54:20.000Z

nextauth working like
if (!user) return null;

rest is not important

Spot-billed DuckOP

2023-10-25T18:54:54.000Z

BIG ISSUE is never logged

Dunker

2023-10-25T18:54:56.000Z

first remove all checks like && !

it ll say what is undefined then

Spot-billed DuckOP

2023-10-25T18:55:22.000Z

like here?

async jwt({token, user, account, profile}) {
            user && (token = {...token, ...user});
            return token;
        },

Dunker

2023-10-25T18:55:56.000Z

yep

Spot-billed DuckOP

2023-10-25T18:56:04.000Z

        async jwt({token, user, account, profile}) {
            // user &&
            (token = {...token, ...user});
            return token;
        },
        async session({session, token}) {

            const user = await db.select().from(users).where(eq(users.email, token.email))

            // if (!user ) {
            //     return null;
            // }

ok so like that

Dunker

2023-10-25T18:56:19.000Z

if sth async, there is always a room for undefined

now console log user

Spot-billed DuckOP

2023-10-25T18:57:13.000Z

in (jwt) and (session)?

ohh

mhh, it is weird

@Dunker now console log user

Spot-billed DuckOP

2023-10-25T19:00:24.000Z

so there is the stack trace https://pastebin.com/xsv57hkE

there is the code
https://pastebin.com/mbB1Kcfi

Dunker

2023-10-25T19:02:08.000Z

as you see things are null

Spot-billed DuckOP

2023-10-25T19:02:32.000Z

yeah but not all the time

Dunker

2023-10-25T19:02:53.000Z

hmm, do you have any logger setup

Spot-billed DuckOP

2023-10-25T19:03:05.000Z

like ?

Dunker

2023-10-25T19:03:11.000Z

sentry

Spot-billed DuckOP

2023-10-25T19:03:45.000Z

nop ðŸ˜¦

Dunker

2023-10-25T19:04:52.000Z

nice

have you done what i said

removing checks

@Spot-billed Duck there is the code https://pastebin.com/mbB1Kcfi

Spot-billed DuckOP

2023-10-25T19:06:04.000Z

yeah, look at the

Dunker

2023-10-25T19:06:17.000Z

can you send it as .txt

i cant open that site

Spot-billed DuckOP

2023-10-25T19:06:59.000Z

yeah

ups

I did the wrong thing

I forget a check

so the user is well logged

then

set as undefined

Dunker

2023-10-25T19:09:35.000Z

cuz its async

and async always have undef

Spot-billed DuckOP

2023-10-25T19:10:02.000Z

async on JWT?

Dunker

2023-10-25T19:10:17.000Z

yep

Spot-billed DuckOP

2023-10-25T19:10:24.000Z

I removed it, same issue

Dunker

2023-10-25T19:10:28.000Z

for ex

Spot-billed DuckOP

2023-10-25T19:10:29.000Z

my user is well logged

Dunker

2023-10-25T19:10:32.000Z

no dont remove it

Spot-billed DuckOP

2023-10-25T19:10:34.000Z

then undefined

(in fact in the jwt, the async is a bit useless

Dunker

2023-10-25T19:10:58.000Z

do you have live share extension at your vscode

Spot-billed DuckOP

2023-10-25T19:11:10.000Z

i'm on webstorm; wait a sec

Capelin

2023-10-25T19:56:28.000Z

Try wrapping it all in try catch blocks

then console log before each time JWT is set

also make sure the next-auth secret is correctly set up

I would just throw an error when incorrect login instead of returning null

tbh returning null is more elegant and a better design pattern, scratch that

Capelin

2023-10-25T20:16:13.000Z

(token = {...token, ...user});

Why are you doing this?

what if you do

token.user = user
 return { ...token}

 return { ...token, ...user}

Capelin

2023-10-25T21:11:11.000Z

also, are you 100% sure that

name: user[0].name,

is not undefined?

Dunker

2023-10-25T21:41:43.000Z

https://dev.to/miljancode/drizzle-orm-next-auth-and-planetscale-2jbl

just ignore planetscale and use with postgres as you done before

@Dunker https://dev.to/miljancode/drizzle-orm-next-auth-and-planetscale-2jbl

Spot-billed DuckOP

2023-10-26T07:46:39.000Z

I should follow the DrizzleAdapter function ?

I don't have the same error now:
https://pastebin.com/wt7dw3ZW

My schema.ts:
https://pastebin.com/Eu31NGnm

and my nextauth config: https://pastebin.com/AD8E4UEU

Dunker

2023-10-26T08:58:44.000Z

Remove this thread, and open a new one with that error above
"NextAuth with drizzle orm error: getUserByAccount"
And share files as .ts

Spot-billed DuckOP

2023-10-26T19:35:29.000Z

!solved

@Spot-billed Duck !solved

riský

2023-10-27T05:58:16.000Z

can i ask which message was the most helpful for solving this thread?

@riský can i ask which message was the most helpful for solving this thread?

Spot-billed DuckOP

2023-10-29T11:46:24.000Z

oldcoder helped me a lot, but I found the solution by myself

riský

2023-10-29T11:46:46.000Z

i just need a message link to solve it...

if you have a message (or can make one) that has the things done to fix, much appreciated

Spot-billed DuckOP

2023-10-29T11:47:58.000Z

mhhh

Spot-billed DuckOP

2023-10-29T11:48:19.000Z

Just follow the nextauth docs, then drizzle docs if u use drizzle

Answer