如何允许从外部网络访问我的 Angular 8 应用程序？答案

【问题标题】：How to allow access to my Angular 8 app from outside network?如何允许从外部网络访问我的 Angular 8 应用程序？
【发布时间】：2019-11-25 17:54:05
【问题描述】：

我检查了我的 IP 地址并得到以下信息：在主机文件中我有： 127.0.0.1 localhost 我的wifi ip IPv4是：192.168.1.102

我尝试从 Angular 开始： ng serve --host 198.168.1.102 我得到了：

listen EADDRNOTAVAIL: address not available 198.168.1.102:4200
Error: listen EADDRNOTAVAIL: address not available 198.168.1.102:4200
    at Server.setupListenHandle [as _listen2] (net.js:1262:19)
    at listenInCluster (net.js:1327:12)
    at doListen (net.js:1460:7)
    at process._tickCallback (internal/process/next_tick.js:63:19)
    at Function.Module.runMain (internal/modules/cjs/loader.js:832:11)
    at startup (internal/bootstrap/node.js:283:19)
    at bootstrapNodeJSCore (internal/bootstrap/node.js:622:3)

知道我做错了什么吗？

这是带有转发条目的调制解调器/路由器菜单：

【问题讨论】：

您做错了，这不是您托管 Web 应用程序的方式。 ng serve 用于开发目的，不用于生产。购买域名和托管服务，您不想向世界开放您的 IP 地址。
我正在开发中，我需要允许访问网络应用

标签： angular ip wifi

【解决方案1】：

如果在您的网络之外您说的是通过互联网，则您必须从本地互联网盒转发端口。

您只需打开您的互联网盒子设置并将端口 80 转发到您设备的端口即可。对于节点服务器，它通常是端口 4000，但对于 ng serve，它是端口 4200。

完成后，只需打开您的public ip 地址。

不要犹豫，阅读ng serve doc 和port forwarding 解释。

【讨论】：

我已附上调制解调器菜单。你能告诉我需要在哪里配置转发以及如何配置吗？
@user2304483 可能是 NAT 转发
@user2304483 如果已解决，请将此问题设为已解决，更具可读性。

【解决方案2】：

对我来说 ng serve --host 0.0.0.0 有效，但要从外部访问您的应用程序，您必须知道您的公共 ip，198.168.1.102 是您的本地 ip - 在本地网络中

【讨论】：

我有来自我的 ISP 的连接 ip，但你确定我应该做 0.0.0.0 吗？

【解决方案3】：

首先，您需要一个可以从外部访问的公共 IP 地址（我假设您已经拥有它）。

然后你必须从外部转发一些端口，通过你的路由器和你的服务器。对于您的路由器，它可能在“NAT 转发”下。您很可能必须提供以下信息：

源端口或外部端口：您要用于从外部访问您的服务的端口（即您从外部访问，使用 8.8.8.8:444 > 444 是您的源端口）
目标或内部端口：您服务的本地端口，在这种情况下我想是 4200
目的IP地址：你的服务器的本地IP，在本例中为192.168.1.102

有些路由器无法区分源端口和目标端口，在这种情况下它们将是相同的。

【讨论】：

我试过这个没有成功，可以聊天吗？
很抱歉，我没有任何 IM 帐户。从更新的屏幕截图中，我看到您找到了正确的设置页面。但是，您指向的是错误的内部 IP 地址。这必须是托管您要访问的服务的设备的 IP 地址 (192.168.1.102)。然后，您应该能够使用您的外部公共 IP 地址通过 x.x.x.x:80 从您的网络外部访问（请查看whatismyip.com）。确保您的外部 IP 是公开的。如果您无法从外部访问您的 IP，则必须联系您的 ISP 并要求他们将其公开。