Не работает http-proxy-middleware приложения React App - PullRequest
0 голосов
/ 17 октября 2019

Итак, я настроил прокси в своем приложении create-react-app, используя http-proxy-middleware. Я уверен, что следовал инструкциям к письму, но я продолжаю получать 404 каждый раз, когда пытаюсь нажать на соответствующую ссылку.

Я использую create-react-app v3.2.

Вот мой setupProxy.js файл:

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

module.exports = function(app) {
    app.use(proxy("/api", { target: "http://localhost:3090" }));
};

Вот создатель действия, который делает запрос http

export const signIn = formProps => async dispatch => {
    try {
        const response = await axios.post("/api/login", formProps);

        //.....etc, etc
    } catch(e) {

        //.....etc,etc
    }
}

А вот соответствующий маршрут на моем экспресс-сервере:

app.post("/login", requireSignIn, Authentication.login);

Когда сервер разработки запускается, я получаю следующее сообщение:

[HPM] Proxy created: /api  -> http://localhost:3090

Итак, CRA явно подхватывает setupProxy.js, но где-то что-то не так. Я попытался добавить символы подстановки в настройку прокси (например, "/ api / *"), но не повезло. Я получаю следующие 404 зарегистрированных в моей консоли на стороне клиента:

POST http://localhost:3000/api/login 404 (Not Found)

, что относится к localhost:3000, предполагая, что прокси (который должен перенаправить на localhost:3090) не используется.

Я не могу не думать, что здесь есть что-то действительно простое, что мне не хватает, но сейчас я рву на себе волосы, пытаясь заставить это работать.

Любая помощь будет очень признательна.

Спасибо!

1 Ответ

0 голосов
/ 17 октября 2019

Нашел ответ на этот вопрос - и, как и ожидалось, это была простая ошибка.

Маршруты на моем экспресс-сервере были следующими:

app.post("/login", requireSignIn, Authentication.login);

Тогда как они должны было:

app.post("api/login", requireSignIn, Authentication.login);

Проблема решена!

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...