#python #reactjs #django #nginx #nginx-reverse-proxy
Вопрос:
Я пытаюсь развернуть приложение django на прокси-сервере ( otlart.com
, IP 111.22.333.44) и сделать его доступным с http://dome.com:8080/annotator
.
Страница django admin
и rest_framework
визуализация корректны, однако сборка react показывает пустую страницу, несмотря на отсутствие ошибок при загрузке страницы и скрипта.
Все страницы отображаются правильно, когда я получаю прямой доступ к 111.22.333.44:80.
Настройки dome.com
для прокси включены:
lt;VirtualHost *:8080gt; ServerName dome.com ServerAlias www.dome.com ServerAdmin scandav@example.com ErrorLog ${APACHE_LOG_DIR}/error.log CustomLog ${APACHE_LOG_DIR}/access.log combined ProxyRequests Off lt;Proxy *gt; Order deny,allow Allow from all lt;/Proxygt; ProxyPass /annotator http://111.22.333.44 ProxyPassReverse /annotator http://111.22.333.44 lt;Location /gt; Order allow,deny Allow from all lt;/Locationgt; lt;/VirtualHostgt;
Дерево папок приложений выглядит следующим образом:
📦app ┣ 📂backend ┃ ┣ 📂static ┃ ┃ ┣ 📂admin ┃ ┃ ┣ 📂css ┃ ┃ ┣ 📂js ┃ ┃ ┣ 📂media ┃ ┃ ┗ 📂rest_framework ┃ ┣ 📜__init__.py ┃ ┣ 📜....py ┃ ┣ 📜settings.py ┃ ┣ 📜urls.py ┃ ┗ 📜wsgi.py ┣ 📂frontend ┃ ┣ 📂build ┃ ┃ ┣ 📂static ┃ ┃ ┣ 📜asset-manifest.json ┃ ┃ ┣ 📜index.html ┃ ┃ ┗ 📜robots.txt ┣ 📂web_annotator ┃ ┣ 📂migrations ┃ ┣ 📜admin.py ┃ ┣ 📜apps.py ┃ ┣ 📜models.py ┃ ┗ 📜views.py ┗ 📜manage.py
Джанго settings.py
TEMPLATES = [ { 'BACKEND': 'django.template.backends.django.DjangoTemplates', 'DIRS': [ BASE_DIR / "frontend" / "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', ], }, }, ] STATIC_URL = '/static/' STATIC_ROOT = BASE_DIR / "backend" / "static" STATICFILES_DIRS = [BASE_DIR / "frontend" / "build" / "static", ]
Джанго urls.py
def render_react(request): return render(request, "index.html") urlpatterns = [ ... re_path(r"", render_react), re_path(r"^(?:.*)/?$", render_react), ]
После создания приложения react для работы с npm run build
запущенным collectstatic
, я запускаю сервер. Страница react отображается без ошибок (код состояния 200 от nginx) dome.com/annotator
, но она пуста! admin
и rest_framework
правильно визуализируйте.
Что это может быть?
nginx.conf
user nobody nogroup; worker_processes auto; events { worker_connections 512; } http { include /etc/nginx/mime.types; server { listen 80; server_name localhost; charset utf-8; client_max_body_size 1024M; location /static { root /usr/src/app/backend; } location / { proxy_pass http://web:8000; # dockerized django proxy_set_header Host $host; proxy_set_header X-Forwarded-Host $host:$server_port; proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for; } } }
Я перепробовал много комбинаций и посмотрел на stackoverflow, но ни одна не помогла.
Комментарии:
1. Есть ли запрос на загрузку react JS в инструментах разработки, и это как-то не удается? Вы подтвердили, что встроенное приложение react существует на сервере, где его ожидает apache?