登录 NEXT-AUTH 后重定向到自定义 URL

Posted 2023-02-21

【中文标题】登录 NEXT-AUTH 后重定向到自定义 URL

【英文标题】：Redirect to a custom URL after login in NEXT-AUTH

【发布时间】：2021-05-20 17:54:53

【问题描述】：

使用 next-auth 登录后如何重定向到自定义 URL？

我有一个用于登录和内容的页面。逻辑是这样的：

如果用户登录 -> 显示页面内容 如果用户未登录 -> 在同一页面上显示登录表单。

登录后，用户应该被重定向到他登录的同一页面，而不是他之前来自的页面

【参考方案1】：

您需要使用重定向路径作为参数调用SignIn 和SignOut 函数，如下所示：

import  signIn, signOut  from "next-auth/react";

signIn( callbackUrl: "/app" )

signOut( callbackUrl: "/login" );

【参考方案2】：

在您的页面中使用会话：

import  signIn, signOut, useSession  from 'next-auth/client'
    ...
const [session, loading] = useSession();
    
    ...
<>
    !session ? (
       <p> you are not logged in ! </p>
    ) : (
       <p> welcome to this page, you are logged in! </p>
    )
</>

【讨论】：

条件是解决方案的一部分。但可能有助于编辑条件以实际重定向到另一个页面（如问题作者所问）而不是简单地输出一些文本。

谢谢@Luke，每两种方式都是可能的。

【参考方案3】：

您可能会发现有用的东西。我用它在页面之间自动重定向。

import  useHistory  from 'react-router-dom'

function foo() 
    const history = useHistory()
    
    // usage:
    history.push('url_to_redirect_to')
    // example: history.push('/') or history.push('/about')

【讨论】：

谢谢，但我认为这不适用于 next-auth。我们需要服务器端渲染

这里也使用react-router-dom，不推荐使用，因为Next.js提供了own router。