如何確認Angular App代理正常工作（v7）

Question

我的Angluar應用程序api與應用程序在ng serve在（ :4200 ）上運行的端口不同（ :8087 ）。

我正在嘗試獲取對api的請求，例如： /api/settings轉到http://localhost:8087/api/settings而不是http://localhost:4200/api/settings 。

我曾嘗試設置代理服務器以及類似的東西： https : //angular.io/guide/build#proxying-to-a-backend-server，但是某些方法不起作用，我不太了解足以知道我應該期待什么。

通過http://localhost:8087/api/settings直接聯系API時，得到了預期的響應。

我使用ng serve運行該應用程序。

proxy.conf.json：

    {
      "/api/*": {
        "target": "http://localhost:8087",
        "secure": false,
        "changeOrigin": true,
        "logLevel": "debug"
      }
    }

    [HPM] GET /api/store/categories -> http://localhost:8087
    [HPM] GET /api/store/cart -> http://localhost:8087
    [HPM] GET /api/settings -> http://localhost:8087

瀏覽器中的網絡請求顯示為“ Request URL: http://localhost:4200/api/settings ...”，但我不確定這是否應反映其他端口。 應該是？

Angular CLI：7.0.6 | 節點：8.11.1 | 操作系統：win32 x64 | 角度：7.0.4

實際發生的情況是，我陷入了一個永無休止的循環中，一個循環回到另一個循環（這可能是路由的問題，但是我需要確認代理是否工作正常，應該首先這樣做）。

Answer 1

嘗試將配置更改為以下內容：

{
  "/api": {
    "target": "http://localhost:8087",
    "secure": false,
    "logLevel": "debug"
  }
}

您不需要changeOrigin因為此開發設置中的API也位於localhost 。 如果您正在調用某種外部API，則可能有必要，但是當服務器和客戶端都在localhost上時則不需要。

回答有關如何確定其是否有效的問題。 從組件/服務/等執行對這些相應端點的API調用，並查看是否獲得了期望的數據。 即使設置了級別“調試”，記錄器也不會顯示此信息。 瀏覽器開發人員工具的“網絡”標簽不會顯示對http://localhost:8087/呼叫，而是顯示http://localhost:4200/ 。 如果您可以從終結點計算機接收數據，則表明它可以正常工作。

如果要增強日志輸出以顯示完整路徑，可以考慮使用http-proxy-middleware事件，例如onProxyReq()和onProxyRes() 。

希望有幫助！