Get User ID from session in next-auth client

Question

I'm using next-auth with Prisma and Graphql, I followed these instructions to set up the adapter and my models accordingly: https://next-auth.js.org/adapters/prisma Authentication works but when I inspect session object from here : const { data: session, status } = useSession() I don't see ID

The reason I need the ID is to make further GraphQL queries. I'm using email value for now to fetch the User by email, but having ID available would be a better option.

score 21 · Answer 1 · edited Jun 01 '22 at 00:02

21

Here's the quickest solution to your question:

src/pages/api/auth/[...nextAuth].js

export default NextAuth({
  ...
  callbacks: {
    session: async ({ session, token }) => {
      if (session?.user) {
        session.user.id = token.uid;
      }
      return session;
    },
    jwt: async ({ user, token }) => {
      if (user) {
        token.uid = user.id;
      }
      return token;
    },
  },
  session: {
    strategy: 'jwt',
  },
  ...
});

edited Jun 01 '22 at 00:02

kohane15

809
12
16

answered Apr 02 '22 at 22:32

Frahim

271
2
9

2

This might have changed; it's showing up as `token.sub` not `token.uid` for me. – Clay Morton Sep 10 '22 at 03:00

Usman Sabuwala · Answer 2 · 2023-04-17T22:47:00.253

I just referred to the NextAuth docs (this page) and finally got it working the right way

callbacks: {
  jwt({ token, account, user }) {
    if (account) {
      token.accessToken = account.access_token
      token.id = user?.id
    }
    return token
  }
  session({ session, token }) {
      // I skipped the line below coz it gave me a TypeError
      // session.accessToken = token.accessToken;
      session.user.id = token.id;

      return session;
    },
}

If you use TypeScript, add this to a new file called next-auth.d.ts

import NextAuth from 'next-auth';

declare module 'next-auth' {
  interface Session {
    user: {
      id: string;
    } & DefaultSession['user'];
  }
}

score 8 · Answer 3 · answered Nov 12 '22 at 15:06

Here's the quickest solution that worked for me

import NextAuth from "next-auth"
import { MongoDBAdapter } from "@next-auth/mongodb-adapter"
import clientPromise from "../../../lib/mongodb"

export const authOptions = {
    providers: [
      <...yourproviders>
    ],
    callbacks: {
      session: async ({ session, token, user }) => {
        if (session?.user) {
          session.user.id = user.id;
        }
        return session;
      },
    },
    adapter: MongoDBAdapter(clientPromise),
}

score 6 · Answer 4 · answered May 06 '23 at 01:31

6

No one of these solved my problem, but debugging, I found that token.sub is the user id, so what I did was:

callbacks: {
    session: ({ session, token }) => ({
      ...session,
      user: {
        ...session.user,
        id: token.sub,
      },
    }),
  },

answered May 06 '23 at 01:31

Maykon Oliveira

103
1
2
7

I can validate this being the right answer for this question as of now. Thank you! – Pepelius Jul 19 '23 at 13:01

score 4 · Answer 5 · edited Sep 03 '22 at 19:41

4

This worked for me.

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

edited Sep 03 '22 at 19:41

Yoav Kadosh

4,807
4
39
56

answered Apr 12 '22 at 23:58

Gautam Ghai

769
4
4

score 0 · Answer 6 · answered Dec 20 '21 at 15:35

I believe you can change the callbacks so it includes the user's ID in the session: https://next-auth.js.org/configuration/callbacks.

You will need to change the JWT callback so it also include the userId and the session callback so the id is also persisted to the browser session.

Get User ID from session in next-auth client

6 Answers6

Linked