通過代理重定向Angular2 http請求

Question

我正在使用angular-cli bootstrapper創建Angular2應用程序，並使用webpack-dev-server進行調試。

對於某些類型的http請求，我想使用webpack-dev-server 代理支持將其重定向到另一個后端。

因此，我創建了proxy.conf.json文件：

{
  "/api/**": {
    "target": "http://localhost:4201",
    "secure": false
  }
}

並映射angular cli以使用此配置文件：

ng serve --proxy-config proxy.conf.json

啟動控制台消息后，通知我代理已成功創建：

NG Live Development Server在http：// localhost：4200上運行

創建的代理：/ api / **-> http：// localhost：4201

但是所有來自http://localhost:4200/api/users請求始終返回404狀態代碼。 我嘗試了許多映射網址的示例，但沒有幫助：

"/api/users" -> "http://localhost:4201/users"
"/api/" -> "http://localhost:4201/"

來自代理服務器的數據正在成功請求。 我做錯了什么？

Answer 1

我找到了解決方案。 我已經創建了簡單的快速服務器來記錄從代理服務器傳輸的所有請求，以檢查映射的工作方式。 我發現我對映射的理解有誤。

代替在配置文件中定義的嚴格映射：

/api/users => http://localhost:4201/users

使用以下規則的webpack代理服務器映射：

/api/users => http://localhost:4201/users/api/users

所以這里的解決方案是添加pathRewrite參數以排除前綴

{
  "/api/users": {
    "target": "http://localhost:4201",
    "secure": false,
    "pathRewrite": {"^/api" : ""}
  }
}