У меня есть серверная часть node.js, работающая на порту 5000, и мой реагирующий клиент, работающий на порту 3000 (http://localhost:3000). Реагирующий клиент имеет следующий URL-адрес в прокси-сервере package.json: http://localhost:5000 (внутренний URL-адрес)
Раньше я делал запросы API от клиента к бэкенду, используя axios на baseurl http://localhost:3000. Прокси выполнял свою функцию и проблем с корсом не было.
На бэкенде в app.js есть следующий блок кода:
app.use(function (req, res, next) {
// Website you wish to allow to connect
res.setHeader('Access-Control-Allow-Origin', 'http://localhost:3000')
// Request methods you wish to allow
res.setHeader('Access-Control-Allow-Methods', 'GET, POST, OPTIONS, PUT, PATCH, DELETE')
// Request headers you wish to allow
res.setHeader('Access-Control-Allow-Headers', 'X-Requested-With,content-type, Authorization')
// Set to true if you need the website to include cookies in the requests sent
// to the API (e.g. in case you use sessions)
res.setHeader('Access-Control-Allow-Credentials', true)
// Pass to next layer of middleware
next()
})
Теперь я решил перенести свой сайт на сервер VPS. Я установил туда nginx и вот что я написал в /etc/nginx/sites-available/default в блоке местоположения.
location / {
# First attempt to serve request as file, then
# as directory, then fall back to displaying a 404.
proxy_pass http://localhost:3000; #whatever port your app runs on
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;
}
С pm2 я запустил свой бэкэнд node.js и реагирующий клиент. Они работают на тех же портах, что и раньше.
Например, мой сервер теперь доступен на my-site.com. Когда вы переходите по URL-адресу, он открывает мой клиент. Пока все идет как надо. Однако, когда мой клиент обращается к моему бэкенду, я получаю такую ошибку:
GET http://127.0.0.1:3000/api/categories net::ERR_CONNECTION_REFUSED
Можете ли вы сказать мне, как это исправить и сделать так, чтобы мои запросы API выполнялись?
Ваш прокси-сервер React, вероятно, не работает на VPS. В любом случае, вместо этого было бы лучше использовать Nginx, поскольку прокси-сервер React предназначен только для использования в разработке.
Вы можете настроить Nginx для пересылки запросов пути /api
к приложению Node.js так же, как вы настроили корневой путь для приложения React.
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;
}