封装axios，带请求头和响应头

import axios from "axios";import qs from "qs"; //处理参数import router from '../router'; //引入路由import { Loading, Message } from 'element-ui';let loading = null;//开始加载动画function openLoading() {loading = Loading.service({lock: true,text: '拼命加载中...',background: 'rgba(0,0,0,.7)'});}//关闭加载动画function closeLoading() {loading.close();}//添加请求拦截器axios.interceptors.request.use(config => {//加载动画openLoading()if (localStorage.sessionId) { //如果我的sessionId存在(sessionId其实就是token)// 设置统一的请求headerconfig.headers.Authorization = localStorage.sessionId //授权（每次请求把sessionId带给后台）}retu config;},error => {retu Promise.reject(error);});//添加响应拦截器axios.interceptors.response.use(response => {　　//逻辑处理if (response.data.errorCode == -1) { //后端反回的状态值，本应该errorCode是statusMessage({type: 'waing',duration: 1500,showClose: true,message: '当前登录已失效，请从新登录！'})router.push("/logon")//让用户从新回到登录页面}retu response;},error => {closeLoading() //请求超时清除加载动画retu Promise.resolve(error.response);});axios.defaults.baseURL = "http://127.26.41.181:8081/nei";// 开发axios.defaults.headers.post["Content-Type"] = "application/json";// axios.defaults.headers.post["X-Requested-With"] = "XMLHttpRequest";axios.defaults.timeout = 6000; //设置请求超时时间function checkStatus(response) {retu new Promise((resolve, reject) => {if (response && (response.status === 200 || response.status === 304 || response.status === 400)) {try {closeLoading() //关闭加载动画} catch (e) {//抛出异常console.log(e)}resolve(response.data);} else {try {closeLoading() //关闭加载动画} catch (e) {//抛出异常console.log(e)}Message({type: 'error',showClose: true,message: '网络异常，请检查网络连接是否正常！'})}});}export default {post(url, params) {retu axios({method: "post",url,data: params}).then(response => {retu checkStatus(response);});},get(url, params) {params = qs.stringify(params);retu axios({method: "get",url,params}).then(response => {retu checkStatus(response);});}};

使用：在main.js里面引入这个文件，并挂载到vue原型上，这样可以通过this.xxxx去拿到

import axios from './api/api.js'//引入axios文件夹Vue.prototype.$axios = axios;//挂载到整个Vue原型上

axios 的使用：在需要请求的页面如下引用

//post请求this.$axios.post('url',{key:value}).then(res =>{cons.log(res,'后端返回数据') })//get请求this.$axios.get('url?key=value').then(res =>{cons.log(res,'后端返回数据') })