web-dev-qa-db-ja.com

TypeError：「WebAssembly」で「compile」の実行に失敗しました：不正な応答MIMEタイプ。 「application / wasm」が期待されます

Chromeでfetch APIを使用して.wasmファイルをロードしようとしていますが、expressを使用してhtmlファイルを提供しています。しかし、chromeファイル：

'Uncaught（in promise）TypeError：Failed to execute' compile 'on' WebAssembly '：Incorrect response MIME type。 「application/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>

Expressで提供：

/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タイプを追加できますか？または、chromeが受け入れることを許可しますか？それを解決する方法についてのアイデアがありません^^

参照： 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

みんなありがとう！

expresswebassembly
13
Ricardo Machado

回避策の1つは、instantiate()の代わりにinstantiateStreaming()を使用することです。前者はMIMEタイプを考慮しないためです（後者は does ）。 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"
}
5
Lucio Paiva

クイック検索でこの答えが得られます

express.static.mime.define（{'application/octet-stream'：['csv']}）

from ここ

1
Yuhao Tiger Huang

多分 問題 githubのExpressが助けになるでしょう。

新しいエクスプレスが公開されるのを待つだけです。

または lynncyrinが提供するソリューション を試してみてください（これは役に立ちません。）

0
oToToT