uni-app跨域的解决以及如何封住api，请求接口

最新推荐文章于 2024-08-12 21:15:00 发布

鹅鹅鹅gg

最新推荐文章于 2024-08-12 21:15:00 发布

阅读量1.4k

点赞数 1

分类专栏： uni-app 文章标签： uni-app

本文链接：https://blog.csdn.net/wyl_gg/article/details/110670766

版权

本文介绍了uni-app的跨域配置方法，详细讲解了vue.config.js的设置。同时，文章涵盖了uni-app的打包流程、路由跳转方式，如navigateTo、redirectTo等。还讨论了tabbar配置、组件使用、基础语法、生命周期、nvue的特点以及数据存储和获取的方法。此外，探讨了在uni-app中css像素单位rpx的适用场景和计算方式。

摘要由CSDN通过智能技术生成

uni-app跨域的解决以及如何封住api，请求接口

let request = function(url, data = {
   }, method = "GET") {
   
	return new Promise((resolve, reject) => {
   
		uni.showLoading({
   
			title: "加载中",
			mask: true,
		});
		uni.request({
   
			url, //真实接口地址。
			data, //参数
			method, //请求的方式
			header: {
   
				'token':uni.getStorageSync("token")
			},
			// 成功使用resolve
			success: (res) => {
   
				resolve(res)
			},
			//失败调用reject
			fail: (err) => {
   
				reject(err)
			},
		});
		setTimeout(function() {
   
			uni.hideLoading();
		}, 2000);
	})

}


module.exports = {
   
	request,
}

配置 vue.config.js

module.exports = {
   
 devServer: {
   
          //设置代理
        proxy: {
   
            '/api' : {
   
                target: "http://ceshi2.dishait.cn/api/v1",//域名
                changeOrigin: true,//开启代理
                pathRewrite: {
   
                    '^/api' : '/'
                }
              }
          }
      }
};

async tabs() {
   
		let {
   
			 data: tab
			} = await request("/api/postclass")
			console.log(tab)
			for (let i = 0; i < tab.data.list.length; i++) {
   
			this.tab.push(tab.data.list[i].classname)
		}
	},