为什么我在Nextjs中登录成功后session为空？

Question

我正在使用 Nextjs 14、NextAuth 5 和 Strapi v4。我尝试使用电子邮件和密码登录；虽然我成功登录并

signedIn

检索令牌和用户数据，但会话为空。请看看我的代码并帮助我解决我的问题。预先感谢。

这是我的根布局：

"use client";
import Navbar from "./ui/common/header/Navbar";
import Footer from "./ui/common/footer/Footer";
import { NextAuthProvider } from "./api/auth/Provider";
import { SessionProvider, useSession } from "next-auth/react";


export default function RootLayout({
  children,
}: {
  children: React.ReactNode;
}) {
// Wrap useSession within SessionProvider
return (
  <SessionProvider>
    <RootLayoutContent>{children}</RootLayoutContent>
  </SessionProvider>
 );
}

function RootLayoutContent({ children }: { children: React.ReactNode }) {
// Get the session data
const { data: session } = useSession();

// Render the layout with the obtained session
return (
  <html lang="en">
     <NextAuthProvider session={session}>
        <body className={inter.className}>
          <Navbar />
          {children}
          <Footer />
        </body>
    </NextAuthProvider>
  </html>
 );
}

这是

app/api/auth/[...nextauth].tsx

”

import { authOptions } from "@/app/services/auth";
import NextAuth from "next-auth";

// import the authOptions you have created inside the auth.js file
const handler = NextAuth(authOptions);
export { handler as GET, handler as POST };

这是

login.tsx

:

import axios from "axios";

const strapiUrl =
  process.env.NEXT_PUBLIC_API_URL || "http://127.0.0.1:1337";

export async function signIn({
  redirect,
  email,
  password,
}: {
  redirect: boolean;
  email: string;
  password: string;
}) {
  try {
     const res = await axios.post(`${strapiUrl}/api/auth/local`, {
      identifier: email,
      password,
    });

    return res.data;
  } catch (error) {
    throw error;
  }
}

这是

auth.tsx

：

import CredentialsProvider from "next-auth/providers/credentials";
import { signIn } from "./login";
import { SessionStrategy } from "next-auth";

export const authOptions = {
  session: {
    jwt: true,
    strategy: "jwt" as SessionStrategy, // Explicitly define the type
  },
  secret:process.env.NEXTAUTH_URL,
  providers: [
    CredentialsProvider({
      name: "Sign in",
      credentials: {
        email: {
          label: "Email",
          type: "email",
          placeholder: "[email protected]",
        },
        password: { label: "Password", type: "password" },
      },
      async authorize(credentials) {
        if (credentials == null) return null;

      try {
          const { user, jwt } = await signIn({
            redirect:false,
            email: credentials?.email,
            password: credentials?.password,
      });
      
      return { ...user, jwt };
      } catch (error) {
         // Sign In Fail
         return null;
      }
     },
   }),
  ],
};

这是

provider.tsx

：

"use client";

import { SessionProvider } from "next-auth/react";

export const NextAuthProvider = ({ children, session }: { children: any; session: any 
}) => {
   return (
    <SessionProvider session={session} >
      {children}
    </SessionProvider>
  );
 };

这是我的

submit

表单中的

Login.tsx

函数。我无法添加所有代码，因为这里有很多代码。我

console.log(signedIn)

在这里，它返回令牌和用户数据。

 const onSubmit: SubmitHandler<IFormValues> =async (data) => {
    const signedIn = await signIn( {
      redirect: false,
      email: data?.userName,
      password: data?.password,
    });
    console.log(signedIn)
    if (!signedIn.error) {
      router.push("/profile");
      return;
    }
  };

我在网站标题中导入了

import { useSession, signIn, signOut } from "next-auth/react"

和来自

console.log(session)

的

const {data:session} = useSession()

，但它返回

null

。

Answer 1

这个文件

app/api/auth/[...nextauth].tsx

应该是

app/api/auth/[...nextauth]/route.ts

[...nextauth]

是一个包含

route.ts

文件的文件夹。

为什么我在Nextjs中登录成功后session为空？

问题描述投票：0回答：1

1个回答

最新问题

为什么我在Nextjs中登录成功后session为空？

问题描述 投票：0回答：1

1个回答

最新问题

问题描述投票：0回答：1