ReactJS / Next.js: прокси-сервер CRA не работает с Next.js (попытка перенаправить запрос API на сервер Express)

Question

В настоящее время я обновляю ванильное приложение React для использования Next.js (версия 7.0.0).Приложение изначально было создано с помощью Create-React-App и использует прокси-сервер, встроенный в сервер CRA.

В процессе разработки мое приложение React работает на порт 3000 , и у меня работает сервер Express на порт 5000 .До добавления Next.js я использовал прокси-объект в файле package.json для маршрутизации запросов API на сервер.

APIзапрос:

const res = await axios.get('/api/request')

Прокси-объект в package.json:

"proxy": {
  "/api/*": {
    "target": "http://localhost:5000"
  }
}

Это прекрасно работало, но с Next.js ятеперь получаю ошибку:

GET http://localhost:3000/api/request 404 (Not Found)

^ Это должно указывать на locahost: 5000 (мой сервер)

Кто-нибудь знает, как я смогумаршрутизировать запросы API от клиента React / Next.js на сервер Express, работающий на другом порту?

Answer 1

ОК, так что я понял это.Вы можете создать прокси-сервер Node.js. для Express с помощью http-proxy-middleware

. Затем можно настроить параметр target для запросов прокси к нужному домену:

const proxy = require('http-proxy-middleware')

app.use('/api', proxy({ target: 'http://localhost:5000', changeOrigin: true }));