Webpack несколько прокси не работает - ошибка 404 - PullRequest
Новая
       18

Webpack несколько прокси не работает - ошибка 404

0 голосов
/ 02 октября 2018

Я пытаюсь настроить несколько прокси в моем проекте.У меня есть два проекта на местном уровне.В одном из них мне нужно получить данные из двух удаленных бэкэндов этих двух проектов.Я настроил файл веб-пакета следующим образом: 

var options = {
  contentBase: "src/client",
  proxy: {
    "fpHandling/api/**": {
      target: "http://localhost:8030",
      secure: false,
    },
    "fpCase/api/**": {
        target: "http://localhost:8080",
        secure: false,
    },
  },
  publicPath: config.output.publicPath,
  hot: true,
  noInfo: true,
  historyApiFallback: false,
  stats: {
    colors: true,
  },
};

var wds = new WebpackDevServer(webpack(config), options);

wds.listen(9999, 'localhost', function(err) {
  if (err) {
      return console.log(err); //NOSONAR
  }

  console.log('Listening at http://localhost:9999/');
});

Но я не могу получить данные из удаленного бэкэнда fpCase/api/, я получаю 404 ошибку.Но та же самая конечная точка работает в другом проекте, где у меня есть только один прокси, который настроен так: 

proxy: {
    "**/api/**": {
      target: "http://localhost:8080",
      secure: false,
    },
  },
var wds = new WebpackDevServer(webpack(config), options);

wds.listen(9000, 'localhost', function(err) {
  if (err) {
      return console.log(err); 
  }

  console.log('Listening at http://localhost:9000/');
});

В консоли я вижу, что запрос отправляется на порт, который 

Request URL: http://localhost:9999/fpCase/api/

Полагаю, проблема в портах, поскольку порт сервера, на котором выполняется проект, равен 9999, а порт назначения - 8080.В другом проекте, который может достичь этой конечной точки, порт установлен на 9000 и там он работает.Что я делаю не так, как мне настроить несколько прокси, чтобы я мог получать данные из обоих бэкэндов?

1 Ответ

0 голосов
/ 08 октября 2018

Если я правильно понимаю вашу проблему, то решение должно состоять в том, чтобы «переписать запросы» к вашему прокси-серверу, используя параметр pathRewrite для каждого прокси-сервера.

Так, например, если ваше приложение отправляет запрос на маршрут в /fpHandling/api/*, то вы хотите, чтобы этот запрос был переведен в эквивалент http://localhost:9999/*.

Для этого вы можете обновить конфигурацию опций следующим образом: 

var options = {
  contentBase: "src/client",
   proxy: {

       "/fpHandling/api/*": {
           target: "http://localhost:9999",
           secure: false,
           pathRewrite: { '^/fpHandling/api': '' }
       },

       "/fpHandling/spark/*": {
           target: "http://localhost:9999",
           secure: false,
           pathRewrite: { '^/fpHandling/spark': '' }
        },

        "/fpCase/api/*": {
           target: "http://localhost:8888",
           secure: false,
           pathRewrite: { '^/fpCase/api': '' }
        }
  },
  publicPath: config.output.publicPath,
  hot: true,
  noInfo: true,
  historyApiFallback: false,
  stats: {
    colors: true,
  },
};

Надеюсь, это поможет!

...