vscode插件live server无法在手机预览调试H5网页

环境

Window10、vscode:1.94.2、Live Server:v5.7.9、Live Server (Five Server):v0.3.1

问题

PC端预览没有问题,但是在手机点击链接显示访问失败

排查

1. 是否同一局域网

意思就是电脑、手机是不是访问同一个网络。电脑插得是办公室的网线,手机连得是办公室的wifi,确实是同一个局域网

如果你手机用的自己流量,那连上公司wifi问题就解决了

2. 链接问题

如果手机端报错显示:“该网页无法正常运作,127.0.0.1未发送任何数据”

那就是访问链接的问题,这个链接并不像webpack那种打包出来的链接

http://127.0.0.1:5500/

打包工具打包出来的链接

http://192.168.x.x:3000

那怎么能拿到第二种的访问链接呢?

这里,我推荐方式二

  • 方式一:打开设置,配置一下插件的liveServer.settings.useLocalIp,设置为true
    live server
    在这里插入图片描述

  • 方式二:不使用live server跑服务,使用Live Server (Five Server),插件市场下载这个插件。它会直接显示终端
    在这里插入图片描述
    在这里插入图片描述

根据上面改了链接,但是手机还是无法访问不了

3. 防火墙

看看同事能不能访问我的链接,结果发现不能;

但是我用webpack开启的服务(一些vue项目),同事就可以访问链接。

同事用nginx开启一个本地服务,他手机也能访问,我电脑也能访问。

应该是vscode不小心关闭防火墙通信,那只要开启就行了:

  1. 点开电脑左下角的搜索,搜索:防火墙
    在这里插入图片描述

  2. 选择“高级设置”
    在这里插入图片描述

  3. 选择入站规则,找到“Visual Studio Code”,双击,勾选:允许链接
    在这里插入图片描述

全部设置完了后,关闭服务,重新再开启一个服务,手机端可以访问链接了

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

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

相关文章

微信互助学习平台(lw+演示+源码+运行)

摘要 随着信息技术在管理上越来越深入而广泛的应用,管理信息系统的实施在技术上已逐步成熟。本文介绍了微信互助学习平台的开发全过程。通过分析微信互助学习平台管理的不足,创建了一个计算机管理微信互助学习平台的方案。文章介绍了微信互助学习平台的…

论文精读:TiC-CLIP: Continual Training of CLIP Models(一)

论文精读:TiC-CLIP: Continual Training of CLIP Models(一) 论文介绍 在多模态学习领域,CLIP(Contrastive Language-Image Pre-training)模型因其在图像和文本联合嵌入方面的卓越性能而受到广泛关注。然而&#xff0…

【C++】vector(1)

😈个人主页: 起名字真南 😈个人专栏:【数据结构初阶】 【C语言】 【C】 目录 引言1 vector 的基本知识1.1 vector 的特点 2 vector 的主要功能和操作2.1 vector 的构造2.2 vector 的增删改查2.3 vector 的容量 引言 在C的标准模板库(STL&…

MySQL——数据库

什么是数据库 数据库(DB , DataBase)概念:数据仓库,软件,安装在操作系统(window,linux,max,...)之上学习数据库最重要的就是学习SQL语句存储500万以下的数据…

鸿蒙HarmonyOS————ArkTs介绍(1)

最近除了人工智能,还有一个很火的HarmonyOS,HarmonyOS是华为公司开发的一款面向全场景的分布式操作系统,旨在为消费者提供跨设备无缝协同体验。它支持多种智能终端设备,包括但不限于智能手机、平板电脑、智能穿戴设备、智能家居设…

<Project-11 Calculator> 计算器 0.3 年龄计算器 age Calculator HTML JS

灵感 给工人发工资是按小时计算的,每次都要上网,我比较喜欢用 Hours Calculator ,也喜欢它的其它的功能, 做个类似的。 我以为是 Python,结果在学 javascript 看 HTML,页面的基础还停留在 Frontpage 2000…

【学术论文投稿】自动化运维:解锁高效运维的密钥

【连续三届IEEE出版|EI检索】第三届图像处理、计算机视觉与机器学习国际学术会议(ICICML 2024)_艾思科蓝_学术一站式服务平台 更多学术会议请看:https://ais.cn/u/nuyAF3 目录 引言 一、自动化运维概述 1. 自动化运维的定义 2. 自动化运…

Qt中使用线程之QRunnable

1、自定义1个子类继承自QRunnable 2、重写run方法,编写子线程的业务逻辑 3、使用QThreadPool的全局方法来开启这个线程 4、线程的回收不需要关注,由QThreadPool处理 5、缺点:无法使用信号槽机制 6、适合一些不需要和主线程通信的耗时的任…

SpringBoot中大量数据导出方案:使用EasyExcel并行导出多个excel文件并压缩zip后下载

文章目录 前言一、控制器层代码二、服务层代码三、代码亮点分析 前言 SpringBoot的同步excel导出方式中,服务会阻塞直到Excel文件生成完毕,如果导出数据很多时,效率低体验差。有效的方案是将导出数据拆分后利用CompletableFuture,…

【图论】(四)最小生成树与拓扑排序

最小生成树与拓扑排序 最小生成树之prim(P算法)相关概念结题思路拓展 最小生成树之kruska(K算法)过程模拟程序实现拓展 拓扑排序背景与思路模拟过程程序实现 最小生成树之prim(P算法) 相关概念 P算法是用…

『完整代码』坐骑召唤

创建一个按钮 作为召唤/消失坐骑的开关 将预制体放入指定文件夹 命名为Mount01 创建脚本并编写:CallMount.cs using UnityEngine; using UnityEngine.UI; public class CallMount : MonoBehaviour{public Button callBtn;GameObject mountPrefab;GameObject mountIn…

CentOS7 上安装GitLab的经历

一、安装必要的基础环境 1.安装依赖包 [rootgitlab-server ~]#yum install curl policycoreutils openssh-server openssh-clients postfix wget git patch -y [rootgitlab-server ~]# systemctl start postfix 2.配置yum源(由于网络问题,国内用户请使用清华大学…

导数的概念及在模型算法中的应用

一. 导数概念与计算 1. 导数的物理意义: 瞬时速率。一般的,函数yf(x)在x处的瞬时变化率是 2. 导数的几何意义: 曲线的切线,当点趋近于P时,直线 PT 与曲线相切。容易知道,割线的斜率是当点趋近于 P 时&…

数字孪生:引领智慧农业的未来

在现代农业中,数字化与智能化的浪潮正在改变传统的种植方式。数字孪生技术作为一种创新的数字化解决方案,正在深刻改变智慧农业的面貌,尤其是在大棚智能控制、数据全面可视、加工过程监控和物流运输溯源等方面展现出巨大的潜力。 frontop数字…

【动手学深度学习】8.1. 序列模型(个人向笔记)

想象一下有人正在看网飞(Netflix,一个国外的视频网站)上的电影。 一名忠实的用户会对每一部电影都给出评价, 毕竟一部好电影需要更多的支持和认可。 然而事实证明,事情并不那么简单。 随着时间的推移,人们对…

《Python基础教程》笔记(ch0-1)

前言 在Python生态系统中,各种包轮番登场,各种编码实践大行其道后又日渐式微。 引言 Python是什么?为何要使用它?官方宣传说:Python是一种面向对象的解释性高级编程语言,具有动态语义。 这句话的要点在…

监控易DEMO功能深度解析:运维行业的智能化转型新助力

在数字化转型的浪潮中,运维行业正面临着前所未有的变革与挑战。为了应对日益复杂的IT架构和不断提升的运维需求,监控易的集中式跨平台一体化监控软件不断升级优化,以适应新的运维环境。本文将对监控易DEMO的功能进行深度解析,探讨…

简单介绍冯诺依曼体系

现代的计算机, 大多遵守冯诺依曼体系结构 CPU中央处理器:进行算术运算和逻辑判断。存储器:分为外存和内存,用于存储数据(使用二进制方式存储)。输入设备:用户给计算机发号施令。输出设备:计算机…

Hadoop生态圈三大组件:HDFS的读写流程、MapReduce计算流程、Yarn资源调度

文章目录 1. HDFS的读写流程1.1 HDFS读流程1.2 HDFS写流程 2. MapReduce计算流程3. Yarn资源调度一、客户端请求资源二、Resource Manager处理请求三、任务资源计算与申请四、Resource Manager分配资源五、Node Manager执行任务六、任务执行与监控 1. HDFS的读写流程 1.1 HDFS…

沃德商协会管理系统小程序源码

商协会管理系统小程序,作为新一代数字化商协会运营管理的先锋工具,其核心围绕“智慧化会员体系、智敏化内容运营、智能化活动构建”三大核心板块精心构建。这一系统通过智慧化会员体系,实现了会员信息的精准管理与高效互动,不仅简…