Django Static 不加载但可以访问。 NGINX 和 Docker

Question

我已将我的 Django (DRF) 连接到 Gunicorn 和 Nginx，并将它们全部放在 docker 中。

当我加载 mysite.com/admin/ 时，它看起来很糟糕，只是纯文本。所以它似乎没有加载任何静态文件。但是，在浏览器控制台中，错误为零。

此外，我看到所有静态文件都已从服务器成功加载（所有 /static/ 请求都是 HTTP 200）并且我可以打开它们在我的浏览器中输入 url：mysite.com/static/admin/css/base.css。和这个文件将成功打开.但是管理站点不想应用它。 在具有 Debug=True 的本地主机上，一切都工作正常。

在主要网站上，所有 /media/ 也都运行良好，因此问题仅在 /static/ 内。

nginx 配置文件

events {}
http {
    server {
        listen 80;
        server_name mysite.com;
        server_tokens off;

        location / {
            return 301 https://$host$request_uri;
        }
    }

    server {
        listen 80;
        server_name api.mysite.com;
        server_tokens off;

        location / {
            return 301 https://$host$request_uri;
        }
    }

    server {
        listen 443 ssl;
        server_name mysite.com;
        server_tokens off;

        ssl_certificate  /etc/nginx/certs/mysite.com-chain.pem;
        ssl_certificate_key /etc/nginx/certs/mysite.com-key.pem;

        location / {
            proxy_pass http://10.0.2.237:3004; # React Frontend
        }

    }

    server {
        listen 443 ssl;
        server_name api.mysite.com;
        server_tokens off;

        ssl_certificate  /etc/nginx/certs/api.mysite.com-chain.pem;
        ssl_certificate_key /etc/nginx/certs/api.mysite.com-key.pem;

        location /media/ {
            autoindex on;
            alias /django-media/;
        }

        location /static/ {
            autoindex on;
            alias /django-static/;
        }

        location / {
            try_files $uri @proxy_api;
        }

        location @proxy_api {
            proxy_set_header X-Forwarded-Proto https;
            proxy_set_header X-Url-Scheme $scheme;
            proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
            proxy_set_header Host $http_host;
            proxy_redirect off;
            proxy_pass   http://10.0.2.237:7000; # Django Gunicorn Backend
        }


    }
}

docker-compose.backend.yml

version: '3.8'
services:
  postgres_db:
    container_name: postgres-prod
    image: postgres
    ports:
      - "5543:5543"
    volumes:
      - postgres_data_prod:/var/lib/postgresql/data/
    env_file:
      - .env.production
    command: -p 5543
  web:
    container_name: django-backend-prod
    build: .
    env_file:
      - .env.production
    ports:
      - "7000:8001"
    entrypoint: ./entrypoint.production.sh
    volumes:
      - .:/code
      - media:/code/media
      - static:/code/project/static
    depends_on:
      - postgres_db
    networks:
      - default
    restart: always

volumes:
  media:
    driver_opts:
      type: none
      device: ${PWD}/media
      o: bind
  postgres_data_prod:

networks:
  default:
    external:
      name: sentry-net

docker-compose.frontend.yml（在不同的目录下，静态和媒体通过卷连接）

version: '3.8'

services:
  frontapp:
    container_name: React-Frontend-PROD
    build:
      context: .
      dockerfile: Dockerfile

    volumes:
      - '.:/app'
      - '/app/src'
      - '/app/node_modules'
    ports:
      - "3004:3000"
    env_file:
      - .env.production

  nginx:
    image: nginx:latest
    ports:
      - "80:80"
      - "443:443"
    volumes:
      - .nginx/nginx.conf:/etc/nginx/nginx.conf
      - .certs/:/etc/nginx/certs
      - django-backend-prod_media:/django-media
      - django-backend-prod_static:/django-static
    links:
      - frontapp
    depends_on:
      - frontapp
    networks:
      - default

volumes:
  django-backend-prod_media:
    external: true
  django-backend-prod_static:
    external: true


networks:
  default:
    external:
      name: sentry-net

Answer 1

你找到答案了吗？我也面临同样的问题