axios请求方法封装.
axios的使用上一般封装好对应的方法,ES6导出,直接调用,消息通知使用了ElementUI的Message组件。
这是一个封装了axios的Rest风格的工具类,包扩常用的POST,GET,PUT,DELETE,
在请求处理上使用统一的请求拦截处理。对返回的消息进行拦截预处理,有数据返回数据,没有返回消息。
import axios from 'axios'
import router from '../router'
import { Message } from 'element-ui'; /*
//封装网络请求方法
*/
/**
* 统一处理网络请求的响应拦截处理方式,
*/
axios.interceptors.response.use(success => {
if (success.status && success.status == 200 && success.data.status == 500) {
Message.error({ message: success.data.msg })
return;
}
if (success.data.msg) {
Message.success({ message: success.data.msg })
}
return success.data;
}, error => {
if (error.response.status == 504 || error.response.status == 404) {
Message.error({ message: '服务器被吃了( ╯□╰ )' })
} else if (error.response.status == 403) {
Message.error({ message: '权限不足,请联系管理员' })
} else if (error.response.status == 401) {
Message.error({ message: '尚未登录,请登录' })
router.replace('/');
} else {
if (error.response.data.msg) {
Message.error({ message: error.response.data.msg })
} else {
Message.error({ message: '未知错误!' })
}
}
return;
})
//post请求的封装K-v形式
let base = '';
export const postKeyValueRequest = (url, params) => {
return axios({
method: 'post',
url: `${base}${url}`,
data: params,
transformRequest: [function(data) {
let ret = ''
for (let it in data) {
ret += encodeURIComponent(it) + '=' + encodeURIComponent(data[it]) + '&'
} return ret
}],
headers: {
'Content-Type': 'application/x-www-form-urlencoded',
}
});
}
//传递json的post请求
export const postRequest = (url, params) => {
return axios({
method: 'POST',
url: `${base}${url}`,
data: params,
})
}
// put请求封装
export const putRequest = (url, params) => {
return axios({
method: 'put',
url: `${base}${url}`,
data: params,
})
}
// get请求封装
export const getRequest = (url, params) => {
return axios({
method: 'get',
url: `${base}${url}`,
data: params,
})
}
// delete请求封装
export const deleteRequest = (url, params) => {
return axios({
method: 'delete',
url: `${base}${url}`,
data: params,
})
}
axios请求方法封装.的更多相关文章
- axios浏览器异步请求方法封装 XMLHttpRequest
axios学习笔记defaults(浏览器端异步请求处理方式) 浏览器异步请求方法封装,主要使用XMLHttpRequest lib/adapters/xhr.js //入口 var utils = ...
- 基于promise对小程序http请求方法封装
原因是我不想每次请求都复制粘贴那么长的请求地址,所以我把前边那一坨请求地址作为基础地址,只传后台给的路由就ok,而且,并不是每次请求都要显示正在加载,这对小程序体验很差,所以,我加了个形参,用来判断是 ...
- 通用ajax请求方法封装,兼容主流浏览器
ajax简单介绍 没有AJAX会怎么样?普通的ASP.Net每次运行服务端方法的时候都要刷新当前页面. 假设没有AJAX,在youku看视频的过程中假设点击了"顶.踩".评论.评论 ...
- vue-ajax/axios请求函数封装: axios+promise
项目文件目录/src/api ajax.js /** * ajax 请求函数模块 * 返回值为promise对象 */ import axios from 'axios' export default ...
- axios请求的封装
/* axios的请求封装 */ //axios的原生写法get,post请求 //第一个参数为请求地址,第二个参数为请求的参数,params是将参数拼接在url的后面 ...
- vue+axios请求头封装
import { mapMutations } from 'vuex' import axios from 'axios' import { Toast } from 'mint-ui'; impor ...
- Curl请求方法封装
/** * GET请求 * @param $url * @return bool|mixed */ function http_get($url) { $oCurl = curl_init (); i ...
- PHP——封装Curl请求方法支持POST | DELETE | GET | PUT 等
前言 Curl: https://www.php.net/manual/en/book.curl.php curl_setopt: https://www.php.net/manual/en/fun ...
- 前端axios请求二进制数据流转换生成PDF文件空白问题(终极解决方案)
本文章共1570字,预计阅读时间1 - 3分钟. 问题场景: axios请求二进制数据转换生成PDF空白问题,使用axios请求后端接口,后端返回的二进制流文件,需要转换成PDF,但是在postman ...
随机推荐
- 微软软件开发技术二十年回顾-API篇(转)
二. API篇 随着Windows操作系统开始占据主导地位,开发Windows平台下的应用程序成为人们的需要.当然,这也为传统的DOS程序员提供了一种新的编程方法-一种不受设备限制并由事件驱动的编程方 ...
- 020 ceph作openstack的后端存储
一.使用ceph做glance后端 1.1 创建用于存储镜像的池 [root@serverc ~]# ceph osd pool create images 128 128 pool 'images ...
- $CH$ $0x50$ & $0x51$ 做题记录
[X]$Mr.Young's\ Picture\ Permutations$ 前面这儿写了挺多道辣,,,懒得写辣$QAQ$ (后面所有同上都是同这个$QwQ$ [X]$LCIS$ 做过了,看这儿 $u ...
- 啊哈!C语言课后参考答案下
最近看到一本好评量很高的的C语言入门书,课本真的很好,入门的话.专业性没有那么强,但入门足够了!!好评!看着看着就想把这本书的题课后习题都写出来,最后就有了这个小结.可能有的不是最好,不那么专业,但主 ...
- 1083 是否存在相等的差 (20 分)C语言
给定 N 张卡片,正面分别写上 1.2.--.N,然后全部翻面,洗牌,在背面分别写上 1.2.--.N.将每张牌的正反两面数字相减(大减小),得到 N 个非负差值,其中是否存在相等的差? 输入格式: ...
- 【转】出现“ValueError : numpy.ufunc has the wrong size, try recompiling" 解决方法
出现这个问题的原因是:numpy版本和scikit-learn版本不搭配. 解决方法: 升级numpy即可: pip install -U numpy
- css label两端对齐
上面这种效果很常见,实现的代码如下: html部分 <ul> <li class="detail_item"> <span class="d ...
- java数据库学习路线和必学知识点!
java数据库必学知识点! 分享一下数据库的学习路线和必学的知识点! 掌握mysql,Oracle在各个平台上的安装及使用 Mysql数据库基础 mysql概述.优点.运行原理及内存结构 mysql数 ...
- three.js入门第一个案例
准备工作 1.运用three.js进行3d开发,其实和页面编程一样,首先需要在html文件中引入three.js.Three.js使用面向对象的方式来构建程序,它包含3个基本对象: 场景(scene) ...
- 悄摸直播(二)—— 播流器实现(拉取rtmp服务器中的数据流,播放直播画面)
悄摸直播 -- JavaCV实现本机摄像头画面远程直播 播流器 一.功能说明 从rtmp服务器中获取视频流数据 + 展示直播画面 二.代码实现 /** * 播流器 * @param inputPath ...