[FIXED] Django CSS/JS MIME type (“text/html”) mismatch Error

Issue

I'm developing a a web application which runs on a local server provided by django. The first page index.html has many CSS and javascript files. But, none of them is properly rendered on browser. All the css/js files show same MIME type (“text/html”) mismatch (X-Content-Type-Options: nosniff) error. The firefox console shows the error briefly -

The resource from “http://localhost:8000/C:/Users/PYTHON/foodie/static/plugins/scrollTo/jquery.scrollTo.min.js” was blocked due to MIME type (“text/html”) mismatch (X-Content-Type-Options: nosniff).

Solution

check your static files settings in settings.py:

STATIC_URL = '/static/'
STATIC_ROOT = os.path.join(BASE_DIR, 'static')
STATICFILES_DIRS = [
    os.path.join(BASE_DIR, 'templates/static'),
]

and add this in master urls.py:

from django.conf.urls.static import static

if settings.DEBUG:
    urlpatterns = urlpatterns + static(settings.STATIC_URL, document_root=settings.STATIC_ROOT)
    urlpatterns = urlpatterns + static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)

Answered By - Mahdi Namaki