局域网内访问虚拟机 web 服务器

╰+哭是因爲堅強的太久メ 2023-10-02 13:56 66阅读 0赞

用 vue 脚手架生成了一个项目做简单测试，简单说一下搭建流程，使用一种即可  
详细过程可参考 ：[https://blog.csdn.net/qq\_61541602/article/details/125215221][https_blog.csdn.net_qq_61541602_article_details_125215221]

# vue-cli >= 3 模板
    npm install -g @vue/cli
    vue create my-project
    npm run serve
    # 2.x模板(旧版本)
    npm install -g @vue/cli-init
    vue init webpack my-project
    npm run dev

###### 一、我的网络使用 NAT 模式，主机 IP 192.168.3.220，虚拟机 IP 192.168.1.3 ######

###### 主机 192.168.3.220 ######

![在这里插入图片描述][08428cc081934d5c9aead3d9fcd62c0b.png]

###### 虚拟机 192.168.1.3 ######

![在这里插入图片描述][watermark_type_ZHJvaWRzYW5zZmFsbGJhY2s_shadow_50_text_Q1NETiBA5LiN5oeC5LiA5LyR_size_20_color_FFFFFF_t_70_g_se_x_16]

###### 二、保证主机和虚拟机之间能相互 ping 通 ######

###### 主机 ping 虚拟机 ######

![在这里插入图片描述][81dbdf3ff2554a8ca84451dcc9d8a510.png]

###### 虚拟机 ping 主机 ######

![在这里插入图片描述][48150c4e2cf549819dd744dd8b8f695d.png]

###### 三、保证虚拟机项目能正常运行 ######

![在这里插入图片描述][watermark_type_ZHJvaWRzYW5zZmFsbGJhY2s_shadow_50_text_Q1NETiBA5LiN5oeC5LiA5LyR_size_20_color_FFFFFF_t_70_g_se_x_16 1]

###### 四、解决方法 ######

###### 1、关闭防火墙 ######

简单粗暴实现方式就是虚拟机关闭防火墙

systemctl stop firewalld.service

主机访问测试  
![在这里插入图片描述][watermark_type_ZHJvaWRzYW5zZmFsbGJhY2s_shadow_50_text_Q1NETiBA5LiN5oeC5LiA5LyR_size_20_color_FFFFFF_t_70_g_se_x_16 2]

###### 2、开启主机端口映射 ######

开启主机端口映射目的：

*  可以使用主机 IP 访问虚拟机 web 服务器
 *  和主机处于同一个局域网的都可以访问  
    ![在这里插入图片描述][watermark_type_ZHJvaWRzYW5zZmFsbGJhY2s_shadow_50_text_Q1NETiBA5LiN5oeC5LiA5LyR_size_20_color_FFFFFF_t_70_g_se_x_16 3]  
    访问测试  
    ![在这里插入图片描述][watermark_type_ZHJvaWRzYW5zZmFsbGJhY2s_shadow_50_text_Q1NETiBA5LiN5oeC5LiA5LyR_size_20_color_FFFFFF_t_70_g_se_x_16 4]

###### 3、放行防火墙指定端口 ######

###### ① 虚拟机 ######

参考 [https://www.cnblogs.com/ubiquitousShare/p/13135747.html][https_www.cnblogs.com_ubiquitousShare_p_13135747.html]

放行虚拟机 8080 端口

firewall-cmd --zone=public --add-port=8080/tcp --permanent

查看 8080 端口是否放行

firewall-cmd --zone=public --query-port=8080/tcp --permanent

重启防火墙

systemctl restart firewalld.service

![在这里插入图片描述][e2a3de688eef40ff96f66f58879a0dd1.png]

解决重启防火墙报错 `Failed to add /run/systemd/ask-password to directory watch: No space left on device`

参考 [https://www.tqwba.com/x\_d/jishu/259716.html][https_www.tqwba.com_x_d_jishu_259716.html]

echo 1048576 > /proc/sys/fs/inotify/max_user_watches

![在这里插入图片描述][4f09f55b2e854a078cd06b0d476dfda6.png]  
访问测试  
![在这里插入图片描述][watermark_type_ZHJvaWRzYW5zZmFsbGJhY2s_shadow_50_text_Q1NETiBA5LiN5oeC5LiA5LyR_size_20_color_FFFFFF_t_70_g_se_x_16 5]  
到这里测试成功就结束了，下面window 放行端口号的目的是，想让和主机处于同一网段的电脑都可以访问虚拟机的 web 服务器

下面这一步为了局域网内都能访问虚拟机 web 服务器

###### ②、主机 ######

下面以 window 为例，其他系统类似

你可以选择直接关闭防火墙，可以实现局域网内都可以访问虚拟机 web 服务器，最合理的方式是配置 window 的出战规则，放行指定端口即可  
![在这里插入图片描述][watermark_type_ZHJvaWRzYW5zZmFsbGJhY2s_shadow_50_text_Q1NETiBA5LiN5oeC5LiA5LyR_size_20_color_FFFFFF_t_70_g_se_x_16 6]

[https_blog.csdn.net_qq_61541602_article_details_125215221]: https://blog.csdn.net/qq_61541602/article/details/125215221
[08428cc081934d5c9aead3d9fcd62c0b.png]: https://img-blog.csdnimg.cn/08428cc081934d5c9aead3d9fcd62c0b.png
[watermark_type_ZHJvaWRzYW5zZmFsbGJhY2s_shadow_50_text_Q1NETiBA5LiN5oeC5LiA5LyR_size_20_color_FFFFFF_t_70_g_se_x_16]: https://img-blog.csdnimg.cn/5144bfe9af2745dba9df738b5dc5060a.png?x-oss-process=image/watermark,type_ZHJvaWRzYW5zZmFsbGJhY2s,shadow_50,text_Q1NETiBA5LiN5oeC5LiA5LyR,size_20,color_FFFFFF,t_70,g_se,x_16
[81dbdf3ff2554a8ca84451dcc9d8a510.png]: https://img-blog.csdnimg.cn/81dbdf3ff2554a8ca84451dcc9d8a510.png
[48150c4e2cf549819dd744dd8b8f695d.png]: https://img-blog.csdnimg.cn/48150c4e2cf549819dd744dd8b8f695d.png
[watermark_type_ZHJvaWRzYW5zZmFsbGJhY2s_shadow_50_text_Q1NETiBA5LiN5oeC5LiA5LyR_size_20_color_FFFFFF_t_70_g_se_x_16 1]: https://img-blog.csdnimg.cn/6b29e9c5726e47d48a1e89291934820e.png?x-oss-process=image/watermark,type_ZHJvaWRzYW5zZmFsbGJhY2s,shadow_50,text_Q1NETiBA5LiN5oeC5LiA5LyR,size_20,color_FFFFFF,t_70,g_se,x_16
[watermark_type_ZHJvaWRzYW5zZmFsbGJhY2s_shadow_50_text_Q1NETiBA5LiN5oeC5LiA5LyR_size_20_color_FFFFFF_t_70_g_se_x_16 2]: https://img-blog.csdnimg.cn/84eb8fdf0b104c0daa82807a2593d444.png?x-oss-process=image/watermark,type_ZHJvaWRzYW5zZmFsbGJhY2s,shadow_50,text_Q1NETiBA5LiN5oeC5LiA5LyR,size_20,color_FFFFFF,t_70,g_se,x_16
[watermark_type_ZHJvaWRzYW5zZmFsbGJhY2s_shadow_50_text_Q1NETiBA5LiN5oeC5LiA5LyR_size_20_color_FFFFFF_t_70_g_se_x_16 3]: https://img-blog.csdnimg.cn/a0e4385931fe42bfae1e954cd79f45e8.png?x-oss-process=image/watermark,type_ZHJvaWRzYW5zZmFsbGJhY2s,shadow_50,text_Q1NETiBA5LiN5oeC5LiA5LyR,size_20,color_FFFFFF,t_70,g_se,x_16
[watermark_type_ZHJvaWRzYW5zZmFsbGJhY2s_shadow_50_text_Q1NETiBA5LiN5oeC5LiA5LyR_size_20_color_FFFFFF_t_70_g_se_x_16 4]: https://img-blog.csdnimg.cn/f9965c008f09477f8538625e7ffbbdb9.png?x-oss-process=image/watermark,type_ZHJvaWRzYW5zZmFsbGJhY2s,shadow_50,text_Q1NETiBA5LiN5oeC5LiA5LyR,size_20,color_FFFFFF,t_70,g_se,x_16
[https_www.cnblogs.com_ubiquitousShare_p_13135747.html]: https://www.cnblogs.com/ubiquitousShare/p/13135747.html
[e2a3de688eef40ff96f66f58879a0dd1.png]: https://img-blog.csdnimg.cn/e2a3de688eef40ff96f66f58879a0dd1.png
[https_www.tqwba.com_x_d_jishu_259716.html]: https://www.tqwba.com/x_d/jishu/259716.html
[4f09f55b2e854a078cd06b0d476dfda6.png]: https://img-blog.csdnimg.cn/4f09f55b2e854a078cd06b0d476dfda6.png
[watermark_type_ZHJvaWRzYW5zZmFsbGJhY2s_shadow_50_text_Q1NETiBA5LiN5oeC5LiA5LyR_size_20_color_FFFFFF_t_70_g_se_x_16 5]: https://img-blog.csdnimg.cn/8df0387109974611806bee68f4641353.png?x-oss-process=image/watermark,type_ZHJvaWRzYW5zZmFsbGJhY2s,shadow_50,text_Q1NETiBA5LiN5oeC5LiA5LyR,size_20,color_FFFFFF,t_70,g_se,x_16
[watermark_type_ZHJvaWRzYW5zZmFsbGJhY2s_shadow_50_text_Q1NETiBA5LiN5oeC5LiA5LyR_size_20_color_FFFFFF_t_70_g_se_x_16 6]: https://img-blog.csdnimg.cn/0956cea3cc6a48cd90075e402058509e.png?x-oss-process=image/watermark,type_ZHJvaWRzYW5zZmFsbGJhY2s,shadow_50,text_Q1NETiBA5LiN5oeC5LiA5LyR,size_20,color_FFFFFF,t_70,g_se,x_16