局域网内访问vue3项目|Network: use --host to expose

背景

我希望在相同的局域网内,通过手机访问我在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,这样理解起来更简单。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/diannao/11295.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

[Linux] 入门指令详解

目录 ls指令 pwd指令 whoami指令 cd指令 clear指令 touch指令 mkdir指令 rmdir指令 rm指令 man指令 cp指令 mv指令 cat指令 tac指令 more指令 less指令 head指令 tail指令 拓展:如何读取文件中间某一段内容? date指令 cal指令 fin…

代码随想录阅读笔记-动态规划【爬楼梯】

题目 假设你正在爬楼梯。需要 n 阶你才能到达楼顶。 每次你可以爬 1 或 2 个台阶。你有多少种不同的方法可以爬到楼顶呢? 注意:给定 n 是一个正整数。 示例 1: 输入: 2输出: 2解释: 有两种方法可以爬到楼…

Ubuntu上使用audit2allow解决Android Selinux问题

1.安装工具 sudo apt install policycoreutils 2.运行命令 提前用dmesg或者串口抓取kernel log 遇到错误,提示需要用-p指定policy file,然偶尝试创建一个policy空文件,用-p选项,遇到如下错误 3.规避问题 首先跟进错误log的堆栈…

快速安装redis各种版本

要在AlmaLinux 9.3 (Shamrock Pampas Cat)上通过rpm包安装Redis,可以考虑使用Remi存储库,这是一个广泛用于安装较新版本PHP和数据库软件的第三方存储库。以下是安装Redis的步骤: 1. 添加Remi存储库 首先,需要启用EPEL存储库&…

vue2响应式和vue3响应式

vue2响应式是基于Object.defineProperty实现的,在生命周期钩子函数beforeCreate,created之间收集依赖,将data中的每个属性递归设置上Object.definePropertyvue3响应式是基于ES6 Proxy 在生命周期钩子函数beforeCreate和created之间将data属性直接设置proxy&#xff…

C语言每日一题—约瑟夫问题

13个人围成一圈,从第1个人开始顺序报号1、2、3,凡报到3的人退出圈子。找出最后留在圈子里的人原来的序号。要求用结构体编程实现。***输出提示:"\n出圈成员及顺序:" ***输出格式:"%3d" ***输出提示…

C++指针和动态内存分配细节,反汇编,面试题05

文章目录 20. 指针 vs 引用21. new vs malloc 20. 指针 vs 引用 指针是实体,占用内存空间,逻辑上独立;引用是别名,与变量共享内存空间,逻辑上不独立。指针定义时可以不初始化;引用定义时必须初始化。指针的…

mmdetection在训练自己数据集时候 报错‘ValueError: need at least one array to concatenate’

问题: mmdetection在训练自己数据集时候 报错‘ValueError: need at least one array to concatenate’ 解决方法: 需要修改数据集加载的代码文件,数据集文件在路径configs/base/datasets/coco_detection.py里面,需要增加meta…

【GD32F470紫藤派使用手册】第五讲 PMU-低功耗实验

5.1 实验内容 通过本实验主要学习以下内容: PMU原理; 低功耗的进入以及退出操作; 5.2 实验原理 5.2.1 PMU结构原理 PMU即电源管理单元,其内部结构下图所示,由该图可知,GD32F4xx系列MCU具有三个电源域…

驱动丹佛斯比例电磁铁放大器

驱动丹佛斯比例电磁铁是一种用于实现对液压系统连续且精确控制的通电带磁性装置。比例阀由直流比例电磁铁和液压阀两部分组成。其中,比例电磁铁是其核心部件,负责将输入的电信号转换成力和位移输出,从而控制液压阀的工作状态。比例电磁铁通过…

c语言实现十进制(整数,小数)转N进制

文章目录 先来说一下整数转N进制小数转N进制栈和队列代码地址← 今天实现了c语言整数和小数转换为对应的N进制 先来说一下整数转N进制 我们只需要不断的取模然后判断num/N是否等于0就可以了,同时我们还要保存每一组的余数 这里我们的余数是从下往上输出的,是不是就相当于后算出…

海外盲盒小程序:探索世界,发现无限可能

在数字时代,我们渴望突破地域的界限,体验不同文化,感受世界的多彩。为了满足这一需求,我们隆重推出“海外盲盒小程序”——一个让你足不出户,就能探索世界、发现无限可能的神奇平台。 一、独特的盲盒体验 打开“海外盲…

[力扣题解]45. 跳跃游戏 II

题目:45. 跳跃游戏 II 思路 贪心法; 只需记录2个变量,当前点能达到的最远距离,和上一步能到达的最远距离; (真有意思,代码随想录给出的是curDistance,nextDistance2个,…

NetApp数据恢复—WAFL文件系统下raid数据恢复案例

NetApp存储数据恢复环境&故障: 某公司NetApp存储设备,人为误操作导致NetApp存储内部分重要数据被删除,该NetApp存储采用WAFL文件系统,底层是由多块硬盘组成的raid阵列。 NetApp存储数据恢复过程: 1、将NetApp存储设…

VBA在Excel中注册登录界面的应用

VBA在Excel中注册登录界面的应用(V潘谆白说VBA) 文章目录 前言一、如何注册登录?二、注册登录界面截图三、操作思路四、运行代码1.注册2.登录3.注册登录界面赋值4.隐藏工作表方法5.显示工作表方法6.打开、关闭工作薄前操作前言 Excel工作表也可以像其他小程序一样,输入账号…

【3D基础】坐标转换——地理坐标投影到平面

汤国安版GIS原理第二章重点 1.常见投影方式 https://download.csdn.net/blog/column/9283203/83387473 Web Mercator投影(Web Mercator Projection): 优点: 在 Web 地图中广泛使用,易于显示并与在线地图服务集成。在…

【Linux学习笔记】一篇文章彻底搞定 “Linux同步与互斥“ !

本章重点 1. 学会线程同步。 2 学会使用互斥量,条件变量,posix信号量,以及读写锁。 1、进程线程间的互斥相关背景概念 临界资源:多线程执行流共享的资源就叫做临界资源临界区:每个线程内部,访问临界资源的…

JavaSE继承

1、继承 关键字:extends 继承的作用:多态前提条件,提高代码复用率 继承的缺点: 父类中私有的属性和方法,子类是无法使用的 在java中只支持单继承,不支持多继承,但是可以支持多重继承 继承后…

Sylar C++高性能服务器学习记录12 【IO调度模块-代码分析篇】

早在19年5月就在某站上看到sylar的视频了,一直认为这是一个非常不错的视频。 由于本人一直是自学编程,基础不扎实,也没有任何人的督促,没能坚持下去。 每每想起倍感惋惜,遂提笔再续前缘。 为了能更好的看懂sylar&…

【多电压流程 Multivoltage Flow】- 5.特定工具使用建议(5.使用ICC II以及FC进行物理实现)

使用IC Compiler II和Fusion Compiler进行物理实现 在完成带有行站点、电源规划和I/O放置的floorplan之后,可以继续进行物理综合和实现。Fusion Compiler提供了广泛的功能,以执行设计的平面物理实现。 图67显示了物理实现流程的一般步骤以及流程的低功耗支持特性。 图67 I…