Angular 6项目和Wamp Server无法从同一网络上的其他计算机访问该项目

时间:2018-10-18 09:07:21

标签: angular localhost wamp angular6 wampserver

我正在将wampserver用作我的角度应用程序的本地服务器。

我已经使用ng build --prod --aot命令构建了我的应用程序。然后,我打开dist文件夹,并将其放置在名为angular.local的虚拟主机中,该主机在httpd-vhosts.conf配置文件中具有以下脚本:

<VirtualHost *:80>
    ServerName angular
    DocumentRoot "c:/wamp64/www/angular"
    <Directory  "c:/wamp64/www/angular/">
        #Options +Indexes +Includes +FollowSymLinks +MultiViews
        #AllowOverride All
        #Require local
        Allow from 127.0.0.1
        Allow from 192.168.0.140
        Require all granted
    </Directory>
</VirtualHost>

192.168.0.140是要从中访问应用程序的用户笔记本电脑的网络IP地址。

在服务器system32主机文件上,我添加了以下行:

192.168.0.109 angular.local
::1 angular.local

192.168.0.109是服务器的IP地址。

当用户尝试使用链接访问应用程序时:

http://192.168.0.109/angular/

我们可以在谷歌浏览器chrome标签上看到应用程序的标题,但在控制台上有3个错误:

enter image description here

找不到运行时,样式和主要Java脚本文件的地方。

我在服务器angular文件夹中检查了它们,并且它们确实存在。

我所做的与提到的in this link相同。

我在项目文件夹中存在.htaccess。

我可以使用http://192.168.0.109/访问本地主机页面。

我尝试使用以下链接,但无效:

  

http://angular.local/

有什么想法吗?

2 个答案:

答案 0 :(得分:1)

您正在使用APache 2.2语法和Apache 2.4语法来混淆APache。因此,请坚持使用Apache 2.4语法。

您的ServerName也应为ServerName angular.local

<VirtualHost *:80>
    ServerName angular.local
    DocumentRoot "c:/wamp64/www/angular"
    <Directory  "c:/wamp64/www/angular/">
        Options +Indexes +Includes +FollowSymLinks +MultiViews
        AllowOverride All
        Require local
        Require ip 192.168.0.140
    </Directory>
</VirtualHost>

还有dev.local的另一个VH,因此假设它位于dev下的名为www的文件夹中

<VirtualHost *:80>
    ServerName dev.local
    DocumentRoot "c:/wamp64/www/dev"
    <Directory  "c:/wamp64/www/dev/">
        Options +Indexes +Includes +FollowSymLinks +MultiViews
        AllowOverride All
        Require local
        Require ip 192.168.0.140
    </Directory>
</VirtualHost>

如果您想允许本地网络中的任何IP地址使用,请使用我们而不是上面的IP地址

Require ip 192.168.0

您还必须将域名添加到其他PC上的HOST文件中,假设WAMPServer在IP 192.168.0.10上运行

192.168.0.10 angular.local
192.168.0.10 dev.local

答案 1 :(得分:1)

使用以下代码:

<VirtualHost *:80>

 ServerName servername.com
 DocumentRoot path/to/dist

 <Directory "path/to/dist">
    Options Indexes FollowSymLinks
    AllowOverride all
    Require all granted
 #   Require local
 </Directory>

</VirtualHost>

我有相同的角度应用程序,使用ng build构建,并将dist文件夹添加到apache2及更高版本中,这是我的 vhosts.conf 文件。为我完美地工作。