当前位置: 首页 > news >正文

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

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的配置文件进行代理了。

http://www.lryc.cn/news/382636.html

相关文章:

  • 大厂晋升学习方法一:海绵学习法
  • 【ARMv8/v9 GIC 系列 4.2 -- GIC CPU Interface 详细介绍】
  • 小抄 20240619
  • 【06】数据模型和工作量证明-工作量证明
  • VBA递归过程快速组合数据
  • 基于豆瓣电影TOP250的可视化设计
  • YOLOv8中的C2f模块
  • ESP32 双线汽车接口 (TWAI)
  • docker-compose离线安装harbor
  • 服务器“雪崩”的常见原因和解决方法 (C++)
  • 详解ES6中的类、对象和类的继承
  • 游戏遇到攻击有什么办法能解决?
  • 【LLM】GLM系列模型要点
  • 安卓开发,获取本机手机号
  • linux学习week1
  • 【React篇】父组件渲染时避免重复渲染子组件的3种处理方法
  • 深度神经网络——决策树的实现与剪枝
  • IOPaint前后端框架
  • 【Linux】进程间通信_2
  • Linux基础 - 常用命令
  • 轻松两步,借助向量数据库 VectorDB 与千帆 Appbuilder 构建个性化本地问答知识库
  • ONLYOFFICE 桌面编辑器 8.1
  • idea中的git在clone文件提示 filename too long
  • C++ 数组介绍
  • 思维导图MindManager2024最新版,让你的思维飞起来!
  • Spring容器启动流程——refresh()单个方法分析
  • Redis--注册中心集群 Cluster 集群
  • 秋招突击——6/20——复习{(单调队列优化)——最大子序列和,背包问题——宠物小精灵收服问题}——新作{两两交换链表中的节点}
  • 使用 MongoDB 剖析开放银行:技术挑战和解决方案
  • 鸿蒙 HarmonyOS NEXT星河版APP应用开发-阶段二