Question

在Angular CLI中，您可以使用--port命令设置自定义端口，例如--port=4201。

我需要做的是以某种方式获取此端口值，以便我可以指向我的代码中的正确服务器，但我无法找到这样的方式。

原因是因为如果我使用默认的4200：

export const environment = {
  production: false,
  host: 'http://localhost:4200'
}

然后，如果没有代码破坏，我将无法使用--port。

这可能吗？

Answer 1

如果你真的想让环境配置在构建时指向正确的端口，你需要设置一个能够获得正确端口的机制。

您可以创建自己的运行脚本（npm / sh / ...），将端口传递给该脚本。然后，该脚本将：

修改environment.ts文件中的端口
使用--port选项

如果您只想在运行时使用当前的主机/端口，可以使用

let host = `${window.location.protocol}//${window.location.host}`

Answer 2

如果您在应用启动后使用以下行更改端口，则无法使用。

export const environment = {
 production: false,
 host: 'http://localhost:4200'
}

但是如果你有.angular-cli.json文件，那么改变以下行来改变端口： { "defaults": { "serve": { "port": 8080 } } }

Answer 3

您可以使用以下命令获取端口号：

window.location.port // it will give you port number

let url = `${window.location.protocol}//${window.location.hostname}`

// if port is specified in the url then it will be shown to you
if(window.location.port) {
  url += `:${window.location.port}`
}

let html = document.getElementById("portDiv")
html.innerHTML = url;

<div id="portDiv"></div>

Angular CLI获取当前使用的端口

3 个答案: