在Angular.io中爲HTTP配置端口

我想創建一個angular.io應用程序，但其餘的API應該從不同的服務器端口傳遞。在Angular.io中爲HTTP配置端口

來自localhost：4200的角度內容，來自節點express服務器的數據在localhost：3000上獨立啓動。但是當我注入並使用'http'時，我如何配置要使用的端口？

弗蘭克

2017-02-07 fbenoit

你是否使用角度cli腳手架角項目？ –

是使用angular-cli。 – fbenoit

只需將其添加到URL

this.http.get('http://localhost:3000')

2017-02-07 21:17:05

當我在另一臺PC上運行該頁面時，這將不起作用，因爲本地主機然後不是服務器。我想我可以將它配置在一箇中心位置？ – fbenoit

然後從'window.location.href'獲取url並替換端口 –

假設你正在使用的角度CLI腳手架項目（我希望你），你應該已經有訪問不同環境設置。這些文件使您可以輕鬆地爲應用程序提供值，這些值可以根據運行的位置而有所不同。

environment.ts提供接口爲您的環境值，然後environment.qa.ts，environment.prod.ts，等（您可以根據需要創建儘可能多的環境）允許你指定對應於環境不同的值。

假設你有這樣的事情在你的環境文件：

export const environment = { 
    myEndpoint: 'localhost:3000' 
}

您可以運行或使用--env標誌才能獲得相應的價值構建應用程序：

ng build --env=qa

訪問在你的env config中定義的值很容易。在您的服務或組件只需添加一個導入的環境：

import { environment } from '../../environments/environment';

然後使用值：

this.http.get(environment.myEndpoint)

2017-02-07 22:09:30

，因此我配置了字符串「localhost：3000」，並且我可以在瀏覽器應用程序中訪問它。但從這裏「localhost」不是服務器？我錯過了什麼？ – fbenoit

更新您的環境配置以指向正確的服務器端點。對於你的開發環境，你可能希望它是localhost：3000。對於部署的環境，它顯然會有所不同 –

用某種方式得到「正確」的網址沒有工作的解決方案。
事實證明，這導致了一種情況，在其他服務器上看到一個http.put（...）作爲OPTIONS請求。

我找到了工作方式，通過從代理的角度服務器到服務器的休息：

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

的proxy.conf.json：

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

2017-02-07 22:30:26 fbenoit

回答