背景
我希望在相同的局域网内,通过手机访问我在Vue 3项目中展示的效果
遇到的问题
使用Vue CLI的–host选项实现局域网内的应用程序测试
当使用Vue CLI在本地提供服务时,通过使用 --host
选项,你可以指定要公开应用程序的主机。默认情况下,Vue CLI 提供的开发服务器只监听本地主机(localhost)
,这意味着只有在同一台计算机上的浏览器才能访问你的应用程序。通过指定一个公共的主机名,你可以使你的应用程序能够被网络中的其他设备访问,这对于在局域网
中的其他设备上测试你的应用程序特别有用
解决方法
第一种方法
--host 0.0.0.0
选项告诉开发服务器监听所有的网络接口,而不仅仅是本地主机。这意味着你可以通过局域网
中的其他设备来访问你正在开发的应用程序。【0.0.0.0
是一个特殊的 IP 地址,代表所有可能的 IP 地址。在网络编程中,它被用作通配符
,表示在所有可用的网络接口上都监听】
第二种方法
效果:
同一局域网内设备访问
第一步:查看自己电脑的ip
第二步:
其他设备访问
注意
什么是同一局域网? 同一局域网是接在同一个交换机或者同一个集线器(HUB)或同一个路由器上的设备或者同一网段
上的设备,局域网是指在某一区域内由多台计算机互联成的计算机组,同一局域网不一定要接同一个交换机或者HUB。
最常见的就是多个设备连同一个wifi,这样理解起来更简单。