在自定义登录页面上引发错误时下一个身份验证“凭据”重定向

Posted

技术标签:

【中文标题】在自定义登录页面上引发错误时下一个身份验证“凭据”重定向【英文标题】:Next Auth "Credentials" redirection when throwing error on custom login page 【发布时间】:2021-06-08 00:08:57 【问题描述】:

我有一个自定义登录页面,它在提交表单时又调用signIn() 函数。 我只使用 "Credentials" 提供程序。

服务器端,我只是想抛出一个错误,以便我可以在前端处理它。似乎很容易。

我继续收到一条错误消息:Error: HTTP GET is not supported for /api/auth/login?callbackUrl=http://localhost:4000/login

我被重定向到的网址是:http://localhost:4000/api/auth/login?callbackUrl=http://localhost:4000/login

这是我的代码: pages/login.js(仅相关代码。其余只是布局。)

<form
    method="post"
    onSubmit=() =>
        signIn("credentials", 
            email: "test",
            password: "test",
        )
    
>
    <label>
        Username
        <input type="email" />
    </label>
    <label>
        Password
        <input name="password" type="password" />
    </label>
    <button type="submit">Sign In</button>
</form>

pages/api/auth/[...nextauth.js]

import NextAuth from "next-auth";
import Providers from "next-auth/providers";

const options = 
    site: process.env.NEXTAUTH_URL,
    providers: [
        Providers.Credentials(
            id: "chatter",
            name: "Credentials",
            type: "credentials",
            credentials: 
                email:  label: "Email", type: "email", placeholder: "email@domain.com" ,
                password:  label: "Password", type: "password" ,
            ,
            authorize: async credentials => 
                console.log("credentials:", credentials);
                throw new Error("error message"); // Redirect to error page
            ,
        ),
    ],
    pages: 
        signIn: "login",
        newUser: null,
    ,
;

export default (req, res) => NextAuth(req, res, options);

【问题讨论】:

【参考方案1】:

你可以这样使用:

signIn("credentials", 
     redirect: false, 
     email: "test",
     password: "test",
   )
   .then((error) => console.log(error))
   .catch((error) => console.log(error));

【讨论】:

【参考方案2】:

你检查过 pages/api/auth 中的 [...nextauth].js 吗?

我有同样的问题,但我可以修复 [...nextauth].js 将 'pages/api' 移动到 'pages/api/auth'。

【讨论】:

以上是关于在自定义登录页面上引发错误时下一个身份验证“凭据”重定向的主要内容,如果未能解决你的问题,请参考以下文章

无效的凭据引发身份验证突变异常

请求的资源地址在自定义登录页面上可见

为啥在自定义身份验证和登录模块中使用克隆?

要获取无效的凭证,甚至凭证都以Django登录格式在数据库中注册?

nginx_ldap_auth和自定义身份验证页面

身份验证重定向失败