django 联机部署项目时获取MIME类型错误

8cdiaqws  于 2023-08-08  发布在  Go
关注(0)|答案(1)|浏览(110)

当我尝试在Django项目中加载CSS文件时,我得到以下错误:
拒绝应用“http://127.0.0.1:8000/assets/css/index-b4422385.css”中的样式,因为其MIME类型('text/html')不是受支持的样式表MIME类型,并且启用了严格的MIME检查。
我已经尝试通过更改文件的MIME类型来解决这个问题,但这并不起作用。
下面是我的代码:

<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <link rel="icon" type="image/svg+xml" href="/vite.svg" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Vite + React</title>
    
    <link rel="stylesheet" href="/assets/css/index-b4422385.css" type="text/css">
  </head>
  <body>
    <div id="root"></div>
    <script type="module" crossorigin src="/assets/js/index-580b2f9b.js"></script>
  </body>
</html>

字符串
下面是我的静态文件配置:

STATIC_URL = "static/"

STATICFILES_DIRS = [
    os.path.join(BASE_DIR, "staticfiles"),
    (os.path.join(BASE_DIR, "dist", "assets")),
]


我已经创建了我的React应用程序。
在我的Django日志中,我收到以下错误:

Not Found: /assets/css/index-b4422385.css
[06/Aug/2023 22:34:58] "GET /assets/css/index-b4422385.css HTTP/1.1" 404 3999
Not Found: /assets/js/index-580b2f9b.js
[06/Aug/2023 22:34:58] "GET /assets/js/index-580b2f9b.js HTTP/1.1" 404 3993


我尝试将以下设置添加到我的settings.py文件中,但这不起作用:

STATICFILES_MIMETYPES = {
    ".css": "text/css",
}


我做错了什么?

预期行为:

加载CSS文件时应该没有任何问题。

实际行为:

CSS文件没有加载,我得到了上面提到的错误消息。

可能的解决方案:

  • 我不知道是什么问题。
  • CSS文件的MIME类型设置不正确。
  • 静态文件配置不正确。
    附加上下文:

我使用的是Django 3.2.8和Python 3.10.1。
如果任何人需要更多的代码来理解,请指定,我很乐意分享它。

rkttyhzu

rkttyhzu1#

1.请确保您正在加载静态文件并正确引用它们:

{% load static %}
<link rel="stylesheet" href="{% static 'css/index-b4422385.css' %}">

字符串
1.然后确保您的urls.py没有任何冲突。如果是这样,django将返回text/html页面,而不是静态文件。
1.此外,我们正在讨论DEBUG=True模式,如果您将其设置为False并希望有一个生产就绪的解决方案,则必须考虑正确设置Web服务器以提供静态和媒体文件。下面是nginx的例子:

server {
    listen 80;
    server_name yourdomain.com;  # replace with your domain name

    location /static/ {
        alias /path/to/your/staticfiles/;  # replace with the path to your static files directory
        expires 30d;  # optional: set cache expiration for static files
    }

    location /media/ {
        alias /path/to/your/mediafiles/;  # replace with the path to your media files directory
        expires 30d;  # optional: set cache expiration for media files
    }

    location / {
        proxy_pass http://127.0.0.1:8000;  # assuming your Django project is running on port 8000
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        proxy_set_header Host $host;
        proxy_redirect off;
    }
}

相关问题