Chrome扩展中Wasm模块编译错误

Question

在我的扩展中，我想使用自己的WebAssembly模块。

加载我的模块（到background.html或popup.html）后，我捕获了编译错误：

CompileError：WebAssembly.compile（）：嵌入程序禁止Wasm代码生成。

Chrome扩展不支持wasm模块吗？

- Joe Hill

Answer 1

似乎从此问题来看，Chrome需要启用script-src: 'unsafe-eval'的CSP指令才能进行WebAssembly编译。请参见此讨论，了解当前情况下为什么会这样。

Chrome扩展程序带有默认的CSP限制；其中包括不允许使用unsafe-eval。某些限制无法取消，但在这种情况下，您可以通过添加清单密钥来允许使用unsafe-eval：

"content_security_policy": "script-src 'self' 'unsafe-eval'; object-src 'self'"

这应该足以测试Wasm是否在扩展中工作。但是要注意文档中的警告：

然而，我们强烈建议不要这样做。这些函数是臭名昭著的XSS攻击向量。

与其允许整个扩展使用unsafe-eval，你可以使用文档中的以下方法来沙盒化需要使用它的代码：

在Chrome扩展中使用eval。安全地。

其核心思想是在扩展中创建一个单独的页面，在该页面中允许unsafe-eval但禁用Chrome API访问；然后将此页面嵌入到扩展中，并使用postMessage()进行通信。

- Xan

---

Chrome为解决这个问题，专门为扩展实现了特殊策略'wasm-eval'。 - MadRunner

@MadRunner 请将其作为第二个答案添加（并附上一些解释），我很乐意点赞。 - Xan

这个有 manifest v3 的等效版本吗？ - f4z3k4s

@f4z3k4s 请查看 https://bugs.chromium.org/p/chromium/issues/detail?id=1173354 - Xan

'wasm-unsafe-eval' 可以与 Manifest V3 一起使用。 - Alexander Zinchuk

Answer 2

Chrome为了解决这个问题实现了专门的策略“wasm-eval”，仅适用于应用程序和扩展。它是Chrome特有的，但正在逐渐转移到CSP和WebAssembly标准中。只需在@Xan的解决方案中用'wasm-eval'替换'unsafe-eval'即可。

请注意，这仍然是一种攻击向量，您有责任验证执行汇编的来源。例如，请参阅uBlock作者对此策略的看法。

- MadRunner

---

谢谢，这对我很有帮助（ASP.NET Blazor客户端）。 - Luke Vo

Answer 3

我尝试了其他答案中提供的“unsafe-eval”和“wasm-eval”，但都没有解决问题。结果发现这是特定于网站的。如果我在Github上尝试，它不起作用。但是在reddit.com上可以。以下是我在Chrome开发者模式中看到的错误。这是使用Blazor NET6和AOT制作的Chrome扩展程序。希望有人会觉得这很有用。

CompileError: WebAssembly.instantiate(): Wasm code generation disallowed by embedder
window.Module.s.printErr @ blazor.webassembly.js:1
(anonymous) @ blazor.webassembly.js:1
async function (async)
(anonymous) @ blazor.webassembly.js:1
window.Module.s.instantiateWasm @ blazor.webassembly.js:1
createWasm @ dotnet.6.0.0.cnc7cl383g.js:1
(anonymous) @ dotnet.6.0.0.cnc7cl383g.js:1
blazor.webassembly.js:1 Uncaught (in promise) CompileError: WebAssembly.instantiate(): Wasm code generation disallowed by embedder
    at blazor.webassembly.js:1
    at async blazor.webassembly.js:1

- bob craig

Answer 4

我在 TYPO3 系统的 typo-script 中尝试了一下，但 'unsafe-eval' 或 'wasm-eval' 都无法工作。 :-(

我将它定义在 .htaccess 中，现在可以正常工作了。 :-)

<IfModule mod_headers.c>
Header set Access-Control-Allow-Origin {linkToDomain}
Header set Access-Control-Allow-Credentials true
Header set Content-Security-Policy "default-src 'self' blob: 'unsafe-eval' 'wasm-eval'  {other code ...} ; {other code ...} script-src 'self' 'unsafe-eval' 'wasm-eval' {other code ...};   object-src 'self' 'wasm-eval';{other code ...}"
</IfModule>

PS：Safari会出现问题。在添加了site.manifest之后，在TypoScript od TYPO3和.htaccess中扩展了default-src的内容安全策略，似乎可以解决问题。（见上文）

我觉得每个浏览器的工作方式都不同。

- Padina