如何在ASP.net Core MVC Razor视图展示Web API返回的验证信息？

一、先修正API的响应逻辑（关键前提） #

你之前的API返回JsonResult时默认状态码是200，这会让HttpClient误判为“成功请求”，导致错误信息无法被正确捕获。需要改成对应错误状态码+结构化响应模型，既符合REST规范，也方便MVC端解析：

1. 定义统一的错误响应模型（API和MVC项目可共用，比如放到解决方案的共享类库，或者两边各复制一份）：

public class ErrorResponse
{
    public List<string> Errors { get; set; } = new List<string>();
}

2. 修改API的验证逻辑，返回BadRequestObjectResult（状态码400）：

var errorResponse = new ErrorResponse();

// 邮箱验证
bool emailExists = dbContext.Users.Any(u => u.Email == user.Email);
if (emailExists)
{
    errorResponse.Errors.Add("Email Address already taken!, Try a different Email");
}

// 用户名验证（示例多字段场景）
bool usernameExists = dbContext.Users.Any(u => u.Username == user.Username);
if (usernameExists)
{
    errorResponse.Errors.Add("Username already taken!");
}

// 电话号码验证
bool phoneExists = dbContext.Users.Any(u => u.PhoneNumber == user.PhoneNumber);
if (phoneExists)
{
    errorResponse.Errors.Add("Phone number already registered!");
}

// 存在错误则返回BadRequest
if (errorResponse.Errors.Any())
{
    return BadRequest(errorResponse);
}

// 无错误则继续执行注册逻辑
return Ok();

二、MVC端处理API响应并传递信息到视图 #

修改MVC中HttpClient调用的代码，捕获错误响应并将信息存入TempData（适合跨请求传递数据，比如页面跳转后显示）：

using (var client = new HttpClient())
{
    client.BaseAddress = new Uri(_baseAPIUrl);
    client.DefaultRequestHeaders.Accept.Add(new MediaTypeWithQualityHeaderValue("application/json"));
    
    HttpResponseMessage res = await client.PostAsJsonAsync("Users", user);

    if (res.IsSuccessStatusCode)
    {
        // 注册成功，跳转到首页/登录页
        return RedirectToAction("Index", "Home");
    }
    else
    {
        // 处理BadRequest（验证错误）
        if (res.StatusCode == HttpStatusCode.BadRequest)
        {
            var errorData = await res.Content.ReadFromJsonAsync<ErrorResponse>();
            TempData["ErrorMessages"] = errorData.Errors;
        }
        else
        {
            // 处理其他错误（如服务器内部错误）
            TempData["ErrorMessages"] = new List<string> { "An unexpected error occurred. Please try again later." };
        }
        // 返回注册页面，准备显示错误
        return View("Register");
    }
}

三、在Razor视图中渲染错误信息 #

在你的注册视图（比如Register.cshtml）中添加以下代码，读取TempData中的错误并展示：

@* 显示API返回的验证错误 *@
@if (TempData["ErrorMessages"] is List<string> errors && errors.Any())
{
    <div class="alert alert-danger">
        <strong>Validation Errors:</strong>
        <ul>
            @foreach (var error in errors)
            {
                <li>@error</li>
            }
        </ul>
    </div>
}

@* 下面是你的注册表单代码 *@
<form asp-action="Register" method="post">
    <!-- 表单字段 -->
</form>

为什么之前的尝试没生效？ #

1. 最初的API返回200状态码，导致MVC端进入IsSuccessStatusCode分支，但你没读取响应内容，自然拿不到错误信息；
2. 后来改成BadRequest，但可能没有正确解析API返回的JSON内容，或者没将解析后的信息存入TempData传递到视图；
3. 结构化的错误模型比纯字符串更适合多字段验证场景，能一次性返回所有错误。

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