axios

1.简介

Axios 是一个基于promise的HTTP库，可以用在浏览器和node.js中。

官方网站 http://www.axios-js.com/zh-cn/docs/

2.特性

1. 从浏览器中创建 XMLHttpRequests
2. 从 node.js 创建 http 请求
3. 支持 Promise API
4. 拦截请求和响应
5. 转换请求数据和响应数据
6. 取消请求
7. 自动转换 JSON 数据
8. 客户端支持防御 XSRF

3.安装

$ npm install axios

4.代码封装

1.创建axios实例
const service = axios.create({
baseURL: ‘/api’, // api base_url
timeout: 6000 // 请求超时时间
})
2.拦截器
请求拦截器

// 添加请求拦截器
axios.interceptors.request.use(config => {
    // 在发送请求之前做些什么
    config.headers['Access-Token'] = token
    config.headers['X-Requested-With'] = 'XMLHttpRequest'
    return config;
  }, err);
// 添加响应拦截器
 service.interceptors.response.use((response) => {
   // 对响应数据做点什么
    return response;
}, err)

网络请求部分

// post
export function postAction (url, parameter) {
  return axios({
    url: url,
    method: 'post',
    data: parameter
  })
}
// put
export function putAction (url, parameter) {
  return axios({
    url: url,
    method: 'put',
    data: parameter
  })
}

// get
export function getAction (url, parameter) {
  return axios({
    url: url,
    method: 'get',
    params: parameter
  })
}
// deleteAction
export function deleteAction (url, parameter) {
  return axios({
    url: url,
    method: 'delete',
    params: parameter
  })
}
/**
 * 下载文件 用于excel导出
 * @param url
 * @param parameter
 * @returns {*}
 */
export function downFile (url, parameter) {
  return axios({
    url: url,
    params: parameter,
    method: 'get',
    responseType: 'blob'
  })
}
/**
 * 下载文件 用于excel导出,自定义用于post请求
 * @param url
 * @param parameter
 * @returns {*}
 */
export function exportXsl (url, parameter) {
  return axios({
    url: url,
    data: parameter,
    method: 'post',
    responseType: 'blob'
  })
}