Dfx 0.7.0-beta.2 does not allow ES modules

Developers
1

Hey, just a note on this issue. Between the opening and closing body tags, there should be a script tag that has the attribute type with the value module, and the attribute src with the value test.js. Discourse is giving me 403 errors whenever I try to save the literal script element, so I’m not sure what to do, thus I left it out and am describing it here.

Hey, using dfx 0.7.0-beta.2 anytime I try to load an ES module, for example like this:

<html>
    <head>
    </head>

    <body>
    </body>
</html>

I get the following error in the browser:

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

The problem is even more involved.

I’ve created a simple http proxy server on my local machine to try and get around the problem described above. If I explicitly set the Content-Type response header to application/json, then I can get a top level ES module to load. But the dependencies of that top level module will not load, the replica seems to always return 500 errors.

As I’ve dug into it, it looks like the http requests made from an ES module do not carry any information about the canisterId from the original URL. Other requests have the canisterId in the Referrer request header, but the referrer of in the http requests from an ES module does not have the canisterId in it. Could that be the problem? I’m not sure how the replica will be able to understand which canister it is servers assets for without providing the canisterId somehow.

1 Like
3

Thanks @lastmjs I’ve created a bug here. Will update this thread when there’s movement on the ticket.

1 Like
4

I can confirm that as of v0.7.0 this issue has been fixed: Dfx 0.7.0-beta.2 does not allow ES modules

But the problem described here: Dfx 0.7.0-beta.2 does not allow ES modules - #2 by lastmjs has not been fixed

Only a top-level ES module will load, none of its dependencies will load. I’m pretty sure this is because the Referer header on the request to get ES module dependencies does not have the canister id in it. Without ES modules being able to import dependencies locally, it’s very difficult to test ES modules locally.

Actually, this thread shows a possible solution as long as you use Chrome locally: How does replica know which canister to serve from - #4 by lastmjs

2 Likes