Loading module was blocked because of a disallowed MIME type (“application/wasm”)

Question

I serve a static file server (through HTTP), which contains data generated by wasm-pack. Using the examples from the rustwasm book, I added this code to my index HTML page:

        <script type="module">
            import init from "./pkg/fstree_web.js";

            async function run() {
                await init();
            }

            run();
        </script>

However, on Firefox, I get the error message as indicated in the title:

module from “http://localhost:8000/pkg/fstree_web_bg.wasm” was blocked because of a disallowed MIME type (“application/wasm”).

I suspected HTTPS issues or localhost issues, so I additionally tried 127.0.0.1, and even tried an https://***.ngrok.io tunnel, and Firefox still rejects loading the wasm module with this error message.

It links to an MDN article about X-Content-Type-Options, but I am not sure how it is relevant. My server is already sending Content-Type: application/wasm.

The JavaScript code generated by wasm-pack starts with this:

import { __cargo_web_snippet_72fc447820458c720c68d0d8e078ede631edd723 } from './snippets/stdweb-bb142200b065bd55/inline133.js';
import { __cargo_web_snippet_97495987af1720d8a9a923fa4683a7b683e3acd6 } from './snippets/stdweb-bb142200b065bd55/inline134.js';
import { __cargo_web_snippet_dc2fd915bd92f9e9c6a3bd15174f1414eee3dbaf } from './snippets/stdweb-bb142200b065bd55/inline135.js';
import { __cargo_web_snippet_1c30acb32a1994a07c75e804ae9855b43f191d63 } from './snippets/stdweb-bb142200b065bd55/inline136.js';
import { wasm_bindgen_initialize } from './snippets/stdweb-bb142200b065bd55/inline293.js';
import * as wasm from './fstree_web_bg.wasm';

Does Firefox want me to send *.wasm as a application/javascript? Or what is wrong?

Answer 1

The importing of WebAssembly modules is not yet standardized. You should set the --target argument of wasm-pack to web to generate JavaScript to use in a browser.