webpack-dev-сервер с серверным api

Я использую webpack-dev-server для приложения angularjs, я запускаю его из задачи в пакете.json вот так:

  "scripts": {
    "start-api": "node api/server.js",
    "dev": "webpack-dev-server --env dev --history-api-fallback --inline --progress --port 5000",
    "start": "npm run dev"
  },

у меня есть сервер API-интерфейса, который использует koa и работает на том же порту:

const koa = require('koa');

app.listen(5000);

module.exports.app;

когда сервер koa запущен, он перехватывает все запросы, и я не могу перейти к приложению angular browser.

должен ли я обслуживать все от koa или есть способ заставить их работать вместе?

1 ответов


Да, вы можете использовать webpack-dev-server со своим собственным бэкэндом API. Есть два способа сделать это:

во-первых, вы можете настроить dev-сервер, чтобы использовать прокси. Это решение, которое я использую, и оно хорошо работает для меня. Моя конфигурация выглядит примерно так:

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

эта конфигурация гарантирует, что все запросы, начинающиеся с "/api", отправляются на сервер API бэкэнда (работающий на localhost:8080 в этом случае), а не на dev-сервер. При необходимости можно обойти прокси с помощью функции, например:

proxy: {
  "/api/*": {
    target: "http://localhost:8080",
    bypass(req, res) {
      return (/* some condition */) ? '/index.html' : false;
    }
  }
}

но мне никогда не нужно было использовать это, так как ключ"/ api / * " - это все, что мне нужно, чтобы каждый запрос отправлялся на правильный сервер.

важно отметить, что у вас должны быть два сервера, работающие на разных портах. Обычно я использую 8080 для своего бэкэнда и 9090 для dev-сервера.