无法在_app.js中为nextjs执行getServerSideProps

Question

希望更好地理解如何使用这样的函数，以便获得会话信息，甚至考虑在哪里放置我的导航组件。

目前我的导航嵌套在_app.js文件

<NavBar />
<Component {...pageProps} />

和我试图从服务器获得会话信息，因为我希望确保导航显示登录/签出取决于用户会话信息，如

export async function getServerSideProps(context) {
console.log("index getting session");
try {
const session = await getSession(context);
return {
props: {
session,
},
};
} catch (error) {
return {
props: {
session: null,
},
};
}
}

p。S - console.log()在顶部不运行

这样做不正确吗?如果有人有更好的建议，或者我应该把我的导航，以确保它可以执行getServerSideProps的身份验证目的。

感谢所有的帮助。花了一天多的时间，许多人向我指出下一个验证问题的方向，如NEXT_PUBLIC_SECRET未正确设置或NEXTAUTH_URL未正确设置，但我觉得可能是getServerSideProps而不是

Answer 1

你不能在App.js文件中调用getServerSideProps，请看这里

它将在后面介绍，但是我们需要弄清楚语义，因为我们真的不希望_app中的getServerSideProps为所有页面选择退出静态生成

如果你想让导航显示登录/签出取决于用户会话信息，那么一个解决方案是从<NavBar/>组件调用会话，你不必从服务器端调用它并将其传递给一个组件，你可以简单地利用useSession()并从<NavBar/>组件内部调用它来访问会话数据。

useSession ()

． 客户端:是
。服务器端:否

在NextAuth.js客户端中使用usessession () React Hook是检查是否有人登录的最简单的方法。
确保添加到pages/_app.js

import { useSession } from "next-auth/react";
//...
const NavBar = () => {
const { data: session, status } = useSession()
//...
}

现在基于status你决定在你的JSX中显示什么按钮:

{status === "authenticated" ? <SignOutButton/> : <SignInButton/>}

如果你想从服务器组件访问会话，你必须使用getServerSession()方法代替。