getSession always returns null on server

[bratsos]

Hey community!

I'm trying to get the user's session on server side in order to render the correct page (login or dashboard) from the server. I'm using this on pages/index.tsx

export const getServerSideProps = async ({ req }: NextPageContext) => {
  const session = await getSession({ req })

  console.log('SSR Session', session)
  return {
    props: { // doesn't even matter }
  }
}

but session is always null when it comes from server.

I'm also getting the following error in the console

[next-auth][error][client_fetch_error]
https://next-auth.js.org/errors#client_fetch_error session FetchError: request to http://localhost:3000/api/auth/session failed, reason: connect ECONNREFUSED ::1:3000

If I replay the same GET request on the browser it works fine (and I'm getting the correct session as a response). I also tried to add a dumb endpoint pages/api/hello-world which is just replies with a 200 status code, and call this by directly editing node_modules/next-auth/dist/client/index.js. I'm getting the same connect ECONNREFUSED ::1:3000 error.

I have NEXTAUTH_URL=http://localhost:3000 in my .env.local and I can see the URL is correct by the error message in the console, plus I can verify that it works on client-side.

Am I missing something super obvious here?

Edit: I'm using next-auth: 3.11.0

[balazsorban44]

could you please provide a bit more information about your configuration and how you use signin/signout?

[bratsos]

Thanks for your reply!

My [...nextauth].ts file contains the following simple provider configuration

const options = {
  providers: [
    Providers.Google({
      clientId: googleClientId,
      clientSecret: googleClientSecret,
    }),
    Providers.Facebook({
      clientId: facebookClientId,
      clientSecret: facebookClientSecret
    }),
    Providers.Credentials({
      name: 'Credentials',
      credentials: {
        email: { label: "e-mail", type: "text", placeholder: "[email protected]" },
        password: { label: "Password", type: "password" }
      },
      async authorize(credentials) {
        // dumb authorization logic with my database
      }
    })
  ],
  callbacks: {
    async redirect(_url: string, baseUrl: string) {
      return baseUrl
    }
  },
  session: {
    jwt: true,
    maxAge: 30 * 24 * 60 * 60, // 30 days
  },
  database: mongoUrl,
}

export default (req: NextApiRequest, res: NextApiResponse) => {
  return NextAuth(req, res, options)
}

Login is triggered by manually invoking signIn('facebook') and signIn('google') functions

// pages/index.tsx
<Login
        onGooglePress={() => signIn(Providers.google)} 
        onFacebookPress={() => signIn(Providers.facebook)}
/>

Login is just a UI wrapper of my login screen that renders 2 buttons.

I've managed to login successfully (and maintain the session after a full page refresh).

Feel free to ask for more details if I missed anything here, and thanks for the quick reply!

[iaincollins]

Things that may cause this include:

1. Locally running firewall software that is preventing the server side route form connecting back to localhost (e.g. Windows Defender).
   In this case you should be able to address this in the firewall settings.

2. Running inside a virtual machine / container where "localhost" is relative to the container.
   There is no quick solution for this one yet (but one is in progress), but if it does apply to you there are some old posts about how work around this.

The only other edge cases for this sort of thing I can think of are weird local DNS resolution problems caused by different resolvers for localhost in different contexts, but if that is the case then probably more thing are broken (so seems unlikely).

If neither 1 or 2 apply to you could try http://127.0.0.1:3000 instead of http://localhost:3000 as your NEXTAUTH_URL and see if that works any better for you.

[poiintt]

Using NEXTAUTH_URL_INTERNAL with http://localhost:3000 worked for me

[shirotamaki]

Thanks for your advice, it is much appreciated.
I have solved my problem with the following settings !

NEXTAUTH_URL=http://localhost:3000
NEXTAUTH_URL_INTERNAL=http://127.0.0.1:3000

[abhaysharma3021]

Hi, I am using getSession in an api which returns currentUser session, its working perfectly after login, i'm able to fetch user data but when I'm trying call another api in the app and checking currentUser exists its returing [next-auth][error][CLIENT_FETCH_ERROR] . Can somebody help me with this?

[Bulletninja]

Same issue as you @abhaysharma3021, where you able to solve it?

[jvmhonorato]

create file: ' .eslintrc.json ' in the root of the application with the following contents:

{
  "env":{"browser": true, "node":true, "es6":true},
  "extends": ["eslint:recommended","next/core-web-vitals"]
}

[nemanjam]

This solves it https://next-auth.js.org/configuration/nextjs#in-api-routes

import { authOptions } from 'pages/api/auth/[...nextauth]'
import { getServerSession } from "next-auth/next"


export async function handler(req, res) {
  const session = await getServerSession(req, res, authOptions)
...

[wowczarczyk]

@balazsorban44 Do you think we could have a separate definition of the getServerSession method that takes NextRequest and NextResponse from the new Next.js 13 Route handlers? The problem with getting cookies and headers from require("next/headers") is that it won't work for standalone Next.js apps (on Docker), it only works in dev mode and presumably on Vercel.

[wowczarczyk]

Something like this works for me:

const req = {
    headers: Object.fromEntries(request.headers),
    cookies: Object.fromEntries(
      request.cookies.getAll().map((c) => [c.name, c.value])
    ),
  };
  const res = { getHeader() {}, setCookie() {}, setHeader() {} };

  const session = await getServerSession(req as any, res as any, authOptions);

But obviously is hacky due to the as any cast...

[ZilatAIOBC]

If you are not able to get session use gettoken instead
In authOption file

 secret: process.env.NEXTAUTH_SECRET as string,
  callbacks: {
                   async signIn(user:any) {
                              if (user) {
                                const data = await axios.post(`${process.env.NEXTAUTH_URL}/api/sign_in_create_account`, user);
                                if (data) {
                                  return user;
                                }
                            } else {
                              // Return false if login failed
                              console.log("Login failed");
                              return "/auth/signup";
                            }
                  },
                  async jwt({ token, account, profile,user }) {
                    // Persist the OAuth access_token and or the user id to the token right after signin
                    if (account) {
                      token.accessToken = account.access_token
                       token.id = user.id
                    }
                  return token;
    },

Keys and URL

generate your NEXTAUTH_SECRET key from
# Only for production – generate one here: https://generate-secret.vercel.app/32
and Url for local
NEXTAUTH_URL=http://localhost:3000

this is api route for calling token

import { getToken } from "next-auth/jwt"
export const GET = async (req) => {
  
  const session = await getToken({ req, secret:process.env.NEXTAUTH_SECRET })

  return NextResponse.json(
      { message: "GET Property Error", session },
      { status: 200 }
    );
  }

and the in your layout/page

const MainLayout = ({ children }) => {
  // Data Calling
  const [session, setSession] = useState(false);

  useEffect(() => {
    const fetch = async () => {
      if (!session) {
        const response = await axios.get("/api/auth/token");
        if (response.data.session) {
          setSession(true);
        }
      }
    };
    fetch();
  });
return (
    <>
      {session ? (
     // write code when session exist
) : (
     // write code when session is not there
      )}
    </>
  );
};

export default MainLayout;

[Bakhtiar85]

Hi, everyone.

I thought, it was the issue of Prisma but it is an issue with getSession.
I created issue
Here, someone made extra effort.

[huypham50]

For anyone seeing this issue with Next.js, you should use getServerSession instead of getSession

[jvmhonorato]

create file: ' .eslintrc.json ' in the root of the application with the following contents:

{
  "env":{"browser": true, "node":true, "es6":true},
  "extends": ["eslint:recommended","next/core-web-vitals"]
}

[mcmiro]

Using getServerAuthSession() instead of getServerSession() helped me. The import is: import { getServerAuthSession } from "@/server/auth";