Javascript 在chrome沙盒中使用WebAssembly_Javascript_Google Chrome Extension_Cors_Sandbox_Webassembly

Javascript 在chrome沙盒中使用WebAssembly

javascript google-chrome-extension cors

Javascript 在chrome沙盒中使用WebAssembly,javascript,google-chrome-extension,cors,sandbox,webassembly,Javascript,Google Chrome Extension,Cors,Sandbox,Webassembly,我有一个chrome扩展，包括一个复杂的函数comp_func（data），它通过执行许多位操作占用大量CPU。因此，我尝试使用WebAssembly。经过多次尝试，我得出结论，由于权限问题，我需要在沙箱中使用此函数现在，我正试图遵循和作为一个“你好世界”的例子来解决我的问题 WebAssembly文件包括：index.js和index.wasm，沙盒文件是：sandbox.html， page.js是需要执行comp_func（data）的扩展代码，它使用postMessage作为与sa

我有一个chrome扩展，包括一个复杂的函数

comp_func（data）

，它通过执行许多位操作占用大量CPU。因此，我尝试使用WebAssembly。经过多次尝试，我得出结论，由于权限问题，我需要在沙箱中使用此函数

现在，我正试图遵循和作为一个“你好世界”的例子来解决我的问题

WebAssembly文件包括：

index.js

和

index.wasm

，沙盒文件是：

sandbox.html

，

page.js

是需要执行

comp_func（data）

的扩展代码，它使用

postMessage

作为与

sandbox.html

通信的方式。

background.html

是扩展名的背景文件

这就是我到目前为止所做的：

manifest.json

   "sandbox": {
     "pages": ["sandbox.html"]
   },

background.js

<script src="page.js"></script>
<iframe id="theFrame" src="sandbox.html" style="display: none;"></iframe>

sandbox.html

<html>
      <body>
        <script src="index.js"></script>
        <script>
        var result = _roll_dice(); //the function of the WebAssembly
        console.log('results! ', result);
        </script>
      </body>
    </html>


var result=_roll_dice（）//WebAssembly的功能
log（'results！'，result）；

因此，现在扩展正在调用

sandbox.html

，后者依次加载

index.js

，但是我得到了错误：

加载失败 chrome扩展名：//索引。wasm：否 “Access Control Allow Origin”标头出现在请求的服务器上资源。因此，不允许访问源“null”。如果是不透明的响应满足您的需要，将请求的模式设置为“无cors”以获取禁用CORS的资源

据我所知，

index.js

正在调用

index.wasm

，因为我在沙箱中，所以存在CORS权限问题。

有人知道这种情况下的解决方案吗？

WebAssembly模块通常是通过HTTP从JavaScript加载的，但是，还有其他方法可以将它们包含在代码中。例如，可以对WebAssembly二进制文件进行base64编码，并将其作为字符串包含。或者，您可以使用诸如rollup之类的构建工具来为您实现这一点：

这允许您引用wasm文件作为导入：

import wasm from './sample.wasm';

sample({ ...imports }).then(({ instance }) => {
  console.log(instance.exports.main())
})

但是，当使用rollup构建时，它将是base64编码和内联的。

权限问题到底是什么？如果它是由脚本标记中的内联代码引起的，只需使用单独的js文件即可。还可以尝试一个使用不同方法的方法。@wOxxOm感谢您的回复！我也尝试过在MDN教程中这样做，但没有成功。如果我试图在沙箱之外执行此操作，我会遇到以下错误：“未捕获（承诺中）编译器错误：WebAssembly.compile（）：嵌入式程序不允许生成Wasm代码”可能Chrome不支持扩展中的Wasm，但只支持https？您可以尝试通过在扩展中使用服务人员来“服务”它。也可以考虑问一下。