Для настройки NGINX в качестве обратного прокси-сервера для MERN (MongoDB, Express, React, Node.js) стека, нужно создать конфигурационный файл NGINX, который будет обрабатывать запросы и перенаправлять их на соответствующие порты вашего серверного и клиентского приложений.
Вот шаги и пример конфигурационного файла для настройки NGINX:
1. Установите NGINX
Если NGINX еще не установлен, установите его с помощью команд:
sudo apt update
sudo apt install nginx
2. Настройте серверное и клиентское приложения
Убедитесь, что ваше серверное приложение (Node.js с Express) работает на порту, например, 5000, а клиентское приложение (React) собрано и развернуто в директории, например, /var/www/react-app.
3. Создайте конфигурационный файл NGINX
Создайте новый конфигурационный файл или отредактируйте существующий файл в директории /etc/nginx/sites-available/. Например, создайте файл mern-app:
sudo nano /etc/nginx/sites-available/mern-app
4. Добавьте следующую конфигурацию
server {
listen 80;
server_name your_domain_or_ip;
location / {
root /var/www/react-app;
try_files $uri /index.html;
}
location /api {
proxy_pass http://localhost:5000;
proxy_http_version 1.1;
proxy_set_header Upgrade $http_upgrade;
proxy_set_header Connection 'upgrade';
proxy_set_header Host $host;
proxy_cache_bypass $http_upgrade;
}
error_page 500 502 503 504 /50x.html;
location = /50x.html {
root /usr/share/nginx/html;
}
}
5. Активируйте конфигурацию
Создайте символическую ссылку на файл в директории /etc/nginx/sites-enabled/:
sudo ln -s /etc/nginx/sites-available/mern-app /etc/nginx/sites-enabled/
6. Перезапустите NGINX
Перезапустите NGINX для применения изменений:
sudo systemctl restart nginx
Пояснения конфигурации
- server_name: Замените your_domain_or_ip на ваш домен или IP-адрес.
- location /: Настраивает обработку запросов к корню вашего домена, отдавая статические файлы из директории, где развернут ваш React-приложение.
- location /api: Настраивает обратное проксирование запросов к вашему серверному приложению. Все запросы к /api будут перенаправлены на серверное приложение, работающие на http://localhost:5000.
Теперь ваш NGINX сервер настроен для работы с MERN стеком, обеспечивая обратное проксирование запросов и раздачу статических файлов.