成功登录后重定向或注册在下一个身份验证中输入凭据

Question

是否有任何示例和/或方法可以在成功登录或注册输入凭据时重定向到私人仪表板next-auth？我找不到任何关于此的明确文档。我正在考虑在下面添加重定向，但不确定这是否是正确的方法：callbacks.signIn = async (data, account, profile) => {  if ((account.provider === 'google' && profile.verified_email === true) || (account.type === 'credentials' && data.status === 200)) {    return Promise.resolve(true)  } else {    return Promise.resolve(false)  }}

Answer 1

这实际上可能在启动登录时发生。从文档中，您可以将回调 URL 传递给登录。您的代码将如下所示。

signIn(provider.id, {
      callbackUrl: `${window.location.origin}/protected`,
    })

Answer 2

使用新版本的 Next.js，您可以对“getStaticProps”方法进行重定向，如下所示，

export async function getStaticProps(context) {

  // some imperative work..

  //

  if (!user) {

    return {

      redirect: {

        destination: '/', // some destination '/dashboard' Ex,

        permanent: false,

      },

    }

  }

  return {

    props: {},

  }

}

Answer 3

它对我来说是这样的

"use client";

import Link from "next/link";

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

import { useState } from "react";

import { toast } from "react-toastify";

const Login = () => {

  const [email, setEmail] = useState("");

  const [password, setPassword] = useState("");

  // handle submit event

  const handleSubmit = async (e) => {

    e.preventDefault();

    try {

      const isLoggedin = await signIn(

        "credentials",

        {

          email,

          password,

        },

        { callbackUrl: "/dashboard/profile" }

      );

      if (isLoggedin.error !== null) {

        toast.error("Incorrect Login Details!!");

      } else {

        toast.success("Login Successful!!");

        // router.replace("/dashboard/profile");

      }

    } catch (error) {

      toast.success(error);

    }

  };

  return (

    <div

      style={{ maxWidth: "480px" }}

      className="mt-10 mb-20 p-4 md:p-7 mx-auto rounded bg-white shadow-lg"

    >

      <form onSubmit={handleSubmit}>

        <h2 className="mb-5 text-2xl font-semibold">Login</h2>

        <div className="mb-4">

          <label className="block mb-1"> Email </label>

          <input

            className="appearance-none border border-gray-200 bg-gray-100 rounded-md py-2 px-3 hover:border-gray-400 focus:outline-none focus:border-gray-400 w-full"

            type="text"

            placeholder="Type your email"

            required

            onChange={(e) => setEmail(e.target.value)}

          />

        </div>

        <div className="mb-4">

          <label className="block mb-1"> Password </label>

          <input

            className="appearance-none border border-gray-200 bg-gray-100 rounded-md py-2 px-3 hover:border-gray-400 focus:outline-none focus:border-gray-400 w-full"

            type="password"

            placeholder="Type your password"

            minLength={6}

            required

            onChange={(e) => setPassword(e.target.value)}

          />

        </div>

        <button

          type="submit"

          className="my-2 px-4 py-2 text-center w-full inline-block text-white bg-blue-600 border border-transparent rounded-md hover:bg-blue-700"

        >

          Login

        </button> 

      </form>

    </div>

  );

};

export default Login;