Forums

Static files (javscript and css) not loading: "was blocked due to MIME type (“text/html”) mismatch"

Hi!

I got my webapp up and running OK so far, but when I navigate to it I am getting two errors in the console:

The resource from http://tromik.pythonanywhere.com/static/xbox/styles.css” was blocked due to MIME type (“text/html”) mismatch (X-Content-Type-Options: nosniff).
The resource from http://tromik.pythonanywhere.com/static/xbox/index.js” was blocked due to MIME type (“text/html”) mismatch (X-Content-Type-Options: nosniff).

The result is that the entire html page loads (the js would suppress all but 2 or 3 divs on load because it's a single-page site). Though my CSS file isn't loading, the bootstrap CSS file is.

I looked through some docs but didn't find anything too helpful, at least that I have access to troubleshoot in PythonAnywhere.

This doesn't happen running locally. Appreciate any help! I did search this forms here and google but didn't find anything matching.

i did set a STATIC_ROOT and run collectstatic, but I don't think that would have been necessary.

It looks like your website is currently disabled, so I can't check it out myself, but have you set up the static file mappings as per this help page?

Thanks giles, that did the trick. Sorry, I had read it but it sounded optional based on the description: "Files that aren't dynamically generated by your code, like CSS, JavaScript or uploaded files, can be served much faster straight off the disk if you specify them here. You need to Reload your web app to activate any changes you make to the mappings below. " but I guess it is required for my specific implementation? It does work now, so thanks for the tip!

Excellent, glad we could help! The static files stuff is optional if you have something in place (like the Django whitenoise plugin) to handle them, but it's definitely better to use our built-in system because it's much faster.