uni-带token请求封装

以你之姓@ 2022-12-04 07:53 233阅读 0赞

在根目录下新建一个文件夹存放tokenRequest.js文件  
![在这里插入图片描述][20200906210651699.png_pic_center]  
tokenRequest.js：

import config from './config.js' //引入地址
    //带Token请求
    const TokenRequest = (opts, data) => { 
    	//此token是登录成功后后台返回保存在storage中的
    	let token = "";
    	if(uni.getStorageSync('token')){ 
    		token = uni.getStorageSync('token');
    		//console.log(token);
    	}
    	//设置默认请求方式
    	let method='POST'
    	if(opts.method){ 
    		method=opts.method
    	}
    	let promise;
    	//配置一下请求参数
    	let DefaultOpts = { 
    		url: config.baseUrl+opts.url, 
    		data: data,
    		method: method,
    		header:{ Authorization: uni.getStorageSync('Authorization')},
    		dataType: 'json',
    	}
    	//if(token){ 
    		//后端验证,后台会对需要验证的接口进行配置，因为不是每个接口都要token认证的
    		promise = new Promise(function(resolve, reject) { 
    			uni.request(DefaultOpts).then(
    				(res) => { 
    					//根据实际情况对请求数据进行操作
    					// console.log(res[1]);
    					if(res[1].data.code == 200 ||res[1].data.code == 400){ 
    						resolve(res[1].data)
    					}
    					if(res[1].data.code == 401){ 
    						// token 过期失效 未登录 跳转登录页面
    						uni.reLaunch({ 
    							url:"/pages/login/login"
    						})
    					}
    					else if(res[1].data.code!=200){ 
    						uni.showToast({ 
    							icon:'none',
    						    title: res[1].data.data,
    						    duration: 2000 
    						}); 
    					 return false
    					}
    				}
    			).catch(
    				(err) => { 
    					reject(err)
    				}
    			)
    		})
    	return promise
    }
     
    // 将对象导出外部引入使用
    export default { 
    	TokenRequest
    }

在main.js中对tokenRequest进行全局应用：

import request from './store/tokenRequest.js';*斜体样式*
    //自己封装的request，可以自己注入并验证token
    Vue.prototype.$request=request

登陆时存入token：

this.userToken = 'Bearer ' + res.data.data.token;//根据返回结果
    this.changeLogin({  Authorization:this.userToken });

调用：

this.$request.TokenRequest({ url:'api/v1/user/getContract?card_number='+_this.card_number,method:'GET'},'').then(res=>{ 
    						console.log(res);
    					})

[20200906210651699.png_pic_center]: /images/20221123/766136dd8391405cace399f3268bc64e.png