Wrong Content-Type

[brucejo.wk]

I just ran into this problem this morning using my own server, only affected my customers in Sarasota.

Refused to execute script from
'https://www.merisapp.com/7eabd35...js?meteor_js_resource=true' because its MIME type
('text/html') is not executable, and strict MIME type checking is enabled.

This creates a big problem because the only remedy is to:

• purge Cloudflare CDN
• clear browser data for the affected website (multiple clicks!) to get rid of browser cache and service worker cache
• reconnect

This seems like a Cloudflare issue? (only happened in 1 region for me and purging fixes it)

[WalshyMVP]

Sounds like a 404 page got cached on your zone. Not a Pages issue. Pages handles cache and stuff itself, adding your own layer on top just causes these problems.

[brucejo.wk]

Also, there seem to be quite a few of these floating around:
https://community.cloudflare.com/search?q=wrong%20MIME

[brucejo.wk]

Thanks for your response!

• I am not using pages.
• does not appear to be a 404, it was retrieved fine up here in the Northwest… Only affected customers in Sarasota

[WalshyMVP]

This thread was related to Pages. Please make a different thread if it isn’t related to this one

[brucejo.wk]

Thanks @WalshyMVP,

Thinking about your response…
Can I assume each geographic area queries my server on their own? Or does Cloudflare query my server once to distribute to all CDN zones?

It is conceivable that my server may have failed for a request in the Sarasota zone but not failed in the Northwest zone.

Is there a suggested way I can trace back from the cached response to understand where Cloudflare may have been served a bad page?

Thanks!

[brucejo.wk]

@WalshyMVP I just scanned my live reverse proxy log. I did serve status 404 returns but none of them were GET methods.

I checked back 4 days and there are no GET methods that received a 404 response.

[piotr3]

I am using Cloudflare pages and also have same issue.

There is something wrong and it’s causing frustration

[monstercoo]

I’m hitting this issue in firefox/safari. It seems like whenever the browser has cached content, content is getting the wrong content-type/mime type. My repro is really simple, if I get bootstrap.min.js and then get it again (browser cached), I get the following error:

The script from “https://redacted.pages.dev/bootstrap/dist/js/bootstrap.min.js” was loaded even though its MIME type (“”) is not a valid JavaScript MIME type.

1st response (works normally):

HTTP/3 200 OK
date: Tue, 27 Dec 2022 11:54:09 GMT
content-type: application/javascript
access-control-allow-origin: *
cache-control: public, max-age=0, must-revalidate
etag: W/“8f925cf8916115ac6941c84ae6d73975”
referrer-policy: strict-origin-when-cross-origin
x-content-type-options: nosniff
report-to: {“endpoints”:[{“url”:“https://a.nel.Cloudflare.com/report/v3?s=l9oyLedcfnifluckB1%2FlqAXSnGnzMsscwMoNf8jafVVC6hkpjgycYUq3PN2F3XhYLJrLhOe%2BvuuXgZ7YQCWqf3jdgDP4K09rkbDnqyXFCDNxXhakhaZ7U0LtnT9NYYrbboYQ4fLmg1E%3D”}],“group”:“cf-nel”,“max_age”:604800}
nel: {“success_fraction”:0,“report_to”:“cf-nel”,“max_age”:604800}
vary: Accept-Encoding
server: Cloudflare
cf-ray: 7801dc225965eb57-SEA
content-encoding: br
alt-svc: h3=“:443”; ma=86400, h3-29=“:443”; ma=86400

Broken 2nd response on re-get (missing content-type):

HTTP/3 200 OK
date: Tue, 27 Dec 2022 11:50:59 GMT
content-length: 0
access-control-allow-origin: *
referrer-policy: strict-origin-when-cross-origin
report-to: {“endpoints”:[{“url”:“https://a.nel.Cloudflare.com/report/v3?s=fmnTNVSY1Wnxn7cYyGLUzQpE59c0XOzXrfFF%2FrCtuzDti1%2BP7TkYow5TVExH7yMTewVjgNn6Zsx%2FUYM0KcnjdC4LEdO%2BLkJ5Z%2FMLJCmuHsZ%2BpJhzo7NSmeJDpURU%2Fa9pfiGwEqd3GY0%3D”}],“group”:“cf-nel”,“max_age”:604800}
nel: {“success_fraction”:0,“report_to”:“cf-nel”,“max_age”:604800}
vary: Accept-Encoding
server: Cloudflare
cf-ray: 7801d77b1d9bc53d-SEA
alt-svc: h3=“:443”; ma=86400, h3-29=“:443”; ma=86400

[monstercoo]

I’ve isolated this to be related to using a Function. Removing the functions folder eliminates the problem.

my _middleware.ts file was:

import mailChannelsPlugin from “@cloudflare/pages-plugin-mailchannels”;

export const onRequest: PagesFunction = (context) => mailChannelsPlugin({
personalizations: [
{
to: [{ name: “Contact Form”, email: “redacted” }],
“dkim_domain”: “redacted”,
“dkim_selector”: “mailchannels”,
“dkim_private_key”: context.env.DKIM_PRIVATE_KEY
},
],
from: {
name: “Inquiry”,
email: “[email protected]”,
},
respondWith: () => {
return new Response(
“We’ve successfully received your submission. Thank you!”
);
},
})(context);

[piotr3]

In my case it isn’t related to functions as I don’t use them.

the issue is real and happens to people a lot so we need some investigation and help from the team.

[piotr3]

FOR FUTURE GENERATIONS:

go to sites → rules → transform rules → response headers

When URI ends with js set response header Content-Type text/javascript

this overrides everything I believe and fixes issue so far

spent weeks of my life to find this fix.