一.uni-app的vue2项目设置代理:

第一步:manifest.json的源码视图中添加如下代码

"h5": {
 	"title": "Test",//标题
 	"devServer": {
 		// "https": true,
 		"port": "5173",//端口号
 		"disableHostCheck": false,
 		"proxy": {
 			"/api": {
 				"target": "https://www.dffdf.com",//目标服务器
 				"changeOrigin": true,//是否跨域
 				"secure": false,
 				"pathRewrite": {//重写
 					"^/api": ""
 				}
 			}
 		}
 	}
 }

二.uni-app的vue3项目中使用了vite就不能用上面那种方法

在项目的根目录中创建一个名为vite.config.js文件,此文件会自动生效,复制以下代码到vite.config.js中:
import {
	defineConfig
} from "vite";

import uni from '@dcloudio/vite-plugin-uni'
export default defineConfig({
	plugins: [
		uni()
	],
	server: {
		host: '0.0.0.0',
		port: 3000,
		// host: true,
		// port: 5173,
		proxy: {
			"/api": {
				target: "https://shop.fdfd.com",
				changeOrigin: true,
				// rewrite: (path) => path.replace(/^\/api/, "/api"),
			},
		},
		// headers: {
		// 	'Access-Control-Allow-Origin': '*',
		// },
	}

});
// Vite中文网:https://vitejs.cn/config/

注意:vue2也可以使用vite.config.js的方法,但是manifest.json中的代理会自动覆盖vite.config.js文件中的。

**

‘‘途中遇到的问题’’:

**
①设置代理前,根目录下的api文件里存放的api接口是可以正常访问的;
②设置代理后,根目录下的api文件里存放的api接口就显示404的错误,无法访问;
最开始一只找不到问题所在,经过一系列的测试新dome终于找到了问题,api文件目录是自定义创建的,项目无法识别,不能把api文件放在根目录下。后来我直接移动到common中,完美解决了这个问题。一直以为是代理弄错了的,原来不是的。在这里插入图片描述

GitHub 加速计划 / vu / vue
106
18
下载
vuejs/vue: 是一个用于构建用户界面的 JavaScript 框架,具有简洁的语法和丰富的组件库,可以用于开发单页面应用程序和多页面应用程序。
最近提交(Master分支:1 个月前 )
9e887079 [skip ci] 1 年前
73486cb5 * chore: fix link broken Signed-off-by: snoppy <michaleli@foxmail.com> * Update packages/template-compiler/README.md [skip ci] --------- Signed-off-by: snoppy <michaleli@foxmail.com> Co-authored-by: Eduardo San Martin Morote <posva@users.noreply.github.com> 1 年前
Logo

新一代开源开发者平台 GitCode,通过集成代码托管服务、代码仓库以及可信赖的开源组件库,让开发者可以在云端进行代码托管和开发。旨在为数千万中国开发者提供一个无缝且高效的云端环境,以支持学习、使用和贡献开源项目。

更多推荐