Blazor WASM部署Azure静态Web应用时FluentUI反序列化错误求助

问题现象 #

本地开发环境中使用FluentUI的FluentAccordionItem组件完全正常，但部署到Azure静态Web应用后，点击展开按钮瞬间触发反序列化错误，绑定的OnExpanded方法未执行。浏览器控制台报错如下：

Uncaught (in promise) Error: System.InvalidOperationException: There was an error parsing the event arguments. EventId: '30'.
---> System.NotSupportedException: DeserializeNoConstructor, JsonConstructorAttribute, Microsoft.FluentUI.AspNetCore.Components.AccordionChangeEventArgs Path: $ | LineNumber: 0 | BytePositionInLine: 1.
---> System.NotSupportedException: DeserializeNoConstructor, JsonConstructorAttribute, Microsoft.FluentUI.AspNetCore.Components.AccordionChangeEventArgs
Exception_EndOfInnerExceptionStack
at System.Text.Json.ThrowHelper.ThrowNotSupportedException(ReadStack& , Utf8JsonReader& , NotSupportedException )
at System.Text.Json.ThrowHelper.ThrowNotSupportedException_DeserializeNoConstructor(Type , Utf8JsonReader& , ReadStack& )
at System.Text.Json.Serialization.Converters.ObjectDefaultConverter`1[[Microsoft.FluentUI.AspNetCore.Components.AccordionChangeEventArgs, Microsoft.FluentUI.AspNetCore.Components, Version=4.7.1.24114, Culture=neutral, PublicKeyToken=null]].OnTryRead(Utf8JsonReader& , Type , JsonSerializerOptions , ReadStack& , AccordionChangeEventArgs& )

核心原因 #

Azure静态Web应用的生产构建默认启用了Blazor WASM的Linker（代码裁剪），该工具会移除未被显式引用的类型或构造函数。AccordionChangeEventArgs的无参构造函数被裁剪后，System.Text.Json无法完成反序列化操作，导致报错。本地开发环境默认关闭Linker，因此无此问题。

解决方案与规避方法 #

1. 配置Linker保留目标类型 #

创建或修改项目根目录下的BlazorWebAssemblyLinker.xml文件，添加规则保留AccordionChangeEventArgs类型：

<linker>
  <assembly fullname="Microsoft.FluentUI.AspNetCore.Components">
    <type fullname="Microsoft.FluentUI.AspNetCore.Components.AccordionChangeEventArgs" preserve="all" />
    <!-- 若后续出现其他FluentUI组件的类似问题，可直接保留整个命名空间 -->
    <!-- <namespace fullname="Microsoft.FluentUI.AspNetCore.Components" preserve="all" /> -->
  </assembly>
</linker>

2. 修改事件参数类型规避反序列化 #

ExpandedChanged事件本质仅需获取展开状态的布尔值，可直接将参数类型从AccordionChangeEventArgs改为bool：
修改组件代码：

<div class="container">
    <FluentAccordionItem ExpandedChanged="OnExpanded">
        <HeadingTemplate>
        </HeadingTemplate>
        <ChildContent>
        </ChildContent>
    </FluentAccordionItem>
</div>

对应的处理方法调整为：

private void OnExpanded(bool isExpanded)
{
    if (isExpanded)
    {
        // 原调用服务获取章节的逻辑
    }
}

3. 升级FluentUI版本 #

部分新版本的FluentUI针对Linker场景做了优化，比如为事件参数类添加JsonConstructor特性或确保无参构造函数不被裁剪。确认并升级到最新稳定版，可尝试解决该兼容性问题。

4. 临时禁用生产环境Linker（不推荐） #

若需快速验证问题，可在项目的.csproj文件中禁用生产构建的Linker，但会导致应用体积增大：

<PropertyGroup Condition="'$(Configuration)' == 'Release'">
  <BlazorWebAssemblyEnableLinking>false</BlazorWebAssemblyEnableLinking>
</PropertyGroup>

验证步骤 #

修改完成后重新构建并部署到Azure静态Web应用，测试点击FluentAccordionItem的展开按钮，确认控制台无报错且OnExpanded方法正常执行。

内容的提问来源于stack exchange，提问作者Vũ Hoàng