当前位置: 首页> 娱乐> 明星 > vue跨域问题,请注意你的项目是vue2还是vue3

vue跨域问题,请注意你的项目是vue2还是vue3

时间:2025/7/17 4:04:51来源:https://blog.csdn.net/qq_17798999/article/details/139753634 浏览次数:0次

uniapp跨域设置了,但还是有问题

  • uniapp设置代理后还是无法请求后端接口
    • vue2项目设置代理
    • vue3项目设置代理

uniapp设置代理后还是无法请求后端接口

如果你在possman,apifox上测试接口都没有问题,但是在hbuild项目中设置代理后,还是无法正确调用接口,那么你就要考虑是否是你的代理设置的有问题了
vue3在manifest.json里配置devServer转发是不生效的
vue3在manifest.json里配置vue.config.js也是不生效的

vue2项目设置代理

打开项目,找到manifest.json文件并打开,点源码视图,查看源码,然后找到vueVersion

"vueVersion": "2"

在后面加入代码:

"vueVersion": "2","h5": {"devServer": {"port": 8080, //浏览器运行端口"disableHostCheck": true, //设置跳过host检查"proxy": {"/dev-api": {"target": "http://1.1.x.18:111", //目标接口域名"changeOrigin": true, //是否跨域"secure": false, // 设置支持https协议的代理"pathRewrite": {"^/dev-api": ""}}}}}

然后重启启动项目,即可

vue3项目设置代理

如果你创建的是vue3的项目,那么就要特别注意了,vue2方法配置的代理,在vue3中是无法生效的,哪怕可以用,也是各种问题,博主踩坑了一个下午,一直在找问题
vue3 是使用 vite 打包的,所以你请不要使用vue2的方法,也不要使用添加使用vue.config.js的方法
正确使用vue3设置代理的方法
首先在项目的根目录下面创建vite.config.js文件
然后在vite.config.js加入如下代码:

import {defineConfig
} from "vite"
import uni from "@dcloudio/vite-plugin-uni";export default defineConfig({plugins: [uni()],server: {proxy: {'/api': {target: 'http://x.1xx.x.xx8:9999',changeOrigin: true,rewrite: path => path.replace(/^\/api/, '')},}}
})

最后关闭项目,重启项目,即可使用vite的配置文件进行代理了。

关键字:vue跨域问题,请注意你的项目是vue2还是vue3

版权声明:

本网仅为发布的内容提供存储空间,不对发表、转载的内容提供任何形式的保证。凡本网注明“来源:XXX网络”的作品,均转载自其它媒体,著作权归作者所有,商业转载请联系作者获得授权,非商业转载请注明出处。

我们尊重并感谢每一位作者,均已注明文章来源和作者。如因作品内容、版权或其它问题,请及时与我们联系,联系邮箱:809451989@qq.com,投稿邮箱:809451989@qq.com

责任编辑: