#laravel #vue.js #nginx #nuxt.js #reverse-proxy
#laravel #vue.js #nginx #nuxt.js #обратный прокси
Вопрос:
Мое приложение разделено как:
- Веб-сайт интерфейса Nuxt в репозитории
- Серверная часть Laravel И API в другом репозитории (тот же сервер)
Чего я пытаюсь добиться, так это разделить nginx на два серверных блока, чтобы:
- Nuxt обслуживается через порт 3000 (обратный прокси)
- Серверная часть Laravel обслуживается как обычная веб-страница php на порту 80
- API обслуживается на порту 8000, так что веб-сайт может извлекать данные
Это мои HTTP-конфигурации:
API и серверная часть
server {
listen 80;
return 301 https://$host$request_uri;
}
server {
listen 443 ssl;
root /var/www/api/public;
server_name api.website.com;
index index.php index.html;
location / {
try_files $uri $uri/ /index.php?$query_string;
}
location /api {
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_pass http://localhost:8000;
proxy_read_timeout 90;
proxy_redirect http://localhost:8000 https://api.website.com;
}
location ~ .php$ {
include snippets/fastcgi-php.conf;
fastcgi_pass unix:/run/php/php7.4-fpm.sock;
}
location ~ /.ht {
deny all;
}
ssl_certificate /etc/letsencrypt/live/api.website.com/fullchain.pem;
ssl_certificate_key /etc/letsencrypt/live/api.website.com/privkey.pem;
include /etc/letsencrypt/options-ssl-nginx.conf;
ssl_dhparam /etc/letsencrypt/ssl-dhparams.pem;
}
Веб-сайт
server {
listen 80;
return 301 https://$host$request_uri;
}
server {
listen 443 ssl;
server_name website.com www.website.com;
location / {
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_read_timeout 1m;
proxy_connect_timeout 1m;
proxy_pass http://127.0.0.1:3000;
}
ssl_certificate /etc/letsencrypt/live/www.website.com/fullchain.pem;
ssl_certificate_key /etc/letsencrypt/live/www.website.com/privkey.pem;
include /etc/letsencrypt/options-ssl-nginx.conf;
ssl_dhparam /etc/letsencrypt/ssl-dhparams.pem;
}
С этими настройками в nginx я получаю 403, когда пытаюсь связаться с бэк-офисом, и пока веб-сайт работает, я получаю тайм-аут шлюза («Произошла ошибка при попытке прокси-сервера») при любом запросе, который я делаю.
Как я могу это сделать, чтобы я мог:
- Перейдите к api.website.com и иметь Laravel Vue.js веб-сайт открыт
- Перейдите к website.com и открыть скомпилированный веб-сайт Nuxt и получить данные API из api.website.com:8000
- Оба они находятся под HTTPS
Любая помощь была бы высоко оценена.