[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);
  };