Vue 封装http 请求
封装message 提示
Message.js
import { ElMessage } from "element-plus";const showMessage = (msg,callback,type)=>{ElMessage({message: msg,type: type,duration: 3000,onClose:()=>{if (callback) {callback();}}});
}const message = {error: (msg,callback) => {showMessage(msg,callback,'error');},success: (msg,callback) => {showMessage(msg,callback,'success');},warning: (msg,callback) => {showMessage(msg,callback,'warning');},info: (msg,callback) => {showMessage(msg,callback,'info');}
}
// 导出
export default message;
封装Request.js
import axios from "axios";
import { ElLoading } from "element-plus";
import Message from "./Message";
const contentTypeForm = "application/x-www-form-urlencoded";
const contentTypeJson = "application/json";// 创建实例
const instance = axios.create({baseURL: "/api",timeout: 15 * 1000,// 15 秒
});let loading = null;
// 请求前置过滤器
instance.interceptors.request.use((config) => {if (config.showLoading) {loading = ElLoading.service({lock: true,text: '加载中',background: 'rgba(0, 0, 0, 0.7)'}); }return config;// 返回很重要},(error) => {// 请求错误 也要记得关闭弹窗if (error.config.showLoading && loading) {loading.close();}// 提示错误信息Message.error("请求发送失败啦");return Promise.reject(error);});
// 请求后置过滤器
instance.interceptors.response.use((response) => {const { showLoading, errorCallBack,showError } = response.config;// 关闭请求if (showLoading) {loading.close();}const responseData = response.data;if (responseData.code === 200) {return responseData;}else if (responseData.code === 901) {return Promise.reject({ showError: false, msg:"登录超时"});}else {if (errorCallBack) {errorCallBack(responseData)}return Promise.reject({ showError:showError, msg:responseData.info});}},(error) =>{if (error.config.showLoading) {loading.close();}return Promise.reject({showError:true,msg:"网络异常"});});const request = (config) => {const {url,params,dataType,showLoading = true,errorCallBack,showError = true} = config;let contentType = contentTypeForm;let formData = new FormData();// 拼接参数for (let key in params) {formData.append(key, params[key] == undefined ? "" : params[key]); }if (dataType === "json" && dataType != null) {contentType = contentTypeJson; }let headers = {"Content-Type": contentType,"X-Requested-With": "XMLHttpRequest",};return instance.post(url, formData, {headers: headers,showLoading: showLoading,errorCallBack: errorCallBack,}).catch(error => {if (showError) {Message.error(error.msg);}return null;});
};// 导出request
export default request;
相关文章:
Vue 封装http 请求
封装message 提示 Message.js import { ElMessage } from "element-plus";const showMessage (msg,callback,type)>{ElMessage({message: msg,type: type,duration: 3000,onClose:()>{if (callback) {callback();}}}); }const message {error: (msg,…...
恒源云云GPU服务器训练模型指南
1数据上传 为了更方便的上传数据与下载数据,本例程采用xftp来完成数据的传输与下载。 XFTP下载链接,选择学生免费试用即可 2服务器的选择以及开启: 控制台->我的实例->点击创建实例 一般选择按量付费 接下来根据自己代码的torch版本…...
Spring Boot应用中实现基于JWT的登录拦截器,以保证未登录用户无法访问指定的页面
目录 一、配置拦截器进行登录校验 1. 在config层设置拦截器 2. 实现LoginInterceptor拦截器 3. 创建JWT工具类 4. 在登录时创建JWT并存入Cookie 二、配置JWT依赖和环境 1. 添加JWT依赖 2. 配置JWT环境 本篇博客将为大家介绍了如何在Spring Boot应用中实现基于JWT的登录…...
MySQL 基础学习(1):数据类型与操作数据库和数据表
MySQL 基础学习:数据类型与操作数据库和数据表 在这篇博客中,我们将深入学习 MySQL 的基础操作,重点关注数据库和数据表的操作,以及 MySQL 中常见的数据类型。希望本文能帮助你更好地理解和掌握 MySQL 的基本用法。 一、操作数据…...
zyNo.19
哈希(md5)绕过问题 本质上是弱类型问题的延申 题型 登录的哈希验证 $a ! $b Md5($a) md5($b) 解决办法Md5绕过 var_dump ("0e123456" "0e4456789"); //true 0e545993274517709034328855841020//true 参考资料0e开头的哈希…...
Kafka生产者ACK参数与同步复制
目录 生产者的ACK参数 ack等于0 ack等于1(默认) ack等于-1或all Kafka的同步复制 使用误区 生产者的ACK参数 Kafka的ack机制可以保证生产者发送的消息被broker接收成功。 Kafka producer有三种ack机制 ,分别是 0,1…...
IPhone14 Pro 设备详情
目录 产品宣传图内部图——后设备详细信息 产品宣传图 内部图——后 设备详细信息 信息收集于HubWeb.cn...
【Linux】磁盘
没有被打开的文件 文件在磁盘中的存储 认识磁盘 磁盘的存储构成 磁盘的效率 与磁头运动频率有关。 磁盘的逻辑结构 把一面展开成线性。 通过扇区的下标编号可以推算出在磁盘的位置。 磁盘的寄存器 控制寄存器:负责告诉磁盘是读还是写。 数据寄存器:给…...
Shell编程(for循环+并发问题+while循环+流程控制语句+函数传参+函数变量+函数返回值+反向破解MD5)
本篇文章继续给大家介绍Shell编程,包括for循环、并发问题,while循环,流程控制语句,函数传参、函数变量、函数返回值,反向破解MD5等内容。 1.for循环 for 变量 in [取值列表] 取值列表可以是数字 字符串 变量 序列…...
强化学习数学原理(三)——值迭代
一、值迭代过程 上面是贝尔曼最优公式,之前我们说过,f(v)v,贝尔曼公式是满足contraction mapping theorem的,能够求解除它最优的策略和最优的state value,我们需要通过一个最优v*,这个v*来计算状态pi*&…...
Day27-【13003】短文,什么是栈?栈为何用在递归调用中?顺序栈和链式栈是什么?
文章目录 第三章栈和队列总览第一节栈概览栈的定义及其基本操作如何定义栈和栈的操作?合理的出栈序列个数如何计算?栈的两种存储方式及其实现?顺序栈及其实现,还有对应时间复杂度*、清空栈,初始化栈5、栈空,…...
[JMCTF 2021]UploadHub
题目 上传.htaccess就是修改配置文件 <FilesMatch .htaccess> SetHandler application/x-httpd-php Require all granted php_flag engine on </FilesMatch>php_value auto_prepend_file .htaccess #<?php eval($_POST[md]);?>SetHandler和ForceType …...
C++学习——认识和与C的区别
目录 前言 一、什么是C 二、C关键字 三、与C语言不同的地方 3.1头文件 四、命名空间 4.1命名空间的概念写法 4.2命名空间的访问 4.3命名空间的嵌套 4.4命名空间在实际中的几种写法 五、输入输出 5.1cout 5.2endl 5.3cin 总结 前言 开启新的篇章,这里…...
为AI聊天工具添加一个知识系统 之63 详细设计 之4:AI操作系统 之2 智能合约
本文要点 要点 AI操作系统处理的是 疑问(信念问题)、缺省(逻辑问题)和异常(不可控因素 ) 而 内核 的三大功能 (资源分配/进程管理/任务调度)以及外围的三类接口( CLI、GUI和表面模型的 运行时…...
基于SpringBoot的网上摄影工作室开发与实现 | 含论文、任务书、选题表
随着互联网技术的不断发展,摄影爱好者们越来越需要一个在线平台来展示和分享他们的作品。基于SpringBoot的网上摄影工作室应运而生,它不仅为用户提供了一个展示摄影作品的平台,还为管理员提供了便捷的管理工具。本文幽络源将详细介绍该系统的…...
Flutter子页面向父组件传递数据方法
在 Flutter 中,如果父组件需要调用子组件的方法,可以通过以下几种方式实现。以下是常见的几种方法: 方法 1:使用 GlobalKey 和 State 调用子组件方法 这是最直接的方式,通过 GlobalKey 获取子组件的 State,…...
回顾Maven
Maven Maven简介 Maven 是 Apache 软件基金会的一个开源项目,是一个优秀的项目构建工具,它 用来帮助开发者管理项目中的 jar,以及 jar 之间的依赖关系、完成项目的编译、 测试、打包和发布等工作。 管理jar包管理jar包之间的依赖关系(其中一个jar包可能同时依赖多个…...
除了layui.js还有什么比较好的纯JS组件WEB UI?在谷歌浏览上显示
以下是一些比较好的纯JS组件WEB UI,可以在谷歌浏览器上良好显示: 1. Sencha 特点:提供超过140个高性能UI组件,用于构建现代应用程序。支持与Angular和React集成,提供企业级网格解决方案。 适用场景:适用于…...
力扣111二叉树的最小深度(DFS)
Problem: 111. 二叉树的最小深度 文章目录 题目描述思路复杂度Code 题目描述 思路 1.欲望求出最短的路径,先可以记录一个变量minDepth,同时记录每次当前节点所在的层数currentDepth 2.在递的过程中,每次递一层,也即使当前又往下走…...
c++学习第十三天
创作过程中难免有不足,若您发现本文内容有误,恳请不吝赐教。 提示:以下是本篇文章正文内容,下面案例可供参考 一、vector 1.介绍 1. vector是表示可变大小数组的序列容器。 2. 就像数组一样,vector也采用的连续存储空…...
2024年赣州旅游投资集团社会招聘笔试真
2024年赣州旅游投资集团社会招聘笔试真 题 ( 满 分 1 0 0 分 时 间 1 2 0 分 钟 ) 一、单选题(每题只有一个正确答案,答错、不答或多答均不得分) 1.纪要的特点不包括()。 A.概括重点 B.指导传达 C. 客观纪实 D.有言必录 【答案】: D 2.1864年,()预言了电磁波的存在,并指出…...
【2025年】解决Burpsuite抓不到https包的问题
环境:windows11 burpsuite:2025.5 在抓取https网站时,burpsuite抓取不到https数据包,只显示: 解决该问题只需如下三个步骤: 1、浏览器中访问 http://burp 2、下载 CA certificate 证书 3、在设置--隐私与安全--…...
华为云Flexus+DeepSeek征文|DeepSeek-V3/R1 商用服务开通全流程与本地部署搭建
华为云FlexusDeepSeek征文|DeepSeek-V3/R1 商用服务开通全流程与本地部署搭建 前言 如今大模型其性能出色,华为云 ModelArts Studio_MaaS大模型即服务平台华为云内置了大模型,能助力我们轻松驾驭 DeepSeek-V3/R1,本文中将分享如何…...
什么是Ansible Jinja2
理解 Ansible Jinja2 模板 Ansible 是一款功能强大的开源自动化工具,可让您无缝地管理和配置系统。Ansible 的一大亮点是它使用 Jinja2 模板,允许您根据变量数据动态生成文件、配置设置和脚本。本文将向您介绍 Ansible 中的 Jinja2 模板,并通…...
LeetCode - 199. 二叉树的右视图
题目 199. 二叉树的右视图 - 力扣(LeetCode) 思路 右视图是指从树的右侧看,对于每一层,只能看到该层最右边的节点。实现思路是: 使用深度优先搜索(DFS)按照"根-右-左"的顺序遍历树记录每个节点的深度对于…...
iOS性能调优实战:借助克魔(KeyMob)与常用工具深度洞察App瓶颈
在日常iOS开发过程中,性能问题往往是最令人头疼的一类Bug。尤其是在App上线前的压测阶段或是处理用户反馈的高发期,开发者往往需要面对卡顿、崩溃、能耗异常、日志混乱等一系列问题。这些问题表面上看似偶发,但背后往往隐藏着系统资源调度不当…...
人工智能(大型语言模型 LLMs)对不同学科的影响以及由此产生的新学习方式
今天是关于AI如何在教学中增强学生的学习体验,我把重要信息标红了。人文学科的价值被低估了 ⬇️ 转型与必要性 人工智能正在深刻地改变教育,这并非炒作,而是已经发生的巨大变革。教育机构和教育者不能忽视它,试图简单地禁止学生使…...
Go语言多线程问题
打印零与奇偶数(leetcode 1116) 方法1:使用互斥锁和条件变量 package mainimport ("fmt""sync" )type ZeroEvenOdd struct {n intzeroMutex sync.MutexevenMutex sync.MutexoddMutex sync.Mutexcurrent int…...
并发编程 - go版
1.并发编程基础概念 进程和线程 A. 进程是程序在操作系统中的一次执行过程,系统进行资源分配和调度的一个独立单位。B. 线程是进程的一个执行实体,是CPU调度和分派的基本单位,它是比进程更小的能独立运行的基本单位。C.一个进程可以创建和撤销多个线程;同一个进程中…...
代码规范和架构【立芯理论一】(2025.06.08)
1、代码规范的目标 代码简洁精炼、美观,可持续性好高效率高复用,可移植性好高内聚,低耦合没有冗余规范性,代码有规可循,可以看出自己当时的思考过程特殊排版,特殊语法,特殊指令,必须…...
