Vue-Cli的跨域问题 局域网无法访问题

最新推荐文章于 2025-02-12 11:22:47 发布
最新推荐文章于 2025-02-12 11:22:47 发布
阅读量824 收藏
点赞数
CC 4.0 BY-SA版权
分类专栏： 使用说明 文章标签： vue-cli
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.youkuaiyun.com/qq_25537391/article/details/99633575
本文介绍如何在局域网中让他人访问通过vue-cli搭建并由npm rundev启动的本地服务。只需修改config/index.js文件中的Host值为'0.0.0.0'，即可实现跨设备访问。

摘要生成于 C知道 ，由 DeepSeek-R1 满血版支持， 前往体验 >

用vue-cli搭建项目时，经常遇到需要在局域网中进行内测的情况，而通过npm run dev 开启本地服务后，同一局域网中的小伙伴却不能访问，下面就是解决办法：

Step1:找到config文件夹下的index.js文件
在这里插入图片描述
Step2：
将Host值改为0.0.0.0即可完美解决局域网内互相访问不了的问题

 // Various Dev Server settings
    host: '0.0.0.0', // can be overwritten by process.env.HOST
    port: 8080, // can be overwritten by process.env.PORT, if port is in use, a free one will be determined
Vue跨域问题、Vue配置开发环境代理服务、集成Axios发送Ajax请求、集成vue-resource发送Ajax请求
Bulut0907
09-06 1011
偏向底层JQuery: 对xhr进行了封装。提供$get、$post等API。封装了太多DOM操作，不适合Vueaxios: 基于promise的网络请求库，支持请求拦截器和响应拦截器，体积小，只有JQuery的1/4fetch:上直接有这个方法，也是基于promise的。但是会将返回的请求包两层promise，需要两次.then才能拿到请求，IE浏览器兼容性差Vue使用Axios请求不同端口的服务，会出现类似下面的错误。即CORS跨域问题。
Vue项目运用webpack多环境配置的问题和本地开发跨域问题
christyleylh的博客
05-15 1235
实际运用场景 在我们开发前端应用中，往往需要使用多个环境，例如 1.本地开发环境 2.测试环境 3.正式环境 所以每个环境都需要对相应的服务器地址、环境专属变量等做出单独的配置。 Vue项目 1.初始化 我们使用vue-cli init生成的项目，调试与打包已经为我们在package.json中做好了。 /* /package.json */ "scripts": { ...
vue-cli启动本地服务局域网不能访问的原因分析
08-28
主要介绍了vue-cli启动本地服务，局域网下访问不到的原因分析,在文中还给大家介绍了vue-cli起的webpack项目 用localhost可以访问，但是切换到ip就不可以访问的原因，本文给大家介绍的非常详细，需要的朋友参考下
vue 无法 局域网内访问
m0_75101866的博客
01-25 541
下午就不行了，但是后端服务能够正常访问，本机也能正常访问ip：端口号 前端服务。上午，前端vue服务能够在局域网内访问，然后，关闭防火墙尝试。开启电脑ping 命令。
Vue项目启动后用局域网不能访问
分享自己的经验、IT技术，愿在博客中遇见更好的自己
12-08 2990
今天来解决一个问题：基于Vite构建的Vue项目在启动后只能通过localhost这种形式访问，但 如果把localhost换成本主机的局域网ip地址之后页面无法访问了。
vue 前端代码其他局域网无法访问
piaomiaozaitianya的博客
02-12 242
代码没问题，该加的 0.0.0.0配置也加上了，代码拷贝到其他电脑vsCode运行，能正常访问。将专网切换成公网链接，并端口开放后解决该问题。最后发现是网络问题；
vue 同局域网访问不到的问题及解决
yjl13598765406的博客
11-24 1845
vue 同局域网访问不到的问题及解决
vue-cli常用设置总结
08-27
Vue CLI 是 Vue.js 的命令行工具，用于快速搭建 Vue 项目。本文将详细介绍 Vue CLI 的一些常见设置，这些设置能够优化开发流程并提高项目效率。 ### 路径相关设置 在 `build/utils.js` 文件中，我们经常需要对 CSS...
vue项目中的webpack-dev-sever配置方法
08-28
在Vue项目中，通常使用`vue-cli` 创建项目，`vue-cli` 已经默认配置了`webpack-dev-server`，但有时我们需要根据需求进行定制化配置。 1. **配置文件位置**： 在Vue项目中，`webpack-dev-server` 的配置通常位于`...
Vue 局域网使用ip无法访问的解决方法
shylcok的博客
01-07 1906
搜到了很多解决方法，但是，尝试到这个才能用 版本： [root@localhost vue_time]# vue --version 2.9.6 [root@localhost vue_time]# node -v v15.5.1 只要在项目的目录下，找到package.json 在script模块下，dev项中，增加一个启动配置参数 --host 0.0.0.0即可，下面是增加了之后的 [root@localhost vue_time]# cat package.json { "name
vue项目netWork地址无法访问问题解决方案
episode33的博客
06-07 5266
此方案可以解决vue项目 Network: unavailable和network访问失败的问题
VUE的跨域访问问题
weixin_34128593的博客
04-29 173
Vue axios跨域问题 什么是跨域： 跨域请求存在的原因：由于浏览器的同源策略，即属于不同域的页面之间不能相互访问各自的页面内容。 需要在前后端都修改：步骤如下 在springboot后端： config文件夹下（没有的新建就好） 添加class文件CORSConfig.java 内容如下 import org.springframework.context.annotation.Configuration; import org.springframework.web.servlet.config.a
关于vue项目本地运行以后，输入本机ip不能访问的问题
weixin_33923148的博客
07-09 1762
这次同样是用vue-cli 搭建的，出现了本机ip不能访问的问题，通过修改config目录下的index.js文件里的dev下面的host字段解决了 但是以前的项目index是这样的，这样用本机ip就能访问 ...
问题：在vue-cli2和vue-cli3中，如何在局域网通过IP访问项目？
never。❀的博客
04-20 990
遇到的问题： 在vue-cli2和vue-cli3中，如何在局域网通过IP，使用pc和手机访问项目呢？ 解决方法： 一、vue-cli2 第一种方法： 找到 your-project/build/webpack.dev.conf.js // const HOST = process.env.HOST const HOST = '172.20.x.xx' 然后保存，重新启动一下服务，会发现 PC 地址栏已经变成： http://172.20.x.xx:8080了，然后用手机试一试，没问..
为什么启动了vue以后另外一台电脑访问不了对应的页面？
AlphaFinance
12-13 2565
当你在本地启动了 Vue 项目以后，它只会在本地电脑上运行，其他计算机无法访问。如果想要让其他计算机能够访问，你需要在本地电脑上运行一个服务器，并将 Vue 项目部署到该服务器上。这样，其他计算机就能通过服务器的网址来访问你的 Vue 项目了。
vue-cli 启动本地服务局域网不能访问(亲测可用)
weixin_44563906的博客
08-15 4960
问题描述 本地 vue-cli 启动了一个项目只能通过 localhost:8080 访问到，同一局域网下其他的手机和电脑 (包括本机) 并不能通过 ip 地址访问调试 原因 这个问题，其实是因为新版 webpack 导致的，因为我们使用 vue-cli 来构建项目的时候，一般都会选择使用的模版是 webpack 。 这次 webpack 升级后，导致 /config/index.js 里面的配置...
解决局域网内Vue 2x 版本下，项目启动后不能被外部IP访问
xinxiaoyong的博客
09-19 3666
1、序言： 现在在用Vue开发项目的小伙伴，有一些时候，想要在别人的电脑上访问自己的项目。其实也不难，4步让你轻松访问。 2、具体步骤如下： 2.1 修改config文件下的index.js配置文件： 将此处的host的值修改为0.0.0.0(即 host: 0.0.0.0) 2.2 Dos窗口下查看本机的ip地址： 通过ipconfig查看自己电脑的ip地址。 2.2...
vue项目启动后实现localhost和局域网内ip访问页面
2301_78187511的博客
07-08 1618
【代码】vue项目启动后实现localhost和局域网内ip访问页面。
在 Vue CLI 项目中，访问ip配置
最新发布
03-21
嗯，用户的问题是关于在Vue CLI项目中如何配置或访问IP地址。我需要先理解用户的具体需求。通常，在开发Vue应用时，可能会遇到需要设置特定的IP和端口来运行开发服务器，或者在生产环境中配置后端API的IP地址。 ...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值