在运行 Angular/cli 开发服务器 c9.io 时“无效主机头”

当前指挥部: ng serve --host --public $IP:$PORT

我网站上的结果:

无效的主机头

150882 次浏览
小开

参见 这个问题

中编辑以下行 node_modules/webpack-dev-server/lib/Server.js(第425行) ，改为:

return true;

我使用的是 Cloud9 IDE，然后运行: ng serve --port 8080 --host 0.0.0.0。 现在好了。

小开

您需要运行以下命令:

ng serve --port 8080 --publicHost 123.34.56.78 // your server ip or host name.

我没问题。

小开

您需要指定主机

ng serve --port 8080 --host 123.34.56.78
小开

多亏了 Mateusz Sawa，这个问题实际上在 youtube 的一个视频评论中得到了解决

去 给你看看。

在 package 中指定主机 json 不再工作了

只是要注意，这是没有必要使用视频中使用的命令，下面的指令足以使应用程序工作使用常规 angular-cli开发

首先，您需要在 等等/文件夹中找到 接待员

在控制台中键入 cd ..，直到您到达 linux 机器的根目录，并始终使用 ls检查列出的内容

如果您看到 接待员文件，那么您就处于正确的位置，然后使用 sudo vi hosts编辑它

在所有 ip 地址“0.0.0.0 Yourworkspace-yourusername.c9users.io”下面添加一行(当然没有引号: ——)

也在 package.json change 里 “开始”: “ ng 服务-H Yourworkspace-yourusername.c9users.io”

然后你只需要转到应用程序文件夹，用 npm start启动终端中的应用程序

刚刚检查过了，成功了

小开

参考: https://github.com/angular/angular-cli/issues/6070

使用公共标志。例如: ng serve --host <workspace>-<username>.c9users.io --public

小开

使用下面的命令和最新版本的 Angular CLI 对我来说是可行的。

ng serve --host 0.0.0.0 --public-host <workspace>-<username>.c9users.io
小开

如果需要从 Cloud9运行，则 --disable-host-check标志可以正常工作。

我使用以下命令:

ng serve --open --host $IP --port $PORT --disable-host-check
小开

使用下面的命令对我有用。

ng serve --host 0.0.0.0 --port 8080  --public ipAddress
小开

我得到了同样的错误。公共期权为我解决了如下问题:

ng serve --host 0.0.0.0 --port 8080 --live-reload-port 8081 --public $C9_HOSTNAME
小开

您只需将0.0.0.0更改为您的本地 IP 地址，如192.168.1.42，就可以了。

ng serve --host 192.168.1.42
小开

问题是您只能访问在—— public 参数中指定的链接。在我的例子中，我提供了公开的 IP 地址，并试图使用针对该 IP 注册的域访问它。但 ng 将它绑定到唯一提供的主机—— public。

为了解决这个问题，我提供了另一个参数: disable-host-check。 完成指令: ng serve --disable-host-check --host 0.0.0.0 --port 3100 --public x.x.x.x

了解更多，点击这里

小开

当我试图使用 localtunnel实用程序访问我们的应用程序时，出现了这个错误。

@ tarn 关于在 ng serve命令中添加 --disableHostCheck true的建议(来自对已接受答案的评论)起到了作用。

小开

如果还有人困在 invalid host header问题上，以下是解决办法:

运行 ng eject它将创建 webpack.config.js。 如果是请求，运行 npm install。 在 webpack.config.js中将下面的 "disableHostCheck":true添加到 devServer，如下所示:

"devServer": {
"historyApiFallback": true,
"disableHostCheck" : true //<-- add this line
}

然后在 package.json文件中更改 start选项下的 ng，如下所示

"start": "webpack-dev-server --host 0.0.0.0 --port YOURPORT --public YOURIP:YOURPORT"

现在用 npm start命令运行角度。 就是这样。

小开

在 AWS EC2实例上部署角度应用程序后，我面临着同样的错误。然后我用下面的命令启动了我的应用程序，它工作得很好。

ng serve --host 0.0.0.0 --port 8080 --disableHostCheck true
小开

下面两种解决方案都可以使用:

ng serve --public --host yourip --port yourportnumber

ng serve --host 0.0.0.0 --port yourport --disableHostCheck true

小开

使用下面的命令为我工作的角度 CLI: 6.0.7

ng serve --host 0.0.0.0 --port 8080 --disableHostCheck
小开

在以下版本的 Angular 和服务器 Amazon 上进行了测试。

Angular CLI: 6.0.8
Node: 8.11.3
OS: linux x64
Angular: 5.2.8

Ng 命令选项已更改，现在使用 configuration而不是 env

 ng serve --configuration=dev  --port 4009 --host 0.0.0.0 --publicHost myhost.com

永远不要在公共服务器上使用 --disable-host-check。如果你用这个 Angular 会警告你的。这可能有效，但这是一个严重的安全问题。如果您使用该标志，您将收到此消息。

警告: 运行一个带有—— able-host-check 的服务器是一种安全性 冒险，看 Https://medium.com/webpack/webpack-dev-server-middleware-security-issues-1489d950874a 了解更多信息。

请花些时间阅读那篇值得一读的文章。

小开

将文件“ node _ module/webpack-dev-server/lib/Server.js”中的第425行从 false 更改为 true,

之前: 返回假;

更新: 返回真实;

小开

在我的例子中，我使用我的主机名来更新/etc/hosts 文件。

vi /etc/hosts

并添加您的主机名最后一行。

127.0.0.1 myHostName.com

连接我的服务器,

ng serve -o

连接到 MyHostName.com: 4200时发生错误。

所以我喜欢这样,

ng serve --host 0.0.0.0 --disableHostCheck true

重新连接到 MyHostName.com: 4200:)

小开

这对我有用:

ngrok http --host-header=rewrite PORT

例如:

ngrok http --host-header=rewrite 4200
小开

试试这个

ng serve --host <private IP> --port <host port> --public-host <public IP>
小开

在 angular.json 中，在 架构师-> 服务-> 选项下添加以下内容

"disableHostCheck": true

从这个 Github 主页得到了答案

小开

Ng service —— host 0.0.0.0—— port 1234—— public-host mydomain.com

这对我有用。

小开

请不要对开发服务器使用 --disable-host-check标志！

这是一个主要的安全问题: 一些恶意代码可以代表您请求开发服务器并获得响应。问题在于开发服务器还会发送应用程序的源代码，因此基本上，如果您使用该标志，就可以访问正在构建的应用程序的代码。

试试这个:

ng serve --public-host my.dev.host.com

更多详细信息请点击这里: Webpack-dev-server/中间件安全问题

小开

除了@ruwan800的 回答之外，最好随时启用主机检查，这样可以防止使用 DNS 重新绑定的攻击。

Https://medium.com/webpack/webpack-dev-server-middleware-security-issues-1489d950874a

要解决你的问题，检查你是否完全访问你的主机 IP。这是一个可能的原因。

如果这不能解决您的问题，那么在您自己的风险，您可以禁用主机检查在您的角度配置。不过我建议你只为本地机器做这件事。

如果您选择这样做，只需在 angular.json中的 dev 配置下将 disable host check 设置为 true。
就是在 architect -> serve -> configurations -> development, 设定 disableHostCheck: true

比如:

"architect": {
//...
"serve": {
//...
"configurations": {
//...
"development": {
//...
"disableHostCheck": true
}
},
},
//...
}

这样，它只在开发模式下运行时禁用，而在服务器上部署时不禁用。


提交答案