使用 nginx gunicorn 在 digitalocean 上部署 django react

Question

我在 django 中綁定了反應構建。 它在本地主機上工作正常，但在服務器上它的靜態文件不起作用。 當我在激活 virtualenv 后運行它時：

gunicorn --bind 64.225.24.226:8000 liveimage.wsgi

它的管理面板在沒有 css 的情況下工作：

這是我的 nginx 默認配置：

server {
listen 80;
server_name 64.225.24.226;

access_log off;
location /media/ {
alias /root/liveimage/media/;  # change project_name
 }
location /static {
 autoindex on;
 alias /root/liveimage/build;
}
location / {
    proxy_pass http://127.0.0.1;
    proxy_set_header X-Forwarded-Host $server_name;
    proxy_set_header X-Real-IP $remote_addr;
    add_header P3P 'CP="ALL DSP COR PSAa PSDa OUR NOR ONL UNI COM NAV"';
}

}

我的seetings.py：

TEMPLATES = [
{
    'BACKEND': 'django.template.backends.django.DjangoTemplates',
    'DIRS': [os.path.join(BASE_DIR, 'build')],
    'APP_DIRS': True,
    'OPTIONS': {
        'context_processors': [
            'django.template.context_processors.debug',
            'django.template.context_processors.request',
            'django.contrib.auth.context_processors.auth',
            'django.contrib.messages.context_processors.messages',
            'social_django.context_processors.backends',
            'social_django.context_processors.login_redirect',
        ],
    },
},
]

STATICFILES_DIRS = [os.path.join(BASE_DIR, 'build/static')] 


STATIC_URL = '/static/'
STATIC_ROOT = os.path.join(BASE_DIR, 'static')
MEDIA_URL = '/media/'
MEDIA_ROOT = os.path.join(BASE_DIR, 'media')

gunicorn.service：

[Unit]
Description=gunicorn daemon
Requires=gunicorn.socket
After=network.target
[Service]
User=root
Group=www-data
WorkingDirectory=/root/liveimage
ExecStart=/root/venv/bin/gunicorn \
      --access-logfile - \
      --workers 3 \
      --bind unix:/run/gunicorn.sock \
      liveimage.wsgi:application
 [Install]
 WantedBy=multi-user.target

我的項目在 /root/liveimage 和 virtualenv 在 /root/venv 我不知道出了什么問題

Answer 1

Gunicorn 不會顯示樣式。

我找到了這個 ：

注意：管理界面不會應用任何樣式，因為 Gunicorn 不知道如何找到對此負責的靜態 CSS 內容。

從文檔

Answer 2

我真的不知道 Nginx 的配置，但這里的關鍵是 Django 在生產中不提供靜態文件，它們必須由 Nginx 提供。

在您的站點上，轉到瀏覽器的開發工具 -> 網絡 -> 單擊 css，然后查看 url。 它們必須以manage.py collectstatic生成的靜態目錄為目標，而 Nginx 必須從這些 url 提供該目錄的內容。