ASP.NET Core登录接口400错误未触发AJAX错误回调求助

问题本质 #

当后端返回400（BadRequest）这类HTTP错误状态码时，jQuery的$.ajax会直接触发.fail()回调，而非.done()，所以你原本写在.done()里处理data.success=false的逻辑永远不会执行。另外后端代码存在未定义变量的问题，会导致登录成功路径抛出异常。

修复方案 #

1. 后端代码修复 #

• 补全未定义的member变量（从数据库关联查询对应会员数据）
• 保留BadRequest返回逻辑，确保错误信息格式统一

[HttpPost("Login")]
public async Task<IActionResult> Login([FromBody] SigninViewModel formData)
{
    var memberCredential = await db.MemberCredential.FirstOrDefaultAsync(t => t.MemberAccount.Equals(formData.memberAccount));
    
    if (memberCredential == null)
    {
        return BadRequest(new { success = false, message = "無此帳號，請重新輸入。" });
    }
    
    bool isPwdMatch = BCrypt.Net.BCrypt.Verify(formData.memberPassword, memberCredential.MemberPassword);
    Console.WriteLine("驗證結果：" + isPwdMatch);

    if (!isPwdMatch)
    {
        return BadRequest(new { success = false, message = "帳號或密碼錯誤，請重新輸入。" });
    }
    
    // 修复：从数据库获取关联的会员实体（需根据你的表关联逻辑调整）
    var member = await db.Member.FirstOrDefaultAsync(t => t.MemberId == memberCredential.MemberId);
    if (member == null)
    {
        return BadRequest(new { success = false, message = "帳號資訊異常，請聯繫管理員。" });
    }
       
    var loginData = new
    {
        MemberId = member.MemberId,
        MemberName = member.MemberName,
        MemberPoint = member.MemberPoint
    };
    string json = JsonSerializer.Serialize(loginData);
    Console.WriteLine(json);
    HttpContext.Session.SetString(CDictionary.SK_LOINGED_USER, json);
    
    return Ok(new { success = true, message = "登入成功" });
}

2. 前端AJAX代码修复 #

• 在.fail()回调中解析后端返回的JSON错误信息，展示友好提示给用户
• 简化成功分支的逻辑

document.getElementById("Login").addEventListener("submit", function (event) {
    event.preventDefault();

    let memberAccount = document.getElementById("MemberAccount").value;
    let memberPassword = document.getElementById("MemberPassword").value;

    const formData = {
        memberAccount: memberAccount,
        memberPassword: memberPassword
    };

    $.ajax({
        type: "POST",
        url: "/api/Members/Login",
        data: JSON.stringify(formData),
        contentType: "application/json"
    }).done(data => {
        if (data.success) {
            alert("Login Success!");
            window.location.href = "https://localhost:1111/Home/Index";
        }
    }).fail((jqXHR, textStatus, errorThrown) => {
        // 解析后端返回的错误信息
        const errorData = jqXHR.responseJSON;
        alert(errorData?.message || "登入失敗，請稍後再試。");
        console.error("AJAX error:", textStatus, errorThrown);
    });
});

3. 视图模型代码（无需修改） #

public class SigninViewModel
{
    public string memberAccount { get; set; }
    public string memberPassword { get; set; }
}

修复说明 #

• 后端：解决了member变量未定义的问题，避免登录成功时抛出异常；保留BadRequest返回HTTP错误状态，符合REST接口规范
• 前端：针对HTTP错误状态在fail回调中处理，解析后端返回的JSON错误信息，将友好提示展示给用户

内容的提问来源于stack exchange，提问作者Ellie