.NET Blazor Server端如何提交含HTML标签的输入框与文本域？

问题原因 #

ASP.NET Core默认启用请求验证，会拦截包含HTML标签的输入（防止XSS攻击），导致绑定到BlogPost.Body的内容被清空。

解决方案 #

1. 给模型属性添加允许HTML的特性 #

在BlogPost模型的Body属性上添加[AllowHtml]特性，明确告诉框架允许该字段接收HTML内容：

using Microsoft.AspNetCore.Mvc;

public class BlogPost
{
    // 其他属性...
    [AllowHtml]
    public string? Body { get; set; }
}

2. 全局配置请求验证（按需使用） #

如果需要全局范围内允许HTML输入，可在Program.cs中修改请求验证规则：

builder.Services.AddControllersWithViews(options =>
{
    // 仅针对POST请求关闭输入验证，按需调整
    options.SuppressInputValidationForHttpMethod = HttpMethod.Post;
});

注意：全局关闭验证会提升XSS攻击风险，优先推荐针对单个属性配置的方案。

3. 安全防护提醒 #

允许HTML输入后，必须警惕XSS攻击：

• 显示HTML内容时，使用MarkupString渲染（仅针对可信内容）：

  @((MarkupString)BlogPost.Body)
  

• 对用户输入的HTML进行清洗，过滤<script>等危险标签，可借助第三方库（如HtmlSanitizer）处理后再存入数据库。

额外优化：替换输入控件 #

如果输入的是多行HTML内容，建议把<input type="text">换成<textarea>，更适配长文本场景：

<textarea id="quill-result-body" class="form-control" required @bind="BlogPost!.Body"></textarea>

内容的提问来源于stack exchange，提问作者Matías Alejandro Novillo