原因:

当我们在开发django应用时如果设置了 DEBUG = True,那么django便会自动帮我们对静态文件进行路由;但是当我们设置DEBUG = False后,这一功能便没有了,此时静态文件就会出现加载失败的情况,想要让静态文件正常显示,我们就需要配置静态文件服务。但可不可以在不配置静态文件服务器如Nginx等的情况下正常访问呢。经过测试总结如下。

环境:

运行版本:django4.2.10
在不部署Nginx等服务器提供静态文件服务的情况下提供静态文件服务。

目标是python manage.py runserver 0.0.0.0:9000启动时,DEBUG=True和False都正常。

解决方案一:改变运行方式。

以下面的命令运行,加入insecure参数:

python manage.py runserver --insecure

nostatic表示不自动处理静态文件,insecure表示就算不是调试模式Django框架也要处理静态文件。

解决方案二:使用django.views.static.serve()方法。(不推荐该方法,且配置复杂)

①在settings.py中添加:

# Path to where static files will be collected in production
# STATIC_URL:此 URL 前缀用于提供静态文件。通常,它设置为 /static/。
STATIC_URL = '/static/'

# In production, use this path to store collected static files
# STATIC_ROOT:这是在生产环境中收集和存储静态文件的目录。
STATIC_ROOT = os.path.join(BASE_DIR, 'knowbase', 'static')

# In development, specify directories that store static files
#STATICFILES_DIRS:这是 Django 在您的项目中搜索静态文件的目录列表。是一个列表,可以设置多个目录,也可以不设置。
STATICFILES_DIRS = [    os.path.join(BASE_DIR, 'staticfiles')    ]

关于三个地址详解可参考《Django-settings.py的默认设定与工作原理

注意:
注意目录问题,如果拼接不对,可用print()打印查看调整。knowbase为app目录
STATIC_ROOT和STATICFILES_DIRS两个一样还不行,否则会有如下提示

ERRORS:
?: (staticfiles.E002) The STATICFILES_DIRS setting should not contain the STATIC_ROOT setting.

也可以做一个判断,示例如下

STATIC_URL = '/static/'
if DEBUG == False: 
    STATIC_ROOT = os.path.join(BASE_DIR, 'static')
else:
    STATICFILES_DIRS = [
        os.path.join(BASE_DIR,"static")
    ]

②在urls.py中添加:

from django.conf import settings
from django.urls import path, include, re_path
from django.views.static import serve

urlpatterns = [
    re_path(r'^static/(?P<path>.*)$', serve, {'document_root': settings.STATIC_ROOT}),
]

③进行收集操作python manage.py collectstatic

在官方文档中,对该方法的评价是:“The big, fat disclaimer”

以上已可以解决大部分静态文件情况。此部分media,用户上传可参考。但注意访问权限,可能会开放所有文件访问,有重大安全风险。

特别注意事项:

有一个大坑是Login登录页面有中间件拦截,导致登录页面总是无法获取静态文件,不要用该页面测试。
可以采用登录后的页面进行测试,测试完毕正常后,再调整Login页面情况。

中间件问题可参考文章。
解决django中间件拦截静态文件

favicon显示问题可参考文章。
解决django的favicon显示问题

碰到Django设置 DEBUG=False后,访问前端报错 MIME 类型(“text/html”)不匹配(X-Content-Type-Options: nosniff)
所有 css 和 js 文件都无法访问,后台显示404

可以参考如下,但多数是静态文件未加载问题,和下面无关。

在settings.py同级init.py文件内添加以下代码

import mimetypes
mimetypes.add_type("text/css", ".css", True)
mimetypes.add_type("text/javascript", ".js", True)

总结:
django的生产环境不同开发环境,在生产环境下(DEBUG=False),django.contrib.staticfiles 是不起任何作用的,也就说 django.contrib.staticfiles 只对开发环境(DEBUG=True)开启。

解决方案三:

采用django的静态文件服务第三方插件,比如WhiteNoise等,可参考《基于WhiteNoise的Python静态文件服务方案

解决方案四:

nginx部署静态文件可采用uwsgi、proxy_pass等进行代理。配置代理后,即可去掉urls.py中对static地址的正则重写。此为官方推荐形式。采用uwsgi模式需要django作相应uwsgi配置。

nginx的uwsgi代理模式参考:

server {
    listen 80;
    server_name example.com;

    location = /favicon.ico { access_log off; log_not_found off; }

    location /static/ {
        root /path/to/your/django/project;
    }

    location / {
        include uwsgi_params;
        uwsgi_pass 127.0.0.1:9000;
        # uwsgi_pass unix:///tmp/yourproject.sock;
    }
}

nginx的http代理模式参考:

    location / {
        proxy_pass http://localhost:9000;
        proxy_set_header Host $host;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        proxy_set_header X-Forwarded-Proto $scheme;
    }

相关配置可参考
Nginx七层(应用层)反向代理:UWSGI代理uwsgi_pass篇
Nginx七层(应用层)反向代理:HTTP反向代理proxy_pass篇

参考链接
https://docs.djangoproject.com/zh-hans/2.0/howto/static-files/
https://docs.djangoproject.com/en/5.1/howto/static-files/
https://blog.csdn.net/qq_41138285/article/details/84578785
https://blog.51cto.com/liangdongchang/5213252
https://zhuanlan.zhihu.com/p/348392647
https://zhuanlan.zhihu.com/p/151855280
https://mp.weixin.qq.com/s/HXmmb2NE66di7GVlq7BD_Q
https://blog.csdn.net/weixin_39662432/article/details/110657339
https://stackoverflow.com/questions/5836674/why-does-debug-false-setting-make-my-django-static-files-access-fail
https://www.cnblogs.com/beichengshiqiao/p/17347769.html

参考
urls.py

    # favicon.ico
    # re_path(r'^favicon\.ico$', RedirectView.as_view(url=r'media/favicon.ico')),
    # re_path(r'^media/(?P<path>.*)$', serve, {'document_root': settings.MEDIA_ROOT}),
    # re_path(r'^static/(?P<path>.*)$', serve, {'document_root': settings.STATICFILES_DIRS}), # 收集静态文件时关闭
    # path(r'^static/(?P<path>.*)$', serve, {'document_root': settings.STATIC_ROOT}), # 收集静态文件时打开,然后关闭STATICFILES_DIRS

附录:

在使用Django框架时,引入Bootstrap或其他外部样式文件是很常见的做法。然而,有时你可能会遇到一个错误,提示浏览器拒绝应用样式,原因是文件的MIME类型不正确。这通常是由于Django配置或文件引用方式的问题导致的。下面是一些解决此问题的步骤:

1、检查文件路径:确保你正确地引用了Bootstrap样式文件的路径。如果你在静态文件夹中存储了Bootstrap文件,确保在模板中使用了正确的路径。
2、设置正确的MIME类型:在Django项目的设置文件中,确保STATIC_URL设置正确,指向你的静态文件存储位置。同时,也要确保STATICFILES_DIRS或STATIC_ROOT设置正确,指向你的静态文件文件夹。
3、清除缓存:有时候,浏览器会缓存错误的MIME类型。尝试清除浏览器缓存或使用强制刷新(通常是Ctrl+F5)来加载新内容。
4、检查文件扩展名:确保你的Bootstrap样式文件具有正确的扩展名(例如.css)。浏览器通常根据文件扩展名来确定MIME类型。
5、检查服务器配置:如果你使用的是自定义服务器(如Apache或Nginx),请检查服务器的配置,确保它正确地为静态文件提供了适当的MIME类型。
6、静态文件处理:确保在Django项目中正确配置了静态文件处理。通常,你可以在urls.py文件中添加以下配置来处理静态文件:

        from django.conf.urls.static import static
        from django.contrib.staticfiles.urls import staticfiles_urlpatterns
        from django.conf.urls import include, url
        urlpatterns = [
        # other URLs
        ] + static(settings.STATIC_URL, document_root=settings.STATIC_ROOT)

7、查看网络响应:在浏览器开发者工具中,查看网络响应并查找Bootstrap样式文件的响应头。确保它返回了正确的MIME类型(通常是text/css)。如果MIME类型不正确,可能是服务器或中间件配置问题。
8、检查中间件配置:如果你使用了自定义中间件,请检查中间件的配置,确保它不会干扰静态文件的处理或修改MIME类型。
9、升级依赖库:确保你使用的Django、Bootstrap和其他相关库都是最新版本。有时,旧版本的库可能存在已知的问题或与新版本的工具不兼容。
10、查看错误日志:检查Django的错误日志,看是否有关于静态文件加载或MIME类型的错误信息。这可能会提供更多关于问题的线索。

通过遵循这些步骤,你应该能够解决“Refused to apply style from…because its MIME type (‘text/html’) is not a”错误。如果你仍然遇到问题,建议提供更多详细的错误信息或检查文档以获取更具体的解决方案。

附录来源于https://developer.baidu.com/article/details/2791259