Next-auth 检查用户是否首次登录

Question

如何检查用户是否是第一次使用 Next-Auth 登录？

我尝试按照官方文档实现 newUser 页面，但它似乎并没有真正起作用。这是我在 [...nextauth].js 文件中的页面配置：

pages: {
    signIn: "/auth/login",
    newUser: "/auth/new-user",
  },

我还尝试检查 jwt 回调上的 isNewUser 参数，但我只是获取了登录用户的数据，但没有用处：

 callbacks: {
    jwt: async (token, user, account, isNewUser) => {
   
    console.log(isNewUser)
    \\There is no relevant info using this
 }
}

当用户创建帐户（家庭住址、出生日期等）时，我的应用程序需要更多信息，而使用 SSO 并不总是提供这些信息。我需要检查用户是否第一次登录，以便我可以将他们重定向到表单以填写缺少的信息。

Answer 1

实现此目的的一个简单方法是使用 cookies-next 库，您可以在此处找到该库。查看链接，因为它们有非常简单且有用的解释。

无论如何，出于您的目的，您可以通过设置/检索存储有此信息的 cookie 来检查用户是否是首次登录。您可以在您想要的任何页面/组件中设置和检索 cookie，但听起来在您的情况下，您可能希望在仪表板页面或组件中执行此操作。

假设用户使用 next/auth 登录，登录后将被路由到仪表板页面。您可以使用 cookies-next 库来检查用户是否第一次访问该仪表板页面。

import { setCookies } from "cookies-next";
 
export default function Dashboard({ pageVisited }) {
  // This is how the cookie would be set when the user accesses the dashboard page for the first time
  useEffect(() => {
    if (!pageVisited) {
      setCookies("pageVisited", true);
    }
  }, []);

  // You can do some conditional logic if it's the user's first time signing in
  if (!pageVisited) {
    // return something
  }
}

export const getServerSideProps = async (ctx) => {
  const { pageVisited } = ctx.req.cookies;

  return { props: { pageVisited: pageVisited ?? null } };
};

如果您需要从另一个组件检索 cookie 以根据用户是否是首次访问者执行某些逻辑，您可以遵循与上面相同的模式：

export default function AnotherComponent({ pageVisited }){
  if (pageVisited) {
    // return something
  }
}

export const getServerSideProps = async (ctx) => {
  const { pageVisited } = ctx.req.cookies;

  return { props: { pageVisited: pageVisited ?? null } };
};

注意：用户可以手动删除 cookie，在这种情况下，即使他们之前已登录，您的应用程序也会将其作为首次读取。