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

前端vue中怎么判断接口请求返回的时长

废话不多上代码:亲测有效

import axios from 'axios';const httpPlugin = {install(Vue, options) {// 创建axios实例const http = axios.create({baseURL: options.baseURL, // 基础URLtimeout: 10000, // 请求超时时间// 其他配置...});// 请求拦截器http.interceptors.request.use(config => {config.headers.metaTime = new Date().getTime() //首先在请求拦截中加一个时间戳(虽然不准确)// config.method 可以获取get或者post// 可以在这里添加请求头、处理token等return config;}, error => {// 请求错误处理return Promise.reject(error);});// 响应拦截器http.interceptors.response.use(response => {const res = response.datalet endTime = new Date()let durtion = 0if (response.config.headers.metaTime && response.config.headers) {durtion = (endTime.getTime() - response.config.headers.metaTime)console.log(durtion, '请求时长')//这里就可以根据请求时间来做判断}// 对响应数据做处理,例如只返回data部分return response.data;}, error => {// 响应错误处理return Promise.reject(error);});// 将axios实例挂载到Vue原型上,实现全局调用Vue.prototype.$http = http;}
};export default httpPlugin;
config.headers.metaTime = new Date().getTime() //首先在请求拦截中加一个时间戳(虽然不准确)// config.method 可以获取get或者postlet endTime = new Date()let durtion = 0if (response.config.headers.metaTime && response.config.headers) {durtion = (endTime.getTime() - response.config.headers.metaTime)console.log(durtion, '请求时长')//这里就可以根据请求时间来做判断}

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

相关文章:

  • 页面滚动到指定位置——记录div滚动高度,并下次自动滚动到该位置
  • Shopee、Lazada等跨境平台如何获取优质的评价?
  • 09-02 周一 Ubuntu上使用docker-compose部署elasticsearch和kibana服务
  • C#上位机使用Microsoft.Office.Interop.Excel和EPPlus库对Excel或WPS表格进行写操作
  • 移情别恋c++ ദ്ദി˶ー̀֊ー́ ) ——9.模板进阶
  • 【功能自动化】使用HTMLTestRunner生成测试报告
  • 计算机视觉之 SE 注意力模块
  • Excel中格式化日期字符的六种方法
  • 东南大学研究生-数值分析上机题(2023)Python 3 线性代数方程组数值解法
  • css之雪碧图(精灵图)
  • 通过旋转、平移求取矩形顶点坐标
  • 登山第二梯:ROS+VSCode+C++环境配置
  • 编程要由 “手动挡” 变 “自动挡” 了?Cursor+Claude-3.5-Sonnet,Karpathy 点赞的 AI 代码神器。如何使用详细教程
  • osi 7层网络模型
  • 量化交易思维,股票被套,回本应该马上抛掉吗
  • 键盘接入Linux
  • css实现卡片右上角的状态
  • 学习大数据DAY49 考后练习题
  • springboot图书商城
  • PyTorch 2.0常用函数解析与用法