TypeError:无法在'WebAssembly'上执行'compile':错误的响应MIME类型.期待'申请/ wasm'
Ric*_*ado 15 express webassembly
我正在尝试使用Chrome上的fetch api加载.wasm文件,并使用express提供html文件.但chrome不允许我加载文件:
'未捕获(承诺)TypeError:无法在'WebAssembly'上执行'compile':错误的响应MIME类型.预计'申请/ wasm'.'
这是我的文件:
/public/index.html
<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<script type="text/javascript">
WebAssembly.instantiateStreaming(fetch('http://localhost:3000/simple.wasm'))
.then(obj => {
console.log(obj.instance.exports.add(1, 2)); // "3"
});
</script>
</body>
</html>
快递服务:
/index.js
const express = require('express')
express.static.mime.define({'application/wasm': ['wasm']})
var app = express();
app.use('/', express.static('public'));
app.listen(3000, function () {
console.log('Example app listening on port 3000!')
})
我可以在提供.wasm文件时添加新的mime类型来表达吗？或允许铬接受它？我对如何解决它没有任何想法^^
请参阅:http://kripken.github.io/emscripten-site/docs/compiling/WebAssembly.html
Web server setup
To serve wasm in the most efficient way over the network, make sure your web server has the proper MIME time for .wasm files, which is application/wasm. That will allow streaming compilation, where the browser can start to compile code as it downloads.
In Apache, you can do this with
AddType application/wasm .wasm
Also make sure that gzip is enabled:
AddOutputFilterByType DEFLATE application/wasm
谢谢大家!
一个可能的解决方法是使用instantiate()来代替instantiateStreaming()，因为前者不关心MIME类型（而后者呢）。使用方法instantiate()：
async function fetchAndInstantiate() {
const response = await fetch("http://localhost:3000/simple.wasm");
const buffer = await response.arrayBuffer();
const obj = await WebAssembly.instantiate(buffer);
console.log(obj.instance.exports.add(1, 2)); // "3"
}
- 但流媒体速度更快:( (2认同)
- 是吗？您是否有任何数据来支持该论点，或者您只是依赖于一般流媒体的想法，您可以在完成下载之前开始处理它？如果是这样的话，我认为这不会产生任何重大影响，除非你的 wasm 文件真的很大。 (2认同)
- @Lucio Palva - `async` 和 `await` 关键字是新的并且非常先进，所以我很感激。谢谢。 (2认同)
原因是，node.jsexpress.js服务器无法识别文件类型.wasm
因此它默认将响应标头设置为 application/octet-stream
启用express.js通过以下方式识别.wasm文件，
更新 type-is 版本到 1.6.16 + 因为 1.6.16 添加支持 .wasm 文件
但如何让它发挥作用呢？分享我的工作示例：
1）现在安装type-is，运行
npm install type-is
确保 package.json type-is 版本为 1.6.18
2）确保您的express.js版本是4.17，如果没有通过修改package.json文件将express.js从4.15更新到4.17，将4.15更改为4.17，如图所示
然后运行 npm install express
4.15不支持type-is，所以必须升级到4.17
app.js文件添加日志，输出当前运行的express版本只需确保它是4.17
现在我的express.js通过响应正确的标头内容类型application/wasm支持.wasm文件
小智 4
快速搜索给了我这个答案
express.static.mime.define({'application/octet-stream': ['csv']})
从这里
| 归档时间： |
|
| 查看次数： |
7427 次 |
| 最近记录： |