# axios-request

**Repository Path**: eightFlying/axios-request

## Basic Information

- **Project Name**: axios-request
- **Description**: 阅读 axios中文说明 笔记
- **Primary Language**: Unknown
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 1
- **Forks**: 0
- **Created**: 2019-08-21
- **Last Updated**: 2021-02-04

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# axios-request

## 并发请求
```javascript
const a1 = axios.get('api/mock1')
const a2 = axios.post('api/mock2')
axios.all([a1, a2]).then( //两个请求都完成时才回调
axios.spread((val1, val2) => { //spread可对返回的数组进行分割 分割成多个单独的响应对象
    this.result = `${decodeURI(val1.data.content)}<br><br>${decodeURI(val2.data.content)}<br><br>axios.all()组合请求 axios.spread()分割响应`
})
)
```
## 请求配置
```javascript
// 创建请求时可以用的配置选项 axios({...})
// 只有 url 是必需的。如果没有指定 method，请求将默认使用 get 方法

const options = {
    url: 'api/mock1', // `url` 是用于请求的服务器 URL
    method: 'post', // 默认是 get
    baseURL: 'http://avengers.local/', // 将自动加在 `url` 前面，除非 `url` 是一个绝对 URL
    transformRequest: [(data) => `（在向服务器发送前，修改请求数据）${JSON.stringify(data)}`], //允许在向服务器发送前，修改请求数据，只能用在 'PUT', 'POST' 和 'PATCH' 这几个请求方法，后面数组中的函数必须返回一个字符串
    transformResponse: [(data) => {
        let obj = JSON.parse(data)
        obj.content = `（在传递给 then/catch 前，修改响应数据）<br>${JSON.parse(data).content}`
        return obj
    }], // 在传递给 then/catch 前，允许修改响应数据
    headers: {
      'Content-Type': 'application/json'
    }, // `headers` 是即将被发送的自定义请求头
    params: { //`params` 是即将与请求一起发送的 URL 参数
        id: 9
    },
    paramsSerializer: null,// 一个负责 `params` 序列化的函数
    data: { //`data` 是作为请求主体被发送的数据
      username: 'Nat'
    },
    timeout: 1000, //请求超时的毫秒数(0 表示无超时时间)，如果请求话费了超过 `timeout` 的时间，请求将被中断
    withCredentials: false, // 跨域请求时是否需要使用凭证，默认的false
    adapter: null, //允许自定义处理请求返回一个 promise
    auth: null, //应该使用 HTTP 基础验证，并提供凭据
    responseType: 'json', //服务器响应的数据类型默认 json
    xsrfCookieName: 'XSRF-TOKEN', // 默认的
    xsrfHeaderName: 'X-XSRF-TOKEN', // 默认的
    onUploadProgress: null, //允许为上传处理进度事件
    onDownloadProgress: null, //允许为下载处理进度事件
    maxContentLength: 2000, // 定义允许的响应内容的最大尺寸
    validateStatus: (status) => { //定义对于给定的HTTP 响应状态码是 resolve 或 reject 
        return status >= 200 && status < 300; // 默认的resolve 在这个条件下是不会reject错误的
    },
    maxRedirects: 5, // 默认的，如果设置为0，将不会 允许 任何重定向
    // httpAgent: new http.Agent({ //用于定义在执行 http 和 https 时使用的自定义代理
    //     keepAlive: false // 默认没有启用
    // }),
    // httpsAgent: new https.Agent({ //用于定义在执行 http 和 https 时使用的自定义代理
    //     keepAlive: false // 默认没有启用
    // }),
    proxy: { //'proxy' 定义代理服务器的主机名称和端口
    //   host: '127.0.0.1',
    //   port: 9000,
      auth: { //`auth` 表示 HTTP 基础验证应当用于连接代理，并提供凭据
        // username: 'mikeymike',
        // password: 'rapunz3l'
      }
    },
    // cancelToken: new CancelToken(function (cancel) {}) //指定用于取消请求的 cancel token
}

export default options
```
## 配置优先级
- 配置会以一个优先顺序进行合并。这个顺序是：在 lib/defaults.js 找到的库的默认值，然后是实例的 defaults 属性，最后是请求的 config 参数。后者将优先于前者。
## 拦截器
```javascript
//拦截器
axios.interceptors.request.use(config => { //config是配置选项的对象
    config.params = {
        tip: `拦截器拦截请求改变params请求参数`,
        ...config.params
    }
    if (config.method === 'post') {
        config.data = {
          add: '拦截器拦截请求改变data请求参数',
          ...config.data
        }
    }
    return config
}, err => {
    return Promise.reject(err)
})

axios.interceptors.response.use(response => {
    if (response.config.baseURL == 'http://avengers.local/') {
        response.data.content = '（拦截器拦截响应）' + response.data.content
    }
    return response
}, err => {// 拦截错误信息
    return Promise.reject(err)
})

// 移除拦截器：
// var myInterceptor = axios.interceptors.request.use(function () {
//   /*...*/ });
// axios.interceptors.request.eject(myInterceptor);

// 自定义实例添加拦截器
// var instance = axios.create();
// instance.interceptors.request.use(function () {
//   /*...*/ });
```
## 取消请求
```javascript
取消请求
var CancelToken = axios.CancelToken;
var cancel;

axios.get('/user/12345', {
  cancelToken: new CancelToken(function executor(c) {
    // executor 函数接收一个 cancel 函数作为参数
    cancel = c;
  })
});

// 取消请求
cancel();
```