CRITICAL FIX: Static files (CSS/JS) not loading after changing web:8000 to localhost:8000 Changes: - nginx-smartsoltech.conf: Enabled /static/ and /media/ locations BEFORE location / - NGINX_SETUP.md: Updated config to serve static files directly from filesystem - NGINX_STATIC_FIX.md: Comprehensive troubleshooting guide for static files issues Why this matters: - Nginx must serve /static/ and /media/ DIRECTLY from filesystem (fast) - NOT proxy to Django (slow) - Order matters: location /static/ MUST be before location / - Improves performance: 50-100ms → 1-5ms per static file request Solution on server: 1. git pull origin master 2. sudo cp nginx-smartsoltech.conf /etc/nginx/sites-available/smartsoltech 3. sudo nginx -t && sudo systemctl reload nginx
8.6 KiB
8.6 KiB
🔧 Исправление проблемы со статикой в Nginx
❌ Проблема
После изменения web:8000 на localhost:8000 в Nginx не загружаются стили (CSS) и скрипты (JS).
💡 Причина
Nginx НЕ должен проксировать запросы /static/ и /media/ к Django. Он должен отдавать эти файлы напрямую из файловой системы для максимальной производительности.
✅ Решение 1: Автоматическое (рекомендуется)
# На сервере
cd /opt/smartsoltech_site
# Получить исправленный конфиг
git pull origin master
# Скопировать исправленный конфиг
sudo cp nginx-smartsoltech.conf /etc/nginx/sites-available/smartsoltech
# Проверить конфигурацию
sudo nginx -t
# Перезагрузить Nginx
sudo systemctl reload nginx
# Проверить статику
curl -I http://smartsoltech.kr/static/assets/css/styles.min.css
✅ Решение 2: Ручное исправление
Шаг 1: Отредактировать конфиг Nginx
sudo nano /etc/nginx/sites-available/smartsoltech
Шаг 2: Найти и ЗАМЕНИТЬ секцию location
НАЙТИ (старая версия):
# Прокси к Django приложению
location / {
proxy_pass http://localhost:8000;
...
}
# Статические файлы (опционально, если выносить из Docker)
# location /static/ {
# alias /opt/smartsoltech_site/smartsoltech/staticfiles/;
# ...
ЗАМЕНИТЬ НА (новая версия):
# Статические файлы - ВАЖНО: должны быть ПЕРЕД location /
location /static/ {
alias /opt/smartsoltech_site/smartsoltech/staticfiles/;
expires 30d;
add_header Cache-Control "public, immutable";
access_log off;
}
# Медиа файлы
location /media/ {
alias /opt/smartsoltech_site/smartsoltech/media/;
expires 7d;
add_header Cache-Control "public";
access_log off;
}
# Прокси к Django приложению
location / {
proxy_pass http://localhost: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;
proxy_redirect off;
proxy_buffering off;
# Таймауты
proxy_connect_timeout 60s;
proxy_send_timeout 60s;
proxy_read_timeout 60s;
}
Шаг 3: Проверить права на директории
# Проверить, что Nginx имеет доступ к staticfiles
ls -la /opt/smartsoltech_site/smartsoltech/staticfiles/
# Если нет прав, установить:
sudo chmod -R 755 /opt/smartsoltech_site/smartsoltech/staticfiles/
sudo chown -R www-data:www-data /opt/smartsoltech_site/smartsoltech/staticfiles/
Шаг 4: Проверить и перезагрузить
# Проверить конфигурацию
sudo nginx -t
# Должно быть:
# nginx: the configuration file /etc/nginx/nginx.conf syntax is ok
# nginx: configuration file /etc/nginx/nginx.conf test is successful
# Перезагрузить Nginx
sudo systemctl reload nginx
🧪 Проверка что всё работает
Проверка 1: Тест статических файлов
# Проверить CSS
curl -I http://smartsoltech.kr/static/assets/css/styles.min.css
# Должно быть:
# HTTP/1.1 200 OK
# Content-Type: text/css
# Проверить JS
curl -I http://smartsoltech.kr/static/assets/js/script.min.js
# Должно быть:
# HTTP/1.1 200 OK
# Content-Type: application/javascript
Проверка 2: Логи Nginx
# Открыть в браузере http://smartsoltech.kr
# Затем проверить логи:
sudo tail -f /var/log/nginx/smartsoltech_access.log
# Должны быть строки типа:
# GET /static/assets/css/styles.min.css HTTP/1.1" 200
# GET /static/assets/js/script.min.js HTTP/1.1" 200
Проверка 3: В браузере
- Открыть http://smartsoltech.kr
- Нажать F12 (Developer Tools)
- Перейти на вкладку Network
- Обновить страницу (Ctrl+R)
- Проверить что все файлы
/static/...возвращают 200 OK
🎯 Важные замечания
⚠️ Порядок location имеет значение!
# ✅ ПРАВИЛЬНО (static ПЕРЕД /)
location /static/ { ... }
location /media/ { ... }
location / { ... }
# ❌ НЕПРАВИЛЬНО (static ПОСЛЕ /)
location / { ... }
location /static/ { ... } # НЕ СРАБОТАЕТ!
⚠️ Путь должен совпадать с STATIC_ROOT в Django
# В settings.py должно быть:
STATIC_ROOT = '/app/staticfiles' # Внутри контейнера
STATIC_URL = '/static/'
# Но Nginx смотрит на хост:
alias /opt/smartsoltech_site/smartsoltech/staticfiles/;
⚠️ После collectstatic нужно проверять права
# После каждого collectstatic
docker exec django_app python smartsoltech/manage.py collectstatic --noinput
# Проверить права
ls -la /opt/smartsoltech_site/smartsoltech/staticfiles/
# Если нужно, исправить:
sudo chown -R www-data:www-data /opt/smartsoltech_site/smartsoltech/staticfiles/
🔍 Диагностика проблем
Если статика всё ещё не загружается:
# 1. Проверить что файлы существуют
ls -la /opt/smartsoltech_site/smartsoltech/staticfiles/assets/css/
# 2. Проверить права
sudo -u www-data cat /opt/smartsoltech_site/smartsoltech/staticfiles/assets/css/styles.min.css
# 3. Проверить логи ошибок Nginx
sudo tail -f /var/log/nginx/smartsoltech_error.log
# 4. Проверить конфигурацию Nginx
sudo nginx -T | grep -A 10 "location /static"
# 5. Тест напрямую через curl
curl http://localhost/static/assets/css/styles.min.css
Если получаете 404:
# Проверить что staticfiles собраны
docker exec django_app ls -la /app/staticfiles/
# Если пусто, собрать заново:
docker exec django_app python smartsoltech/manage.py collectstatic --noinput --clear
# Проверить что том правильно примонтирован
docker inspect django_app | grep -A 5 "Mounts"
Если получаете 403 Forbidden:
# Проверить права
ls -la /opt/smartsoltech_site/smartsoltech/
ls -la /opt/smartsoltech_site/smartsoltech/staticfiles/
# Установить правильные права
sudo chmod -R 755 /opt/smartsoltech_site/smartsoltech/staticfiles/
sudo chown -R www-data:www-data /opt/smartsoltech_site/smartsoltech/staticfiles/
# Перезагрузить Nginx
sudo systemctl reload nginx
📊 Проверка производительности
До исправления (Django отдаёт статику):
Static file request: ~50-100ms
Server load: HIGH
После исправления (Nginx отдаёт статику):
Static file request: ~1-5ms ✅
Server load: LOW ✅
✅ Итоговый чеклист
- location /static/ добавлен ПЕРЕД location /
- location /media/ добавлен ПЕРЕД location /
- Путь alias правильный (/opt/smartsoltech_site/smartsoltech/staticfiles/)
- sudo nginx -t успешно
- sudo systemctl reload nginx выполнен
- Права на staticfiles/ корректны (755, www-data)
- curl -I http://smartsoltech.kr/static/... возвращает 200
- Браузер загружает стили и скрипты
- Логи Nginx показывают 200 для /static/
- Сайт выглядит правильно
Создано: 24 ноября 2025 г.
Проблема: Статика не загружается после изменения web:8000 на localhost:8000
Решение: Nginx должен отдавать /static/ и /media/ напрямую из файловой системы