Запрос прокси API с использованием React Router

Question

Я пытаюсь настроить прокси для обработки запросов GET и POST.Я делал это много раз, не применяя реагирующий маршрутизатор в предыдущих приложениях реагирования, и он прекрасно работает, однако, так как это приложение использует реагирующий маршрутизатор, происходит сбой.

Прокси-сервер не работает, вместо этого он пытается выполнить вызов на локальном домене:

ok: false
redirected: false
status: 500
statusText: "Internal Server Error"
url: "http://localhost:3001/api/call"

Я не делаю ничего необычного с моим маршрутизатором реакции:

<Router history={history}>
    <Switch>
        <Route path="/" component={Home} />
        <Route path="about" component={About} />
    </Switch>
</Router>

Вот прокси (в setupProxy.js):

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

module.exports = function(app) {
  app.use(proxy('/api/call', { target: "http://www.domain.com.au/", changeOrigin: true } ));
};

Вот пример того, как он используется:

add(data) {

    this.setState({button: "loading"})

    fetch('/api/call', {
        method: "POST",
        headers: {
            "Content-Type": "application/json"
        },
        body: JSON.stringify(data)
    })
    .then(res => this.setState({success: res.ok}))
    .catch(err => this.setState({success: false}))

}

Нужно ли что-то делать, чтобы сделатьэто работает при использовании реакции-роутера?

Answer 1

Код в вопросе работает без проблем.Когда запрос прокси-сервера возвращает ошибку, он отображает это как исходящий из localhost, а не из URL-адреса прокси.