WebPack-DEV-сервер с серверной апи

Question

Я использую WebPack-DEV-сервер для angularjs приложения, я начинаю его от задачи в package.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" 
    }, 

У меня есть сервер бэкенд апи который использует Коа и работает на тот же порт:

const koa = require('koa'); 

app.listen(5000); 

module.exports.app; 

Когда сервер запущен КоА, он перехватывает все запросы, и я не могу просматривать угловое приложение браузера.

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

Answer 1

Да, вы можете использовать webpack-dev-сервер со своим собственным API-интерфейсом. Существует два способа сделать это:

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

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

Эта конфигурация гарантирует, что все запросы, начинающиеся с «/ API» отправляются на сервер бэкенд API (работает на локальном хосте: 8080 в данном случае), а не на Dev-сервер , Необязательно, если вам нужно, вы можете обойти прокси-сервер с функцией, например, так:

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

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

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