flyio 无感刷新token

朱雀 2022-09-11 08:26 135阅读 0赞

[https://www.jianshu.com/p/b37a86fe0ac7?utm\_campaign=maleskine&utm\_content=note&utm\_medium=seo\_notes&utm\_source=recommendation][https_www.jianshu.com_p_b37a86fe0ac7_utm_campaign_maleskine_utm_content_note_utm_medium_seo_notes_utm_source_recommendation]

npm install flyio

var Fly=require('flyio/dist/npm/wx');
    var fly=new Fly();

<!DOCTYPE html>
    <html>
    <head lang="zh-cmn-Hans">
        <meta charset="UTF-8">
        <title>Fly.js Demo</title>
        <meta name="renderer" content="webkit">
        <meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1">
        <meta name="viewport" content="width=device-width,initial-scale=0.5,user-scalable=no"/>
        
        
        
        <script src="../dist/fly.js"></script>
    
    </head>
    <style>
        html {
            font-size: 20px;
            -webkit-user-select: none;
        }
    </style>
    <body>
    <div style="background: teal; font-size: 38px; color: #ffef68; text-shadow: 2px 2px 5px #ffef68; width: 400px; height: 400px; text-align: center">
        <div style="padding-top: 100px"> Fly.js</div>
    </div>
    open console panel to view log.
    <script>
    
        //import fly from "../index";
    
        var csrfToken = "";
        //定义公共headers
        fly.config.headers = {"x-tag": "flyio"}
        fly.config.baseURL = "http://www.dtworkroom.com/doris/1/2.0.0/"
        var newFly = new Fly;
        newFly.config = fly.config;
        var log = console.log
        fly.interceptors.request.use(function (request) {
            log(`发起请求：path:${request.url}，baseURL:${request.baseURL}`)
            if (!csrfToken) {
                log("没有token，先请求token...");
                //锁定当天实例，后续请求会在拦截器外排队
                fly.lock();
                return newFly.get("/token").then((d) => {
                    request.headers["csrfToken"] = csrfToken = d.data.data.token;
                    log("token请求成功，值为: " + d.data.data.token);
                    log(`继续完成请求：path:${request.url}，baseURL:${request.baseURL}`)
                    return request
                }).finally(() => fly.unlock()) //解锁后，会继续发起请求队列中的任务
            } else {
                request.headers["csrfToken"] = csrfToken;
            }
        })
    
        //  response interceptors
        fly.interceptors.response.use(
            function (response) {
                log("interceptors.response", response)
                //验证失效
                if (response.data.data.tokenExpired) {
                    log("token失效，重新请求token...");
                    this.lock(); //锁定响应拦截器
                    return newFly.get("/token")
                        .then((d) => {
                            csrfToken = d.data.data.token;
                            log("token已更新，值为: " + csrfToken);
                        })
                        .finally(() => this.unlock())
                        .then(() => {
                            log(`重新请求：path:${response.request.url}，baseURL:${response.request.baseURL}`)
                            return fly.request(response.request);
                        })
                } else {
                    return response.data.data;
                }
            },
            function (err) {
                log("error-interceptor", err)
            }
        )
    
        fly.get("/test?tag=1")
            .then(function (d) {
                log("请求成功:", d)
            }).catch(function (e) {
            log("请求失败", e)
        })
        fly.get("/test?tag=2")
            .then(function (d) {
                log("请求成功:", d)
            }).catch(function (e) {
            log("请求失败", e)
        })
        fly.get("/test?tag=3")
            .then(function (d) {
                log("请求成功:", d)
            }).catch(function (e) {
            log("请求失败", e)
        })
    
    </script>
    </body>
    </html>
    
    new Promise()

import store from '@/store'
    import config from './config.js'
    import Base64 from './base64.js'
    import { 
    	refreshToken
    } from '@/api/user'
    // H5版本
    // #ifdef H5
    import Fly from "flyio/dist/npm/fly"
    // #endif
    //微信小程序和APP版本
    // #ifndef H5
    import Fly from "flyio/dist/npm/wx"
    // #endif
    const request = new Fly();
    let base64 = new Base64();
    request.interceptors.request.use(function(request) { 
    	request.baseURL = config.baseURL;
    	const token = store.state.user.token;
    	request.headers['Authorization'] = `Basic ${ base64.encode(`${ config.clientId}:${ config.clientSecret}`)}`;
    	if (token) { 
    		request.headers['Blade-Auth'] = 'bearer ' + token
    	} else { 
    		request.headers['Tenant-Id'] = config.tenantId
    	}
    	if (request.method === 'POST' && request.headers['Content-Type'] !== 'multipart/form-data') { 
    		uni.showLoading({ 
    			title: '',
    			mask: true
    		});
    		setTimeout(()=>{ 
    			uni.hideLoading()
    		},800)
    		request.body = { 
    			...request.body,
    			_t: Date.parse(new Date()) / 1000
    		}
    	} else if (request.method === 'GET') { 
    		request.params = { 
    			_t: Date.parse(new Date()) / 1000,
    			...request.params
    		}
    	}
    	return request
    })
    request.interceptors.response.use(function(response) { 
    	console.log(response,"responense")
    	// uni.hideLoading();
    	return response.data
    }, function(error) { 
    	console.log(error, "***********************************")
    	// uni.hideLoading();
    	let pages = getCurrentPages();
    	console.log(pages)
    	let route = pages[pages.length-1].route;
    	if(route.indexOf('registerLogin') != -1) return;
    	console.log(pages)
    	if (error.response.data.code == 401) { 
    		// uni.hideLoading();
    		this.lock();
    		let _this = this;
    		setTimeout(()=>{ 
    			_this.unlock();
    		},0)
    		return store.dispatch('refreshToken')
    			.then(res => { 
    				console.log(res,"SSSSSSSSSSS")
    				_this.unlock()
    				return request.request(error.request);
    			})
    			.finally(() => _this.unlock())
    			.then(() => { 
    				console.log(`重新请求：path:${ error.request.url}，baseURL:${ error.response.baseURL}`)
    				return request.request(error.request);
    			})
    		
    		// let request = error.request;
    		// let headers = {}
    		// headers['Authorization'] =
    		// `Basic ${base64.encode(`${config.clientId}:${config.clientSecret}`)}`;
    		// const token = store.state.user.token;
    		// if (token) { 
    		// headers['Blade-Auth'] = 'bearer ' + token
    		// } else { 
    		// headers['Tenant-Id'] = config.tenantId
    		// }
    		// let data = {...request.body}
    		// refreshToken(store.state.user.refreshToken, store.state.user.tenantId).then(res => { 
    		// console.log(res, "AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA")
    		// if (res.access_token) { 
    		// store.commit('SET_TOKEN', res.access_token)
    		// headers['Blade-Auth'] = 'bearer ' + res.access_token
    		// uni.showLoading({ 
    		// mask: true
    		// })
    		// uni.request({ 
    		// url: request.baseURL + request.url,
    		// header: headers,
    		// method: request.method,
    		// data,
    		// success: res => { 
    		// console.log(res, "真他吗成了")
    		// console.log(store.state.user.token, "0000000000")
    		// uni.hideLoading();
    		// if (request.method === 'GET') { 
    
    		// } else { 
    		// uni.navigateBack({ 
    		// delta: 1
    		// })
    		// }
    		// },
    		// fail: err => { 
    		// console.log("失败了")
    		// }
    		// })
    		// } else { 
    		// uni.reLaunch({ 
    		// url: '/pages/public/registerLogin/registerLogin'
    		// })
    		// setTimeout(() => { 
    		// uni.showModal({ 
    		// content: '当前登录已过期，请重新登录',
    		// showCancel: false,
    		// confirmColor: '#FF6600',
    		// success: (res) => { 
    		// if (res.confirm) { 
    		// console.log('用户点击确定');
    		// }
    		// }
    		// });
    		// }, 200)
    		// }
    		// })
    	}
    })
    
    export default request
    export { 
    	request
    }

[https_www.jianshu.com_p_b37a86fe0ac7_utm_campaign_maleskine_utm_content_note_utm_medium_seo_notes_utm_source_recommendation]: https://www.jianshu.com/p/b37a86fe0ac7?utm_campaign=maleskine&utm_content=note&utm_medium=seo_notes&utm_source=recommendation