Axios encapsulation

Import axios from ‘@/assets/js/http.js’ vue.use (axios); import axios from ‘@/assets/js/http.js’ vue.use (axios);

Used in the project: this $post (url, param). Then ((res) = > {});

//http.js


import Vue from 'vue'
import axios from "axios"



const Axios = axios.create({
  timeout: 30000.//responseType:"json",
  withCredentials:false});/** Configure baseURL= reverse proxy URL, which is valid in Nginx, Apache, and Tomcat. Configure/data= convert JSON to characters, send headers = set HTTP header file. Token is obtained from the server during login. WithCredentials = Whether cookie */ is carried during submission

Axios.interceptors.request.use(

  config= > {

    var token = sessionStorage.getItem("account.token") | |"";
    if(token && token ! ="") {
      config.headers = {
        "Authorization": 'Bearer ' + token,
        'Content-Type':'application/json; charset=utf-8',}}else{
      config.headers = {
        'Content-Type':'application/x-www-form-urlencoded; charset=utf-8',  
      }  
      config.data = Vue.prototype.qs.stringify(config.data)
    }

    return config;
  },
  error= > {
    return Promise.reject(error); });/** Axios intercepts processing when responding */
httpService.interceptors.response.use(
    response= > {
        let msg = ""
        if (response.status == 200) {
            switch (response.data.code) {
                case 1000:
                    msg = response.data.msg
                    // Message['success']({
                    // background: true,
                    // content: msg,
                    // duration: 3
                    // })
                    break;
                default:
                    msg = response.data.msg
                    Message['error'] ({background: true.content: msg,
                        duration: 10.closable: true})}// Handle states uniformly
            return Promise.resolve(response.data.data)
        } else {
            return Promise.reject(response)
        }
    },
    // Processing processing
    error= > {
        if (error && error.response) {
            switch (error.response.status) {
                case 400:
                    error.message = 'Error request';                 
                    break;
                case 401:
                    error.message = 'Unauthorized, please log in again';
                    break;
                case 403:
                    error.message = 'Access denied';
                    break;
                case 404:
                    error.message = 'Request error, resource not found';
                    break;
                case 500:
                    error.message = 'Server side error';
                    break;
                default:
                    error.message = 'Unknown error'${error.response.status}`;
            }
            Message['error'] ({background: true.content: error.message,
                duration: 10.closable: true})}else {
            error.message = "Failed to connect to server";
            Message['error'] ({background: true.content: error.message,
                duration: 10.closable: true})}return Promise.reject(error); })/** * encapsulate the get method *@param url
 * @param data
 * @returns {Promise}* /

const get = function (url, param = {}) {
  return new Promise((resolve, reject) = > {
    Axios.get(url, {
        params: JSON.stringify(param),
      })
      .then(response= > {
        resolve(response.data);
      })
      .catch(err= > {
        resolve({
          code: "no".msg: err.err
        });
        //reject(err)})})}const post = function (url, param = {}, bURL=Vue.prototype.config.proxy) {
  let config = {
    baseURL:bURL
  }
  return new Promise((resolve, reject) = > {    
    Axios.post(url, param, config).then(response= > {
        resolve(response.data);

    }).catch(err= > { 
      vart = err.err.response.data resolve(t); })})}export default {
  install: function (Vue, Option) {
    Object.defineProperty(Vue.prototype, "$http", {
      value: Axios
    });
    Object.defineProperty(Vue.prototype, "$get", {
      value: get
    });
    Object.defineProperty(Vue.prototype, "$post", {
      value: post }); }};Copy the code