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

news2024/10/4 18:39:04

背景

我希望在相同的局域网内,通过手机访问我在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.coloradmin.cn/o/1669789.html

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

相关文章

IDEA-控制台日志过滤插件 - Grep Console

IDEA-控制台日志过滤插件 - Grep Console 当idea控制台日志较多时,为了方便查找关键字,使用Grep Console插件,指定控制台中关键字高亮显示 1.安装 2.使用 2.1 高亮显示 控制台中指定颜色高亮显示指定字符 效果: 重启项目后还是会高亮显示 取…

线程的休眠与唤醒

在前面几篇文章中,已经讲过了join()方法的使用,我们知道它是用来控制线程的执行顺序的。 本篇文章中要讲到的wait()方法和notify()方法是用来控制线程执行顺序的,相比于join(),它能够更精确地控制线程之间的执行顺序,…

云仓酒庄携手中视中州国际传媒 开启央视广告战略合作新征程

近日,云仓酒庄与中视中州(央视代理机构)隆重举行2024-2025年度央视广告战略签约仪式,云仓酒庄副总裁周玄代表云仓酒庄签约。此次合作标志着云仓酒庄在品牌传播和市场营销方面迈出了坚实的一步,将借助央视及多家卫视的强…

LeetCode题目104: 二叉树的最大深度(递归\迭代\层序遍历\尾递归优化\分治法实现 )

❤️❤️❤️ 欢迎来到我的博客。希望您能在这里找到既有价值又有趣的内容,和我一起探索、学习和成长。欢迎评论区畅所欲言、享受知识的乐趣! 推荐:数据分析螺丝钉的首页 格物致知 终身学习 期待您的关注 导航: LeetCode解锁100…

数据挖掘实战-基于决策树算法构建银行贷款审批预测模型

🤵‍♂️ 个人主页:艾派森的个人主页 ✍🏻作者简介:Python学习者 🐋 希望大家多多支持,我们一起进步!😄 如果文章对你有帮助的话, 欢迎评论 💬点赞&#x1f4…

【系统架构师】-案例篇(一)UML用例图

1、概述 用于表示系统功能需求,以及应用程序与用户或者与其他应用程序之间的交互关系。 2、组成 参与者(Actors):与系统交互的用户或其他系统。用一个人形图标表示。用例(Use Cases):系统需要…

字符串取第一个空格之后的所有的值字符串取第一个空格之后的第二个元素的值,不要后面的值

当我们后端返回值可能存在某些特定的值或标识导致返回数据不固定且是空格分割时,我们想取出返回字符串中的某个值,就可以参考下面对这个字符串进行操作提取,当然,如果是别的符号分割开的把下面的空格替换即可 1、字符串取第一个空…

IPD推行成功的核心要素(六)ipd总体规划方案设计

IPD指的是集成产品开发,是一种以市场和客户需求为驱动的规划和开发管理体系。其核心来由自市场,研发,制造,服务,采购等跨部门团队来共同管理整个规格和开发过程,从客户需求、产品规划、任务书、概念形成、产…

java -jar提示jar中没有主清单属性(no main manifest attribute)

目录 传送门前言排查原因问题1-》jdk17和jdk8共存导致idea的maven插件识别报错问题2-》pom.xml中mainClass下面的skip属性是罪魁祸首 其他办法(修改jar包) 传送门 SpringMVC的源码解析(精品) Spring6的源码解析(精品&…

woffice– 内部网和外部网WordPress高端资讯主题

下载地址:https://m.gx.cn/site/3046.html 完全灵活,与最新的WordPress品牌兼容 翻译语言超过15种 使用最新技术设计快速web应用程序 所有这些都以谷歌材料设计为灵感,采用易于定制的设计,给人一种优美的现代感和易于导航的用户…

HCIE学习笔记----OSPF详解

OSPF邻居建立的条件 OSPF建立邻居“41”条件总结 4个一致 一个不一致 1.保证接口的前缀 网络信息一致 2.保证ospf区域号和区域类型一致 3.hello包间隔时间和死亡时间一致 4.认证类型和认证认证信息一致 5.路由器的ID不一致 保证唯一性 一-----OSPF 邻接关系建立过程与状…

文字转语音服务的技术

文字转语音(Text-to-Speech, TTS)技术允许将书面文本转换为口语化的语音。以下是一些提供文字转语音服务的调用接口,开发者在选择文字转语音服务时,应考虑支持的语言、声音类型、音频格式、服务稳定性以及是否支持特定功能&#x…

spring框架定时任务(@Scheduled)

内容: 在spring框架中,scheduled注解是用于声明定时任务的,以最简单的方式来创建定时任务。 注意: 要使用scheduled注解,需要确保已下几点: 1.spring应用程序已经开启了定时任务的开启。需要在配置类&am…

【JavaWeb】网上蛋糕商城后台-客户管理

概念 上文中已讲解和实现了后台管理系统中的订单管理功能,本文讲解客户信息管理功能。 客户信息列表 在后台管理系统的head.jsp头部页面中点击“客户管理”向服务器发送请求 在servlet包中创建AdminUserListServlet类接收浏览器的请求 package servlet;import m…

FebHost:什么是新西兰.NZ域名?

.nz域名是新西兰的顶级域名(TLD)。它是专门分配给新西兰的国家代码顶级域(ccTLD)。以 .nz 结尾的域名用于标识与新西兰或其居民相关的网站、电子邮件地址和其他在线资源。 .nz 域名由新西兰域名委员会管理。负责监督 .nz 域名的注…

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

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

啥是PLCnext?它能干啥?

PLCnext控制器 简单来说,PLCnext是基于Linux操作系统的一个控制器运行时,所以它原生具备的两个特点: 1.原生兼容IEC61131 2.原生兼容Linux各类应用 PLCnext的控制器大概长下面这样(AXC F 1152、2152),通…

在全志H616核桃派开发板上进行PyQt5的代码编写和运行

核桃派本地 在上一节我们通过Qt Designer设计了ui窗口并转换成了Python代码,由于是Python编程,因此我们可以在核桃派开发板打开Python代码进行编程。 在核桃派上推荐使用Thonny来打开编写Python文件, 使用请参考:Thonny IDE。 打开上一节生…

每天认识新职业——网络工程师

一、网络工程师是什么 网络工程师是通过学习和训练,掌握网络技术的理论知识和操作技能的网络技术人员。网络工程师能够从事计算机信息系统的设计、建设、运行和维护工作。相关职业:系统集成工程师、计算机硬件工程师职业其他名称:网络管理员、…

TriCore: 从RTOS内核的角度看CSA

今天尝试从RTOS内核的角度来看看 TriCore 的 CSA。 CSA的细节信息可以参考前一篇文章 TriCore User Manual 笔记 1-CSDN博客 CSA 的全称是 Context Save Area,顾名思义就是专门用来保存上下文的一块存储区域。 既然是上下文使用,那必然要求低延迟&…