Question

我正试图托管一个网站，并且我使用了一个waswam文件和wasm-pack工具创建的.js脚本。

我用 npm 和 node.js 在本地测试了项目，一切正常。

但是后来我将其托管在树莓（apache2）上，当我尝试访问它时，我进入了控制台：

Failed to load module script: The server responded with a non-JavaScript MIME type of "application/wasm". Strict MIME type checking is enforced for module scripts per HTML spec.

详细信息

有多个文件，但是这里是个主意：

我的index.html加载模块bootstrap.js

// bootstrap.js content
import("./index.js").catch(e => console.error("Error importing `index.js`:", e));

我的主要代码在index.js中，可调用test_wasm_bg.js

最后，test_wasm_bg.js在以下行中加载wasm文件：

// test_wasm_bg.js first line
import * as wasm from './test_wasm_bg.wasm';

问题出在哪里？

是否有更好的方式来加载.wasm文件？

编辑2

我现在知道我必须“手动”实例化我的.wasm应用程序：

我尝试了命令WebAssembly.instantiateStreaming(fetch('test_wasm_bg.wasm'), {})，但是现在出现以下错误：

Uncaught (in promise) TypeError: WebAssembly.instantiate(): Import #0 module="./test_wasm_bg.wasm" error: module is not an object or function

我该怎么办？与我在项目中生成的test_wasm_bg.wasm.d.ts打字稿文件有关吗？

Answer 1

我终于找到了用wasm-bindgen项目加载wasm应用程序的正确方法！

实际上，所有内容都在此页面上：https://rustwasm.github.io/docs/wasm-bindgen/reference/deployment.html

当您编译项目而又不想使用捆绑程序运行时，必须运行 wasm-pack build --release --target web。

这将创建一个.js文件（在我的示例中为test_wasm.js），其中包含加载wasm-application所需的一切。

您只需要创建一个index.js文件即可处理wasm模块，如下所示：

import init from '../pkg/test_wasm.js';
import {ex_function1, ex_function2 …} from '../pkg/test_wasm.js';

async function run{
await init();

// do stuff with the functions ex_function1 and ex_function2

}

run();

最后，将其包含在HTML文件（<script type="module" src="./index.js"></script>）

中

在这里。

我希望这会在以后对某人有所帮助...

无法加载wasm应用程序

详细信息

编辑2

1 个答案: