前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >flyio 无感刷新token

flyio 无感刷新token

作者头像
全栈程序员站长
发布2022-10-04 21:46:54
8520
发布2022-10-04 21:46:54
举报

大家好,又见面了,我是你们的朋友全栈君。

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

代码语言:javascript
复制
npm install flyio
代码语言:javascript
复制
var Fly=require('flyio/dist/npm/wx');
var fly=new Fly();
代码语言:javascript
复制
<!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"/>
<!--[if lt IE 9]>
<script src="//cdn.bootcss.com/es5-shim/4.5.9/es5-shim.min.js"></script>
<script src="//cdn.bootcss.com/es5-shim/4.5.9/es5-sham.min.js"></script>
<script src="//cdn.bootcss.com/json3/3.3.2/json3.min.js"></script>
<![endif]-->
<!--[if lt IE 10]>
<script src="//cdn.bootcss.com/jquery-placeholder/2.3.1/jquery.placeholder.min.js"></script>
<![endif]-->
<!--<script src="https://cdn.bootcss.com/axios/0.16.2/axios.js"></script>-->
<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()
代码语言:javascript
复制
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://javaforall.cn/195944.html原文链接:https://javaforall.cn

本文参与 腾讯云自媒体分享计划,分享自作者个人站点/博客。
原始发表:2022年9月8日 下,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体分享计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
相关产品与服务
云开发 CloudBase
云开发(Tencent CloudBase,TCB)是腾讯云提供的云原生一体化开发环境和工具平台,为200万+企业和开发者提供高可用、自动弹性扩缩的后端云服务,可用于云端一体化开发多种端应用(小程序、公众号、Web 应用等),避免了应用开发过程中繁琐的服务器搭建及运维,开发者可以专注于业务逻辑的实现,开发门槛更低,效率更高。
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档