vue项目中如何使用axios

import axios from "axios";
import vue from "vue";
import store from '../store';
import {router} from '../router/index';
import Cookies from "js-cookie";

// 创建axios实例
const service = axios.create({
  baseURL: process.env.BASE_API, // api的base_url
  // baseURL: "/",
  timeout: 15000, // 请求超时时间
  // withCredentials: true, // 表示跨域请求时是否需要使用凭证，是否允许带cookie这些，默认false
  headers: {
    "Content-Type": "application/json;charset=utf-8"
  }
});

// request拦截器
service.interceptors.request.use(
  config => {
    // Do something before request is sent
    // 若是有做鉴权token , 就给头部带上token
    if (Cookies.get("authorization")) {
      config.headers.Authorization = "Token " + Cookies.get("authorization");
    }
    // console.log("config", config);
    return config;
  },
  error => {
    // Do something with request error
    console.log(error); // for debug
    Promise.reject(error);
  }
);

// respone拦截器
service.interceptors.response.use(
  response => {
    return response;
  },
  error => {
    console.log(error.response); // for debug
    if (error.response.data.msg == "token is Invalidation") {
      let vm = new vue();
      vm.$Message.error('token失效，请重新登录');
      store.commit('logout');
      store.commit('clearOpenedSubmenu');
      router.push({
        name: 'login'
      });
      return;
    }
    return Promise.reject(error.response);
  }
);

export default service;

 

HTTP库Axios

Axios中文说明

axios实例没有all这个方法，all是axios的静态方法

this.$axios.all is not a function报错