[Axios] axios的请求合并以及参数配置

axios的请求合并以及参数配置

参考简书1

参考简书2

并发请求 – 处理并发请求的助手函数

axios.all(iterable) – iterable是一个可以迭代的参数如数组等

let sendAry = [axios.get('get获取的地址1'),axios.get('get获取的地址2'),axios.post('post获取的地址')
];
//=>三个请求都完成才做一些事情（可以基于ALL实现）
axios.all(sendAry).then(result => {console.log(result);//=>输出是一个数组，分别存储每一个请求的结果let [resA, resB, resC] = result;
});

axios.spread(callback) – callback要等到所有请求都完成才会执行

module.exports = function spread(callback) {return function wrap(arr) {return callback.apply(null, arr);};
};
let wrap = axios.spread(() => {});
axios.all(sendAry).then(axios.spread((resA, resB, resC) => {//=>RES-A/-B/-C分别代表三次请求的结果
//=>原理是JS中的柯理化函数
}));

配置config来发送请求

axios(config)

//发送一个`POST`请求
axios({method:"POST",url:'post请求地址',data:{firstName:"Fred",lastName:"Flintstone"}
});

axios(url[,config])

//发送一个`GET`请求（默认的请求方式）
axios('get请求地址');

请求方式的别名

axios.request(config);axios.get(url[,config]);axios.delete(url[,config]);axios.head(url[,config]);axios.post(url[,data[,config]]);axios.put(url[,data[,config]])axios.patch(url[,data[,config]])

初始化常用配置

baseURL – 默认地址

axios.defaults.baseURL = '地址';

validateStatus – 状态码,回复状态resolve或者reject promise

默认状态码

validateStatus:function(status){return status >= 200 && status <300;//default
}

自定义成功失败规则 – resolve/reject

axios.defaults.validateStatus = function validateStatus(status) {//=>自定义成功失败规则：RESOLVE / REJECT（默认规则：状态码以2开头算作成功）return /^(2|3)\d{2}$/.test(status);
};

timeout – 延迟时间

axios.defaults.timeout = 3000;

headers – 设置请求头信息

headers: {'X-Requested-With':'XMLHttpRequest'}

params – GET传参

axios.defaults.params={};//=>GET传参

data – POST传参

axios.defaults.data={};//=>POST传参

支持格式 – 默认RAW – 常用URL-ENCODEED

//设置在POST请求中基于请求主体向服务器发送内容的格式，默认是RAW，项目中常用的是URL-ENCODEED格式
axios.defaults.headers['Content-Type'] = 'appliction/x-www-form-urlencoded';

common – 当实例创建时候修改配置

axios.defaults.headers.common['Authorization'] = AUTH_TOKEN;

设置响应拦截器 – 分别在响应成功和失败的时候做一些拦截处理（在执行成功后设定的方法之前，先会执行拦截器中的方法）

axios.interceptors.response.use(function success(result) {return result.data;
}, function error() {})

transformRequest – 允许在请求数据发送到服务器之前对其进行更改

axios.defaults.transformRequest = data => {//=>DATA:就是请求主体中需要传递给服务器的内容（对象）let str = ``;for (let attr in data) {if (data.hasOwnProperty(attr)) {str += `${attr}=${data[attr]}&`;}}return str.substring(0, str.length - 1);
};

[Axios] axios的请求合并以及参数配置相关推荐

axios 登录后设置header,vue+axios 全局添加请求头和参数操作
vue+axios 全局添加请求头和参数操作走登录的接口都会返回一个 token 值, 然后存起来方便之后调接口的时候给后台传过去, 传给后台的方式有两种:(具体使用哪种需要和后台商量) 1, 放在 ...
axios 最全请求拦截器响应拦截器配置公共请求头超时时间以及get delete post put 四种请求传参方式
axios 拦截器请求拦截器请求拦截器的作用是在请求发送前进行一些操作例如在每个请求体里加上token,统一做了处理如果以后要改也非常容易响应拦截器响应拦截器的作用是在接收到响应后进行一些操 ...
【跨域问题】Vue简单封装axios—解决post请求后端接收不到参数问题
原因分析: 1. 传参数据没有序列化? 解决办法: [推荐] [推荐阅读] vue+axios+qs序列化 "三步解析"[含demo实例]- 代码篇 2. 服务端接受数据格式参数配 ...
axios使用post请求的时候后台接收不到参数
2019独角兽企业重金招聘Python工程师标准>>> import axios from "axios"; import qs from "qs&qu ...
axios （get post请求、头部参数添加）傻瓜式入门axios
傻瓜式入门,简单粗暴说用法通过cdn引入js文件 <script src="https://unpkg.com/axios/dist/axios.min.js">&l ...
axios使用post请求服务端不能获取参数的解决方法
项目中使用到axios作为ajax请求插件,用到post请求是常见的,诸如以下场景的一个普通的post请求: export function listManage(params) { retu ...
vuecli+axios的post请求传递参数异常
vuecli+axios的post请求传递参数异常参考文章: (1)vuecli+axios的post请求传递参数异常 (2)https://www.cnblogs.com/yanqiong/p/1 ...
Vue-cli3.x中使用Axios发送跨域请求的配置方法
Vue-cli3.x中使用Axios发送跨域请求的配置方法安装axios npm i axios -s main.js中引入 import axios from 'axios'//将axios挂载在 ...
axios 之 post请求参数格式不正确得问题
问题是这样得,今天用axios 发起要给post请求,参照官方写得请求过后发现后台拿不到数据,找了很久发现了问题: 就是axios发起post请求得时候发送过去的数据成了键,而值是空就是 ...

[Axios] axios的请求合并以及参数配置

axios的请求合并以及参数配置

[Axios] axios的请求合并以及参数配置相关推荐

最新文章

热门文章