如何将API返回的JSON转换为C#对象并在MVC视图中展示？

你已经搞定了API请求的大部分环节，就差把返回的JSON转成你的Assignment模型这一步啦！我来帮你补全代码，顺便说下视图怎么展示数据：

第一步：确保Assignment模型与API返回的JSON结构匹配 #

这是前提哦！如果API返回的是作业列表（比如GetAll接口），那你的模型要和JSON里的字段对应上。举个例子：

假设API返回的JSON是这样的：

[
  {
    "Id": 1,
    "Title": "完成API文档",
    "DueDate": "2024-06-30T00:00:00"
  },
  {
    "Id": 2,
    "Title": "修复前端bug",
    "DueDate": "2024-07-05T00:00:00"
  }
]

那你的C#模型应该写成这样：

public class Assignment
{
    public int Id { get; set; }
    public string Title { get; set; }
    public DateTime DueDate { get; set; }
}

如果JSON里的字段名和C#属性名不一样（比如JSON里是assignment_title，C#里是Title），可以用特性映射：

• 用.NET内置的System.Text.Json的话，加[JsonPropertyName("assignment_title")]
• 用Newtonsoft.Json的话，加[JsonProperty("assignment_title")]

第二步：把API响应的JSON反序列化为Assignment模型 #

下面分两种常用的序列化方式给你修改代码：

方式一：使用.NET内置的System.Text.Json #

这是.NET Core及以后版本的默认选择，不需要额外装包。修改你的Index方法：

using System.Text.Json; // 记得加这个命名空间

[HttpGet]
public async Task<ViewResult> Index()
{
    if (!ModelState.IsValid)
    {
        return View("Error");
    }

    HttpRequestMessage apiRequest = CreateRequestToService(HttpMethod.Get, "api/Assignment/GetAll");
    HttpResponseMessage apiResponse;

    try
    {
        apiResponse = await HttpClient.SendAsync(apiRequest);
    }
    catch
    {
        return View("Error");
    }

    if (!apiResponse.IsSuccessStatusCode)
    {
        return View("Error");
    }

    // 重点：await异步读取响应内容，因为ReadAsStringAsync是Task<string>
    var jsonContent = await apiResponse.Content.ReadAsStringAsync();
    // 因为是GetAll接口，反序列化为List<Assignment>；如果是单个作业就用Assignment
    var assignments = JsonSerializer.Deserialize<List<Assignment>>(jsonContent);

    // 加个空判断，避免视图拿到null报错
    assignments ??= new List<Assignment>();

    return View(assignments);
}

方式二：使用Newtonsoft.Json（如果你项目里已经在用） #

如果你的项目依赖Newtonsoft.Json，先确保已经安装了对应的NuGet包，然后修改反序列化部分：

using Newtonsoft.Json; // 记得加这个命名空间

// ... 前面的代码和上面一样 ...

var jsonContent = await apiResponse.Content.ReadAsStringAsync();
var assignments = JsonConvert.DeserializeObject<List<Assignment>>(jsonContent);

assignments ??= new List<Assignment>();
return View(assignments);

第三步：在MVC视图中展示数据 #

创建一个强类型的Index.cshtml视图，指定模型为List<Assignment>，然后循环展示数据：

@model List<Assignment>

<h1>作业列表</h1>

@if (Model.Any())
{
    <table class="table table-striped">
        <thead>
            <tr>
                <th>ID</th>
                <th>作业标题</th>
                <th>截止日期</th>
            </tr>
        </thead>
        <tbody>
            @foreach (var assignment in Model)
            {
                <tr>
                    <td>@assignment.Id</td>
                    <td>@assignment.Title</td>
                    <td>@assignment.DueDate.ToString("yyyy-MM-dd")</td>
                </tr>
            }
        </tbody>
    </table>
}
else
{
    <div class="alert alert-info">暂无作业数据</div>
}

内容的提问来源于stack exchange，提问作者Curious-programmer