es6导入的子资源完整性

Question

<script>接受integrity属性,所以我可以安全地加载模块:

<script type="module"
  src="https://example.com/module.mjs"
  integrity="sha256-2Kok7MbOyxpgUVvAk/HJ2jigOSYS2auK4Pfzbm7uH60="
  crossorigin="anonymous"
></script>

但是在脚本中加载模块时如何保持安全？

• 进口:

import foo from "https://example.com/module.mjs"

• 动态导入:

import("https://example.com/module.mjs").then(console.log)

• 甚至网络工作者:

const myWorker = new Worker('worker.js')

Answer 1

请看这个问题

是否可以在 ES6 模块导入中使用子资源完整性？

您可以使用 RequireJS，并将代码转换为 AMD 或 UMD 来实现此目的。RequireJS 有一个 onNodeCreated 钩子，它使您可以在将脚本标记添加到文档之前访问它。您可以将 sri 属性添加到 script 标签中：

onNodeCreated: function(node, config, module, path) { node.setAttribute('integrity', integrityForModule); node.setAttribute('crossorigin', 'anonymous'); }

信用： https: //stackoverflow.com/a/37065379

我使用 Webpack（目标为 UMD）和 RequireJS。将相关模块放在 webpack 配置文件的外部部分，因此这些模块不会编译到转译代码中。