为Google Fonts样式表添加SHA-512完整性及配置CSP遇错求助

问题根源 #

Google Fonts返回的CSS是动态生成的——它会根据请求的用户代理、地区、浏览器支持情况等返回不同内容，你预计算的静态SHA-512哈希不可能匹配每次请求的实际响应，这就是控制台报错的直接原因。

可行解决方案 #

1. 直接允许Google Fonts域名（标准做法） #

修改web.config中的CSP配置，在style-src和font-src中加入Google Fonts的可信域名：

<add name="Content-Security-Policy"
     value="default-src 'self'; 
            style-src 'self' fonts.googleapis.com;
            font-src 'self' fonts.gstatic.com;
            "/>

• fonts.googleapis.com是样式表的来源域名
• fonts.gstatic.com是字体文件的CDN域名，必须同时允许才能正常加载字体

同时移除<link>标签中的integrity属性（因为它在这里完全无效），修改后的.aspx代码：

<link href="https://fonts.googleapis.com/css?family=Open+Sans" rel="stylesheet">
<link href="https://fonts.googleapis.com/css?family=Roboto" rel="stylesheet">

2. 本地托管字体（最高安全性） #

如果需要完全控制资源、避免依赖外部CDN，可以：

• 下载Open Sans和Roboto的字体文件（优先选择woff2格式）
• 编写本地CSS文件来引用这些字体资源
• 在CSP中仅允许'self'，或者为本地CSS文件计算哈希并加入style-src

这种方式彻底消除了外部依赖，同时可以用哈希验证本地资源的完整性。

关键提醒 #

• Google Fonts的动态响应特性是设计初衷，静态哈希方案天生不兼容这类动态资源
• 允许可信CDN域名是前端安全领域的通用做法，Google Fonts的域名属于行业认可的可信源
• 遗漏fonts.gstatic.com会导致字体文件加载失败，一定要同时配置

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