如何在Razor页面级别覆盖/修改CSP以支持邮件编辑器的内联样式？

当然可以在页面级别调整CSP规则，以下是几种实用的实现方式：

1. 页面方法中直接修改响应头 #

在目标Razor页面的OnGet/OnPost方法里，读取全局CSP配置并修改，添加允许内联样式的规则（优先用安全的nonce或哈希，而非unsafe-inline）：

public IActionResult OnGet()
{
    // 生成唯一nonce值，用于验证内联样式
    var nonce = Guid.NewGuid().ToString("N");
    ViewData["CspNonce"] = nonce;

    // 获取全局CSP规则，追加style-src的nonce授权
    var globalCsp = Response.Headers["Content-Security-Policy"].ToString();
    Response.Headers["Content-Security-Policy"] = $"{globalCsp}; style-src 'self' 'nonce-{nonce}'";

    return Page();
}

然后在页面的内联样式标签中携带该nonce：

<style nonce="@ViewData["CspNonce"]">
    /* 邮件编辑器所需的内联样式 */
</style>

2. 通过中间件按路径匹配设置规则 #

如果不想在页面代码里修改，可以在Startup的中间件中，根据请求路径判断是否为邮件编辑器页面，单独设置CSP：

app.Use(async (context, next) =>
{
    // 匹配邮件编辑器页面的路径
    if (context.Request.Path.StartsWithSegments("/MailEditor"))
    {
        var nonce = Guid.NewGuid().ToString("N");
        context.Items["CspNonce"] = nonce;
        // 直接设置该页面的CSP规则，可覆盖全局配置
        context.Response.Headers["Content-Security-Policy"] = 
            "default-src 'self'; style-src 'self' 'nonce-" + nonce + "';";
    }
    await next();
});

关键注意事项 #

• 尽量不要用'unsafe-inline'，它会大幅降低CSP的安全防护能力，优先选择nonce随机数或样式哈希值的方式授权内联样式。
• 若全局CSP开启了report-only模式，可以先在该模式下测试规则，不会直接阻止页面加载，方便调试验证。

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