当前位置: 首页 > news >正文

js 获取token并保存30分钟,过期重新获取

小记一下:

thirdToken.js

import axios from 'axios';// 模拟获取 token 的函数
function fetchToken() {return new Promise((resolve, reject) => {//请求地址let url = `${THIRD_URL}/login`;let params = {"telephone": THIRD_ACCOUNT.telephone,"password": THIRD_ACCOUNT.password,};axios.post(url, params).then(res => {console.log("获取 token 成功", res);if (res.status === 200) {const newToken = res.data.data.token; // 直接获取 tokenresolve(newToken); // 请求成功后返回 token} else {reject(new Error("获取 token 失败")); // 请求失败时调用 reject}}).catch(error => {console.error("请求出错", error);reject(error); // 捕获请求错误并调用 reject});});
}// 存储 token 的函数
async function storeToken() {const token = await fetchToken();const expirationTime = Date.now() + 30 * 60 * 1000; // 当前时间加上 30 分钟,单位是毫秒// 存储 token 和有效时间localStorage.setItem('token', token);localStorage.setItem('tokenExpiration', expirationTime);
}// 获取 token 的函数
function getToken() {const token = localStorage.getItem('token');const expirationTime = localStorage.getItem('tokenExpiration');// 检查 token 是否存在以及是否过期if (token && expirationTime) {const currentTime = Date.now();if (currentTime < expirationTime) {// Token 有效return token;} else {// Token 过期,清除无效 tokenlocalStorage.removeItem('token');localStorage.removeItem('tokenExpiration');console.log("Token 已过期, 需要重新获取");}} else {console.log("Token 不存在, 需要获取");}return null; // Token 不可用
}// 使用 token 的示例  30分钟过期 重新获取
async function getThridToken() {let token = getToken(); // 从本地获取 tokenif (!token) {await storeToken(); // 如果 token 不可用,重新获取并存储token = getToken(); // 再次获取 token}return token; // 返回有效的 token
}export default getThridToken;

使用 import getThridToken from "@/utils/thirdToken";

 try {//需要鉴权 获取tokenconst token = await getThridToken();console.log("获取到的 Token:", token);} catch (error) {console.error("获取 token 失败:", error);}


http://www.mrgr.cn/news/70880.html

相关文章:

  • 论文阅读《机器人状态估计中的李群》
  • WPF 应用程序中使用 Prism 框架时,有多种方式可以注册服务和依赖项
  • 外呼系统的功能都有哪些,怎么去选择?
  • npm i忽略依赖冲突
  • 13、DHCP和FTP协议
  • EasyExcel级联下拉
  • 比特大陆/算能科技嵌入式面试题及参考答案
  • VMware(虚拟机)下的 Windows 10系统安装Vmwere Tools的详细教程
  • 软件开发的具体流程与管理规章制度规范,项目管理文件,开发过程文件(Word原件)
  • vue-h5:在h5中实现相机拍照加上身份证人相框和国徽框
  • 高阶智驾「扔下」价格“炸弹”
  • 酒店叮咚门铃的类型有哪些
  • HTMLCSS 打造的酷炫菜单选项卡
  • 智能科技赋能金融决策:中阳科技的数据分析解决方案
  • 如何使用亿图脑图MindMaster大纲功能
  • 3175. 找到连续赢 K 场比赛的第一位玩家
  • C# 委托与匿名方法
  • 微知-tar命令如何只查看tgz文件内容不解压
  • 精品案例PPT | 企业架构及典型设计方案
  • 大数据应用开发——实时数据采集
  • Vue.js 组件开发详解
  • 斗破QT编程入门系列之四:GUI应用程序设计基础:UI文件设计原理与运行机制(五星斗师)
  • 腾讯云边缘安全加速平台EdgeOne最佳实践
  • 拾贝(Shibei):微信读书笔记管理的新篇章
  • 如何使用Flask编写一个网站
  • Ubuntu 20.04配置ollama并下载安装调用本地大语言模型