axios的使用

1、简介

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

2、安装

使用前需要先安装

npm install axios

将axios相关的代码写到一个单独的文件中，便于管理

3、设置

1. 引入axios

import axios from "axios";

2. 调用axios.create方法创建axios实例，可以传入一个配置对象

const api=axios.create({
    baseURL:"https://sandbox-api.estudy.chanke.xyz",
})

配置项
baseURL为请求的基础地址，那么在后续使用axios发送请求时，就不用在写这个基础地址了，写地址的后面部分就可以了。

3. 请求拦截器

axios.interceptors.request.use(config=>{
  NProgress.start();
  // 发送请求需带上token
  config.headers.Authorization=window.sessionStorage.getItem("token")
  return config;
})

4. 响应拦截器

axios.interceptors.response.use(config=>{
  NProgress.done();
  return config;
})

5. 设置请求头部
   给所有的post请求配置headers，设置Content-Type的值

api.defaults.headers.post["Content-Type"]="application/json"

6. 跨域时是否携带cookie
   withCredentials 跨域访问需要发送cookie时一定要加axios.defaults.withCredentials = true;

api.defaults.withCredentials=true;

7. 最后将这个axios实例暴露出去

export default api

4、使用

1. 在使用的组件中通过import引入后使用。
2. 也可以在main.js中将这个axios实例挂到Vue的原型上
   例如：

Vue.prototype.$http=api