uniapp通过proxy解决跨域问题

Lucky_zss

于 2024-06-22 18:07:57 发布

阅读量156

点赞数 1

文章标签： uni-app

本文链接：https://blog.csdn.net/zss_base/article/details/139886009

版权

//创建vite.config.js 文件

// 导入vite的配置对象
import {defineConfig} from "vite"
// 在uniapp环境下使用的vite 需要导入Dcloud的插件
import uni from "@dcloudio/vite-plugin-uni";

// 将配置导出
export default defineConfig({
	// 使用插件
	plugins: [
		uni()
	],
	// vite服务器配置
	server: {
		// 代码配置
		proxy: {
			// 源地址：https://m.douyu.com/api/home/mix
			// 识别信息
			'/bbdx': {
				// 源地址 域名或者 接口的公共部分
				target: 'https://api.book.bbdaxia.com',
				// 是否改变域名
				changeOrigin: true,
				// 路径重写  
				rewrite: path => {
					// 将识别标识再替换到  组合成完整的接口地址
					return path.replace(/^\/bbdx/, '')
				}
			},
			'/shop': {
				// 源地址 域名或者 接口的公共部分
				target: 'http://localhost:3000',
				// 是否改变域名
				changeOrigin: true,
				// 路径重写  
				rewrite: path => {
					// 将识别标识再替换到  组合成完整的接口地址
					return path.replace(/^\/shop/, '')
				}
			},
		}
	}
})

		

//页面发送请求 
//使用条件编译语句   如果是h5 发送跨域请求  如果是小程序发送完整url地址
     created() {
			console.log('created');
			// #ifndef H5
			const url = 'http://localhost:3000/shopping'
			// #endif
			// #ifdef H5
			const url = '/shop/shopping'
			// #endif
		
			uni.request({
				url: url,
				method: 'GET',
				data: {},
				success: res => {
					console.log(res);
				}
			});
		}