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

uni-app 接口封装,token过期,自动获取最新的token

一、文件路径截图

        

2、新建一个文件app.js

let host='http://172.16.192.40:8083/jeecg-boot/'  //本地接口
let myApi = {login: `${host}wx/wxUser/login`, //登录
}
module.exports = myApi

3、新建一个文件request.js
        

import myApi from '@/utils/app.js';
export const request = (options) => {console.log(options, `调用接口`)return new Promise((resolve, reject) => {const WXUSER = uni.getStorageSync('WXUSER');if (!options.url)  return console.error('请传入URL')else  sendRequest(options, resolve, reject);})
};
//封装的发送请求函数
function sendRequest(options, resolve, reject) {const WXUSER = uni.getStorageSync('WXUSER');uni.request({url: options.url,data: options.data || '',method: options.method || 'POST',header: {"X-Access-Token": WXUSER.rememberToken,  //传递的token},success: (res) => {if (res.data.code == 401) {console.log('返回401,token失效')wxlogin(options).then(() => {sendRequest(options, resolve, reject);});} else resolve(res.data)}})
}
//封装的登录 登陆成功后获取信息
export async function wxlogin(options) {return new Promise((resolve, reject) => {uni.getUserInfo({success: (UserRes) => {uni.login({desc: 'weixin',success: res => {wx.request({url: myApi.login,method: 'POST',data: {weappCode: res.code,},success: res => {if (res.data.success) {console.log(res.data.result.wxUser)const WXUSER = res.data.result.wxUserconst SYSUSER = res.data.result.sysUseruni.setStorageSync('WXUSER',WXUSER);uni.setStorageSync('SYSUSER',SYSUSER);resolve(); // 登录成功后,返回resolve} else {console.log('登录错误', res)reject(); // 登录失败时,返回reject}}});}});}})});
}

4、页面使用
        

<!-- 首页 -->
<template></template><script>import myApi from '@/utils/app.js' //调用接口使用export default {components: {},data() {return {dataSource: [],};},onLoad() {this.loadData()},methods: {async loadData() {try {const res = await this.$request({url: myApi.CcrUgcList,method: 'GET',});console.log(res)if (res.code === 200) {this.dataSource = res.result.records}} catch (e) {// 失败执行console.log(`这个接口错误:${myApi.CcrUgcList}`)} finally {// 执行代码正确、报错都执行}},}};
</script><style lang="scss" scoped></style>

http://www.lryc.cn/news/289944.html

相关文章:

  • AWS免费套餐——云存储S3详解
  • 2723. 两个 Promise 对象相加
  • 【方法论】费曼学习方法
  • Transformer模型 | Pytorch实现Transformer模型进行时间序列预测
  • Git推送大量内容导致http 413错误
  • pytest框架的基本使用
  • C++STL之map、set的使用和模拟实现
  • 100天精通鸿蒙从入门到跳槽——第18天:ArkTS组件状态管理装饰器
  • 【前端】防抖
  • python对图片或文件的操作
  • 架构篇19:单服务器高性能模式-Reactor与Proactor
  • PyInstaller 将 Python 程序生成可直接运行的程序
  • 专有钉钉开发记录,及问题总结
  • Java Swing桌面项目打包成可执行jar
  • python数组反转的几种方式
  • 算法每日一题: 最大合金数 | 二分
  • jvm优化过程
  • 《Docker极简教程》--目录
  • 嵌入式第十二天!(指针数组、指针和二维数组的关系、二级指针)
  • 俄罗斯方块游戏设计文档(基于C语言)
  • 【解决】IntelliJ IDEA 重命名 Shift + F6 失效
  • Unknown encoder ‘libmp3lame
  • Android升级版本兼容问题
  • 微信生成带参数二维码(用户id), 扫码可获取用户id
  • 微信小程序(二十一)css变量-定义页面主题色
  • WSL2 Debian系统添加支持SocketCAN
  • Redis的五种常用数据结构以及其底层实现
  • 防御保护笔记
  • C++笔记之作用域解析符::和命名空间、作用域的关系
  • 回归预测 | MATLAB实现PSO-GRNN粒子群优化广义回归神经网络多输入单输出预测(含优化前后预测可视化)