我有一个使用 next-auth 的小型应用程序,它显示登录/注销按钮,具体取决于用户是否登录。这些按钮按预期工作,并在单击时将我重定向到登录页面。
但是如果未登录,如何自动重定向到登录页面?
我尝试在 if(session)...
下添加 signIn()
但这给了我错误:
ReferenceError: window is not defined
还有 router.push('/api/auth/signin
) 但这给了我错误:
Error: No router instance found. you should only use "next/router" inside the client side of your app. https://nextjs.org/docs/messages/no-router-instance
import React from "react";
import { useSession, signIn, signOut } from "next-auth/client";
import { useRouter } from 'next/router'
export default function Home() {
const [session, loading] = useSession();
const router = useRouter()
if (session) {
console.log("session = true")
router.push('/blogs')
return (
<>
Signed in as {session.user.name} <br />
<button onClick={() => signOut()}>Sign out</button>
</>
);
}
console.log("session = false")
return (
<>
Not signed in <br />
<button onClick={() => signIn()}>Sign in</button>
</>
);
}
最佳答案
您需要将代码放入 useEffect
中,这样它仅在组件安装时在客户端上执行。另外,您需要等到 loading
变量变为 false
才应该检查 session
变量。
useEffect(()=>{
if(!loading){
if (session) {
console.log("session = true")
router.push('/blogs')
}else{
// maybe go to login page
router.push('/login')
}
}
},[router,session])
此外,请查看 How to protect routes in Next.js next-auth?获取包含登录
和注销
页面的完整解决方案。
关于javascript - 如果未找到 session ,则重定向到登录页面,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/68611945/