ASP.NET Core Razor组件循环引用序列化异常求助

问题根源 #

使用RenderMode.ServerPrerendered渲染Razor组件时，组件参数会被序列化到页面的脚本块中，供客户端初始化Blazor应用时反序列化。你的User和Address实体互相包含导航属性，形成循环引用，导致JSON序列化失败。修改全局JsonSerializerOptions无效，是因为Blazor Server有独立的组件参数序列化配置，而非复用Mvc的全局配置。

解决方案 #

1. 使用DTO（数据传输对象）【推荐】 #

创建仅包含组件所需展示字段的DTO，剥离循环引用的导航属性，从根源避免序列化问题：

// 定义DTO，只保留列表展示需要的字段
public class UserListItemDto
{
    public int Id { get; set; }
    public string UserName { get; set; }
    // 仅保留地址的简单属性，不包含Users导航集合
    public string AddressDetail { get; set; }
}

// 在控制器/视图中转换实体为DTO
var userListDtos = Model.Users.Select(u => new UserListItemDto
{
    Id = u.Id,
    UserName = u.UserName,
    AddressDetail = $"{u.Address.Street}, {u.Address.City}"
}).ToList();

// 渲染组件时传入DTO列表
@(await Html.RenderComponentAsync<UsersListComponent>(RenderMode.ServerPrerendered, new { Users = userListDtos }))

2. 配置Blazor Server专属的序列化选项 #

在Program.cs中配置Blazor组件参数的序列化规则，启用循环引用支持：

builder.Services.AddServerSideBlazor()
    .AddJsonOptions(options =>
    {
        options.JsonSerializerOptions.ReferenceHandler = ReferenceHandler.Preserve;
        // 可选：加大深度限制，默认64
        options.JsonSerializerOptions.MaxDepth = 128;
    });

3. 标记忽略序列化的导航属性 #

如果不需要在组件中使用某一方的导航属性，可直接用[JsonIgnore]标记，避免循环：

public class User {
    // 序列化User时忽略Address属性，切断循环
    [JsonIgnore]
    public Address Address { get; set; }
}

注意：该方法会影响所有需要序列化该实体的场景，需谨慎使用。

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