vue跨域问题,请注意你的项目是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的配置文件进行代理了。

相关推荐

  1. vue问题注意项目vue2vue3

    2024-06-18 12:04:03       10 阅读
  2. springboot vue线上部署项目注意问题

    2024-06-18 12:04:03       24 阅读
  3. SpringBoot+Vue项目问题

    2024-06-18 12:04:03       18 阅读
  4. vue2 项目中设置

    2024-06-18 12:04:03       13 阅读
  5. Vue问题解决

    2024-06-18 12:04:03       32 阅读
  6. VueVue项目配置指南

    2024-06-18 12:04:03       12 阅读

最近更新

  1. TCP协议是安全的吗?

    2024-06-18 12:04:03       18 阅读
  2. 阿里云服务器执行yum,一直下载docker-ce-stable失败

    2024-06-18 12:04:03       19 阅读
  3. 【Python教程】压缩PDF文件大小

    2024-06-18 12:04:03       18 阅读
  4. 通过文章id递归查询所有评论(xml)

    2024-06-18 12:04:03       20 阅读

热门阅读

  1. Aeron:Common Errors

    2024-06-18 12:04:03       10 阅读
  2. Nginx 网站服务

    2024-06-18 12:04:03       7 阅读
  3. 整理水土保持设计乙级资质申报材料的全面指南

    2024-06-18 12:04:03       9 阅读
  4. 【康复学习--LeetCode每日一题】2288. 价格减免

    2024-06-18 12:04:03       9 阅读
  5. C语言从头学21——函数

    2024-06-18 12:04:03       9 阅读
  6. 自然语言处理nlp概述

    2024-06-18 12:04:03       12 阅读
  7. 等保测评机构选择与测评委托流程全解析

    2024-06-18 12:04:03       7 阅读