Set MIME type for fetched file

Question

I have a static file server (made with vibe.d) serving a website that uses ES6 modules but with .mjs extension.

My browser (Chromium on Arch Linux) is throwing an error when it fetches the module files server responded with a non-JavaScript MIME type of "application/octet-stream" .

It looks like I need to set the MIME type files with the .mjs from "application/octet-stream" to "application/javascript". How do I do this? I could change all the scripts to .js but that is but I would rather figure out how to fix it right.

How would I change the MIME type for a file being fetched? Or probably better, can I change the default MIME type for all .mjs files?

Here is my d code with vibe.d:

auto router = new URLRouter;
auto fileServerSettings = new HTTPFileServerSettings;
fileServerSettings.encodingFileExtension = ["gzip" : ".gz"];
router.get("/gzip/*", serveStaticFiles("./public/", fileServerSettings));
router.get("/ws", handleWebSockets(&handleWebSocketConnection));
router.get("*", serveStaticFiles("./public/",));

listenHTTP(settings, router);

Answer 1

The content-type header in the response needs to be changed.

Vibe.d might have a way to configure the defaults but you can always catch it before it sends the response to edit the header of files ending in .mjs .

You can do this in vibe.d like so:

auto router = new URLRouter;
auto fileServerSettings = new HTTPFileServerSettings;
fileServerSettings.encodingFileExtension = ["gzip" : ".gz"];
fileServerSettings.preWriteCallback = &handleMIME; // Add preWriteCallback to fileServerSettings
router.get("/gzip/*", serveStaticFiles("./public/", fileServerSettings));
router.get("/ws", handleWebSockets(&handleWebSocketConnection));
router.get("*", serveStaticFiles("./public/", fileServerSettings)); // Use fileServerSettings in this get too.

// preWriteCallback, will edit the header before vibe.d sends it.
void handleMIME(scope HTTPServerRequest req, scope HTTPServerResponse res, ref string physicalPath) {
    if (physicalPath.endsWith(".mjs")) {
        res.contentType = "application/javascript"; // vibe.d has an easy `.contentType` attribute so you do not have to deal with the header itself.
    }
}