使用Nginx托管Django静态文件出现404错误求助

环境与项目信息 #

• Homebrew安装的Nginx
• Django项目目录结构：

core (app)
main_app(app)
maps(app)
static/
    css folder, 
    js folder etc
templates
manage.py

已执行操作 #

1. 配置Django静态/媒体文件参数：

STATICFILES_DIRS = [
    os.path.join(BASE_DIR, "static"),
]

STATIC_URL = '/static/'
STATIC_ROOT = '/Users/nuntea/Documents/Vasundhara Geo technology/vgt-bitmapper-portal-app/staticfiles/'

MEDIA_URL = '/media/'
MEDIA_ROOT = '/Users/nuntea/Documents/Vasundhara Geo technology/vgt-bitmapper-portal-app/media/'

2. 执行静态文件收集：

nuntea@Zonunmawias-MacBook-Air vgt-bitmapper-portal-app % python3 manage.py collectstatic 

184 static files copied to '/Users/nuntea/Documents/Vasundhara Geo technology/vgt-bitmapper-portal-app/staticfiles'

3. 修改Nginx配置（/opt/homebrew/etc/nginx/nginx.conf），添加server块：

server {
    listen 8080;
    server_name _;
    
    location /static/ {
        alias /Users/nuntea/Documents/Vasundhara\ Geo\ technology/vgt-bitmapper-portal-app/staticfiles/;
    }

    location /media/ {
        alias /Users/nuntea/Documents/Vasundhara\ Geo\ technology/vgt-bitmapper-portal-app/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;
      }
}

完整nginx.conf内容：

worker_processes  1;

events {
    worker_connections  1024;
}

http {  
    include       mime.types;
    default_type  application/octet-stream;

    sendfile        on;
    
    server {
    listen 8080;
    server_name _;
    
    location /static/ {
        alias /Users/nuntea/Documents/Vasundhara\ Geo\ technology/vgt-bitmapper-portal-app/staticfiles/;
    }

    location /media/ {
        alias /Users/nuntea/Documents/Vasundhara\ Geo\ technology/vgt-bitmapper-portal-app/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;
      }
  }
     include servers/*;
}

4. 验证Nginx配置与状态：

nuntea@Zonunmawias-MacBook-Air vgt-bitmapper-portal-app % nginx -t
nginx: the configuration file /opt/homebrew/etc/nginx/nginx.conf syntax is ok
nginx: configuration file /opt/homebrew/etc/nginx/nginx.conf test is successful

nuntea@Zonunmawias-MacBook-Air vgt-bitmapper-portal-app % cat /opt/homebrew/var/log/nginx/error.log   
2024/02/01 18:45:38 [notice] 27654#0: signal process started
2024/02/01 18:52:33 [notice] 28151#0: signal process started
2024/02/01 18:54:08 [notice] 28392#0: signal process started
2024/02/01 18:57:44 [notice] 28474#0: signal process started

nuntea@Zonunmawias-MacBook-Air vgt-bitmapper-portal-app % sudo lsof -i :8080                          
COMMAND   PID   USER   FD   TYPE             DEVICE SIZE/OFF NODE NAME
nginx   27986 nuntea    6u  IPv4 0xb41b860f093f6c3d      0t0  TCP *:http-alt (LISTEN)
nginx   28476 nuntea    6u  IPv4 0xb41b860f093f6c3d      0t0  TCP *:http-alt (LISTEN)

问题现象 #

启动Django runserver后，访问站点时静态文件请求全部返回404：

nuntea@Zonunmawias-MacBook-Air vgt-bitmapper-portal-app % python3 manage.py runserver

[01/Feb/2024 23:39:54] "GET / HTTP/1.1" 302 0
[01/Feb/2024 23:39:55] "GET /core/login-user/?next=/ HTTP/1.1" 200 1801
[01/Feb/2024 23:39:55] "GET /static/custom_css/base.css HTTP/1.1" 404 179
[01/Feb/2024 23:39:55] "GET /static/jquery_js/jquery-3.6.4.min.js HTTP/1.1" 404 179
[01/Feb/2024 23:39:55] "GET /static/bootstrap_css/bootstrap.min.css HTTP/1.1" 404 179
[01/Feb/2024 23:39:55] "GET /static/bootstrap_js/bootstrap.min.js HTTP/1.1" 404 179

解决方案 #

核心问题：请求未经过Nginx转发 #

从Django日志能看到静态文件请求直接打到了runserver上，说明你是直接访问了127.0.0.1:8000，而不是Nginx监听的127.0.0.1:8080。Nginx的静态文件路由配置只对8080端口的请求生效，直接访问8000的话，Django默认不会处理STATIC_ROOT里的文件（除非开启DEBUG=True但生产环境不建议）。

修复步骤 #

1. 停止当前的Django runserver，重新启动时绑定0.0.0.0，允许Nginx转发：

python3 manage.py runserver 0.0.0.0:8000

2. 访问Nginx监听的端口：打开浏览器访问http://127.0.0.1:8080，此时静态文件请求会被Nginx拦截并从STATIC_ROOT目录返回，不再经过Django。

额外排查点 #

如果访问8080仍有问题，检查以下内容：

• 确认STATIC_ROOT目录下确实存在请求的文件，比如查看/Users/nuntea/Documents/Vasundhara Geo technology/vgt-bitmapper-portal-app/staticfiles/custom_css/base.css是否存在
• Nginx配置中的alias路径，可改用引号包裹路径避免空格转义问题：

location /static/ {
    alias "/Users/nuntea/Documents/Vasundhara Geo technology/vgt-bitmapper-portal-app/staticfiles/";
}

• 重启Nginx使配置生效：

brew services restart nginx

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