营销与文档站仍大量采用手写静态 HTML:首屏快、审计路径清晰,并在搭配正确护栏时能在 CDN 异常时快速定位。在 2026 年,这些护栏指:为每个第三方 <script> 与 <link rel="stylesheet"> 写入 子资源完整性(SRI) 元数据;在需要参与完整性校验的跨域请求上使用显式 crossorigin="anonymous";以及让 Content-Security-Policy 与页面真实加载内容一致。将脚本层硬化与 面向静态营销 HTML 的 CSS @scope 组件隔离 结合,可避免样式回退被误判为供应链事件。
本文覆盖失败形态、数字预期与发布顺序:vendor 包优先 SHA-384 摘要;上游静默补丁时每次发布列车预留 15 分钟 重算哈希;在合规冻结前用日均价约 $16.9 的租用 Mac mini 完整预演响应头栈。
静态站为何仍需要 SRI
即便没有服务端动态逻辑,被攻陷的 CDN 边缘也可能改写结账页 JavaScript 并外传表单数据。SRI 让浏览器拒绝执行与摘要不一致的字节,把静默供应链事件变成控制台可观测的硬错误。没有 SRI 的静态 HTML 等同于信任从 CI 到访客之间路径上的每一个缓存层。
受监管行业常要求可复现证据:把使用的 OpenSSL 命令与输出哈希附在变更单上,便于审计独立重放。
算法选择与摘要计算
对 vendor 脚本优先 sha384:抗碰撞与摘要长度折中较好。务必对 CDN 实际下发的字节求摘要——包含压缩、注释注入与构建横幅。差一个字节即整包失败,因此把摘要生成并入上传对象存储的同一工件步骤。
openssl dgst -sha384 -binary ./dist/vendor.js | openssl base64 -A
将摘要与源 URL 写入纳入版本控制的 YAML 清单;CI 若发现 HTML 引用缺少或陈旧清单项应直接失败。
crossorigin 与 CORS 模式
跨域经典脚本在同时使用 integrity 时,应加 crossorigin="anonymous",让浏览器走可校验完整性的 CORS 模式。若响应缺少 Access-Control-Allow-Origin,省略 crossorigin 会在不同引擎上表现不一。文档化哪些 CDN 路径返回宽松 CORS,并在营销上传新包却未同步两属性时阻断发布。
CDN 缓存键与刷新顺序
轮换 bundle 时按正确顺序刷新:陈旧 HTML 指向已删路径会 404;陈旧 JS 配新 HTML 会触发完整性失败。许多团队用内容哈希文件名——若采用,仍要为书签落地页等需稳定文件名的引导脚本保留 SRI。
CSP:哈希、nonce 与 strict-dynamic
静态站常以 script-src 'sha256-…' 覆盖极小引导脚本,再在构建可发 HTML 后升级到每响应 nonce-。避免长期 'unsafe-inline' 与 nonce 混用失控。若必须支持遗留内联片段,将其隔离到单独路径并加强监控。strict-dynamic 适合链式加载,但要向评审画清信任根。
Safari WebKit 注意点
Safari 网络栈会积极合并请求;调试营销嵌入物时需结合跨站跟踪防护默认策略。WebKit 对完整性失败的提示时机与 Chromium 不同——QA 应录屏而非凭假设签字。务必分别验证 macOS Safari 与 iOS Safari,因 ITP 会影响脚本触碰的存储 API。
| 技术 | 适用 | 运维成本 |
|---|---|---|
| SRI + 稳定 URL | 遗留落地页 | 每次上游补丁需手改哈希 |
| 哈希文件名 | 新式静态流水线 | 需 immutable 缓存策略 |
| CSP nonce | 带 SSR 壳的混合站 | 每响应注入头字段 |
工程负责人决策矩阵
法务要求人类可读资源路径时选稳定 URL + SRI;按次计费的 purge API 成本高时选指纹文件名 + 长缓存。实验性内联引导每小时变化时选 nonce,并确保边缘绝不复用 nonce。
防止漂移的 CI
增加作业:拉取每个第三方 URL、重算摘要并与 HTML 属性比对,夜间运行以便在营业时间前发现 CDN 被篡改或构建回归。
字体、模块与 Worker
通过 @font-face 从 CDN 拉字体时,格式稳定也可加完整性。ES 模块要注意动态 import() 继承 CSP;独立 Worker 有独立策略上下文,勿假设单头覆盖所有线程。
report-uri 与 report-to
先用 Content-Security-Policy-Report-Only 配合日志供应商支持的 report-to。上线窗口常见 0.5%–2% 页面产生报告,注意采样避免淹没分析预算。
回滚策略
在 Git 打标签保留上一版已知良好 HTML 与对应摘要。若供应商静默重补丁,应在 30 分钟内 重算哈希前进;若自家流水线回归,先回滚 HTML 提交再 purge CDN,并在状态页说明完整性失败尖峰时用户会看到空白包而非优雅降级。
安全评审话术
说明 SRI 降低爆炸半径但不能替代 CSP、frame 防护与服务端校验。强调 作用域 CSS 防止营销样式渗入敏感组件。提供 两分钟 Safari 录屏展示摘要不匹配时的拦截行为。
同时保存通过与失败的 HAR,便于审计比对响应头;常见根因是缺少 Access-Control-Allow-Origin 而非字节被篡改。证据建议随工单保留至少 90 天 以满足常见 SOC2 抽样。
通过 MacHTML 租用 Apple Silicon Mac mini 可获得原生 WebKit 行为、贴近生产的字体渲染与企业用户常见的钥匙串默认项。按约 $16.9/天,可在预览主机镜像生产 Content-Security-Policy,在不出借实体机的情况下收集审计材料。
弹性租期也便于设计用 VNC 验收、运维用 SSH 发布脚本协同;在试验更严 script-src 前快照磁盘,若营销像素与新完整性冲突可瞬时回滚。
最后,用同一套 CSP 预演 Cookie 同意与 CMP:许多 CMP 会注入内联引导,常在周五发布撞上假期冻结;提前在预发暴露比生产爆雷更可接受。若团队同时维护多区域域名,请把每个区域的响应头差异写进矩阵,避免亚太边缘节点遗漏 script-src 更新或缓存旧版策略。