"微前端安全与版本治理细则：SRI、CSP、依赖单例与发布签名校验"

微前端安全与版本治理细则概述微前端的远程模块加载与多团队协作带来安全与版本冲突隐患。本文给出 SRI、CSP、Trusted Types、单例依赖与发布签名等细则，形成可操作的治理方案。SRI 与远程模块校验<!-- 远程入口 remoteEntry.js 的 SRI 校验 --> <script src="https://cdn.example.com/app/remoteEntry.js" integrity="sha256-<HASH>" crossorigin="anonymous"></script> // 构建时生成哈希与清单 import { createHash } from 'crypto' import fs from 'fs' const buf = fs.readFileSync('dist/remoteEntry.js') const hash = createHash('sha256').update(buf).digest('base64') fs.writeFileSync('dist/sri.json', JSON.stringify({ remoteEntry: `sha256-${hash}` })) CSP 与 Trusted Types<!-- 壳应用 CSP --> <meta http-equiv="Content-Security-Policy" content="default-src 'self'; script-src 'self' https://cdn.example.com 'strict-dynamic' 'nonce-__NONCE__'; object-src 'none'; base-uri 'self'; require-trusted-types-for 'script'; trusted-types app-policy;"> // Trusted Types 初始化 // eslint-disable-next-line no-undef window.trustedTypes?.createPolicy('app-policy', { createScriptURL: (url) => url.startsWith('https://cdn.example.com/') ? url : '' }) 依赖单例与严格版本// Module Federation 单例共享 new ModuleFederationPlugin({ shared: { react: { singleton: true, requiredVersion: '^19.0.0' }, 'react-dom': { singleton: true, requiredVersion: '^19.0.0' } } }) 发布签名与来源验证# 生成签名（示例） openssl dgst -sha256 -sign private.pem -out remote.sig dist/remoteEntry.js openssl dgst -sha256 -verify public.pem -signature remote.sig dist/remoteEntry.js 版本治理流程远程模块清单：名称/版本/哈希/SRI/依赖树回滚策略：灰度+缓存键带版本，紧急回退到上一个已签名版本技术参数与验证浏览器：Chrome 120+；CSP 报告上报（Report-To）启用篡改检测：SRI 触发率 0；CSP 违规则报警；依赖冲突率 < 1%应用场景多团队协作的门户与平台强安全合规要求的企业级应用注意事项SRI 与 `strict-dynamic` 配合，避免非签名脚本加载统一签名与哈希生成流程；清单同步到壳应用与 CDN常见问题Q: SRI 与 Module Federation 如何协同？A: 对 `remoteEntry.js` 与其资源启用 SRI；远程模块地址通过 Trusted Types 白名单控制。参考资料CSP 与 Trusted Types 文档Module Federation 文档SRI 规范---发布信息：已发布 · 技术验证 · 阅读 40 分钟 · CC BY-SA 4.0