当Vue项目启动后,通过IP地址方式在相同网络段的其他电脑上无法访问前端页面?

当Vue项目启动后,通过IP地址方式在相同网络段的其他电脑上无法访问前端页面,可能是由以下几个原因造成的:

  1. 服务监听地址:默认情况下,许多开发服务器(如Vue CLI的vue-cli-service serve)只监听localhost(127.0.0.1),这意味着它们只能接受来自本机的连接。为了使其能够接受来自网络上其他设备的连接,需要配置服务以监听所有网络接口(0.0.0.0)。

  2. 防火墙设置:Windows或其他操作系统的防火墙可能阻止了对应用程序使用的端口的访问。如果服务正在运行,但其他设备无法连接,可能需要配置防火墙以允许外部设备访问该端口。

  3. 网络设置:确保所有设备都连接到同一网络,并且没有子网或VPN配置阻止它们之间的通信。

  4. **还有可能是:**接口访问的代理地址写死是localhost,因此在别的电脑访问时候就会直接也是代理是localhost,因此展现不出页面。

解决方案

  1. 修改服务监听地址

    • 如果你使用的是Vue CLI 3或更高版本,你可以通过修改vue.config.js文件来指定开发服务器的监听地址。如果你的项目中还没有这个文件,你可以在项目根目录下创建一个。然后,添加以下配置以使其监听所有网络接口:
    module.exports = {devServer: {host: '0.0.0.0',disableHostCheck: true,},
    };
    
    • 启动开发服务器后,它将接受来自同一网络中任何设备的连接。
  2. 配置防火墙

    • 根据你的操作系统,允许通过防火墙访问Vue应用程序使用的端口(通常是8080,除非你更改了)。在Windows中,你可以通过“控制面板” > “系统和安全” > “Windows Defender 防火墙” > “高级设置”来配置防火墙规则。
  3. 确保正确的网络配置

    • 确保所有试图相互连接的设备都位于同一网络,并且没有任何网络隔离措施(如客人网络或子网限制)阻止它们之间的通信。

实施这些解决方案后,你应该能够从相同网络段的其他电脑通过IP地址访问Vue应用程序的前端页面。
在这里插入图片描述

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

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

相关文章

ubuntu22.04安装cuda11.5+cudnn8.8.0

因为pytorch1.11.0与cuda版本的关系 需要用到cuda11.5 否则报错 "addmm_sparse_cuda" not implemented for Half cuda11.5.0及以前的版本不会出现这个问题 因此重新安装,步骤如下: 安装CUDA-11.5.0 wget https://developer.download.nvi…

2023年09月CCF-GESP编程能力等级认证C++编程六级真题解析

本文收录于专栏《C++等级认证CCF-GESP真题解析》,专栏总目录・点这里 一、单选题(共15题,共30分) 第1题 近年来,线上授课变得普遍,很多有助于改善教学效果的设备也逐渐流行,其中包括比较常用的手写板,那么它属于哪类设备?( ) A:输入 B:输出 C:控制 D:记录 答…

ky10-server docker 离线安装包、离线安装

离线安装脚本 # ---------------离线安装docker------------------- rpm -Uvh --force --nodeps *.rpm# 修改docker拉取源为国内 rm -rf /etc/docker mkdir -p /etc/docker touch /etc/docker/daemon.json cat >/etc/docker/daemon.json<<EOF{"registry-mirro…

kubectl 命令行管理K8S(上)

目录 陈述式资源管理方式 介绍 命令 项目的生命周期 创建 kubectl create命令 发布 kubectl expose命令 更新 kubectl set 回滚 kubectl rollout 删除 kubectl delete 应用发布策略 金丝雀发布 陈述式资源管理方式 介绍 1.kubernetes 集群管理集群资源…

深圳市萨科微半导体有限公司一直研究新材料新工艺

深圳市萨科微&#xff08;www.slkoric.com&#xff09;半导体有限公司一直研究新材料新工艺&#xff0c;不断推出新产品&#xff0c;驱动公司不断发展。最近萨科微slkor推出SL40T120FL系列IGBT单管&#xff0c;和CMOS运算放大器SLA333等产品&#xff0c;为新能源汽车、太阳能光…

【lv14 day10内核模块参数传递和依赖】

一、模块传参 module_param(name,type,perm);//将指定的全局变量设置成模块参数 /* name:全局变量名 type&#xff1a; 使用符号 实际类型 传参方式 bool bool insmod xxx.ko 变量名0 或 1 invbool bool insmod xxx.ko 变量名0 或 1 charp char * insmod xxx.ko 变量名“字符串…

全中文+图形化:国产编程语言来了!

编程语言的选择困扰着我们&#xff0c;静态还是动态&#xff1f;编译型还是解释型&#xff1f;但这个困扰正在被图形化编程语言&#xff0c;如iVX&#xff0c;一扫而空。 图形化编程语言&#xff0c;被许多人误解为孩子的玩具&#xff0c;无法处理复杂任务。但是&#xff0c;你…

基于Java学生管理系统设计与实现(源码+部署文档)

博主介绍&#xff1a; ✌至今服务客户已经1000、专注于Java技术领域、项目定制、技术答疑、开发工具、毕业项目实战 ✌ &#x1f345; 文末获取源码联系 &#x1f345; &#x1f447;&#x1f3fb; 精彩专栏 推荐订阅 &#x1f447;&#x1f3fb; 不然下次找不到 Java项目精品实…

1904_ARM Cortex M系列芯片特性小结

1904_ARM Cortex M系列芯片特性小结 全部学习汇总&#xff1a; g_arm_cores: ARM内核的学习笔记 (gitee.com) ARM Cortex M系列的MCU用过好几款了&#xff0c;也涉及到了不同的内核。不过&#xff0c;关于这些内核的基本的特性还是有些不了解。从ARM的官方网站上找来了一个对比…

【UE 材质】冰冻效果

效果 步骤 1. 打开“Quixel Bridge” 下载冰的纹理 2. 新建一个材质&#xff0c;这里命名为“M_Frozen” 打开“M_Frozen”&#xff0c;添加如下节点&#xff0c;此时我们可以通过控制参数“偏移”来改变边界的偏移 此时预览效果如下 如果增加参数“偏移”的默认值效果如下 3.…

OpenCV 16 - Qt使用opencv视觉库

1 下载好opencv视觉库 不知道怎么下载和编译opencv视觉库的可以直接使用这个 : opencvcv_3.4.2_qt 2 解压opencv包 3 打开opencv的安装目录 4.打开x86/bin 复制里面所有的dll文件&#xff0c;黏贴到C/windows/syswow64里面 5 新建Qt项目 6 修改pro文件:添加对应的头文件和库文件…

[python] 代码转换成流程图 (pycallgraph)

1. centos 7 安装dot 在 CentOS 7 上安装 Graphviz 中的 dot 工具可以通过 yum 命令进行。dot 工具是 Graphviz 提供的一个用于生成图形的命令行工具&#xff0c;通常在安装 Graphviz 的时候会一并安装。 以下是在 CentOS 7 上安装 Graphviz 的步骤&#xff1a; 更新 yum 软…

腾讯文档(excel也一样)设置单元格的自动行高列宽

1. 选中单元格 可选择任意一个或者几个 2. 设置自动 行高和列宽 即可生效

[FT]chatglm2微调

1.准备工作 显卡一张&#xff1a;A卡&#xff0c;H卡都可以&#xff0c;微调需要一张&#xff0c;大概显存得30~40G吧环境安装&#xff1a; 尽量在虚拟环境安装&#xff1a;参见&#xff0c;https://blog.csdn.net/u010212101/article/details/103351853环境安装参见&#xff…

CSS选择器:让样式精确命中目标

CSS选择器&#xff1a;让样式精确命中目标 在网页开发中&#xff0c;CSS选择器是一种强大的工具&#xff0c;它可以帮助我们精确地定位HTML元素&#xff0c;以便为它们应用样式。在这篇博客中&#xff0c;我们将探讨一些常见的CSS选择器&#xff0c;了解它们的功能和使用方法。…

sql-labs第46关 order by盲注

sql-labs第46关 order by盲注 来到了第46关进入关卡发现让我们输入的参数为sort&#xff0c;我们输入?sort1尝试&#xff1a; 输入?sort2,3,发现表格按照顺序进行排列输出&#xff0c;明显是使用了order by相关的函数。 我们将参数变成1进行尝试&#xff0c;就会报错&…

树莓派使用git clone时报错failed: The TLS connection was non-properly terminated.

fatal: unable to access https://github.com/jacksonliam/mjpg-streamer.git/: gnutls_handshake() failed: The TLS connection was non-properly terminated. 原因&#xff1a;权限不足 解决办法&#xff1a;sudo git clone 加对应网址。 sudo git clone https://github.co…

排序链表(leetcode)

冒泡排序&#xff1a; struct ListNode* sortList(struct ListNode* head){ struct ListNode* pf head; struct ListNode* move head; struct ListNode* str NULL; int len 1; int temp 0; int i 0; int j 0; if( head NULL || head-…

win10 lua环境搭建

Lua 包管理 - Luarocks 使用指南-CSDN博客 在Windows 上 Build LuaJit32 和 LuaJit64_luajit.exe-CSDN博客 下载 (luajit.org) luarocks.github.io/luarocks/releases/ LuaBinaries - Browse /5.4.2/Tools Executables at SourceForge.net

韩国突发:将批准比特币ETF

作者&#xff1a;秦晋 韩国两党宣布将批准比特币ETF。比特币也再次成为竞选的宠儿。 4月10日&#xff0c;韩国将迎来每隔4年而进行的一次立法大选。在大选之前&#xff0c;现执政党与反对党都承诺将批准比特币ETF。 我们知道&#xff0c;比特币的主要受众群体以年轻人居多。此前…