Nginx部署Django站点后静态文件加载失败的配置求助

问题原因 #

当前Nginx把所有请求（包括静态资源）都代理给了Django，但生产环境下Django默认不处理静态文件请求，导致静态资源请求返回的是Django的404页面（MIME类型为text/html），触发浏览器的MIME类型校验错误。

解决方案 #

1. 收集静态文件到指定目录 #

先确保Django已将所有静态文件收集到STATIC_ROOT配置的目录中，执行以下命令：

python manage.py collectstatic

执行完成后，项目根目录下的deploystatic文件夹会包含所有应用和项目的静态资源文件。

2. 修改Nginx站点配置 #

编辑你的Nginx站点配置文件/etc/nginx/sites-available/myproject，在443端口的server块中，添加处理/static/和/media/请求的location块（放在location /之前）：

server {
    listen 443 ssl;
    server_name ecommerce.jamelaumn.com;
    ssl_certificate something/fullchain.pem;
    ssl_certificate_key somethingblablabla/privkey.pem;

    # 处理静态资源请求
    location /static/ {
        alias /absolute/path/to/your/project/deploystatic/;  # 替换为项目根目录下deploystatic的绝对路径
    }

    # 处理媒体文件请求
    location /media/ {
        alias /absolute/path/to/your/project/media/;  # 替换为项目根目录下media的绝对路径
    }

    location / {
        proxy_pass http://127.0.0.1:8000;
        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;
    }
}

注意：

• 替换/absolute/path/to/your/project/为你的Django项目根目录的绝对路径（例如/home/user/myproject/）
• alias后的路径必须以/结尾，与location中的路径格式保持一致
• 确保Nginx进程（通常是www-data用户）拥有访问这两个目录的权限，可执行以下命令调整权限：

  sudo chown -R www-data:www-data /absolute/path/to/your/project/deploystatic/
  sudo chown -R www-data:www-data /absolute/path/to/your/project/media/
  

3. 重启Nginx服务 #

配置修改完成后，重启Nginx使配置生效：

sudo systemctl restart nginx

完成以上步骤后，刷新浏览器即可正常加载静态资源。

内容的提问来源于stack exchange，提问作者Jamelaumn