axios请求封装

创建一个axios.js文件

import axios from 'axios';
import baseUrl from '../utils/baseUrl';
import { Message } from "element-ui";

const config = {
    baseURL: baseUrl() || "",
    timeout: 60 * 1000, // Timeout
    withCredentials: true, // Check cross-site Access-Control
  };
 
const _axios = axios.create(config);
//http request 拦截器
_axios.interceptors.request.use(
    config => {
        // var token = sessionStorage.getItem("token", token);
        if (token) {
            //将token放到请求头发送给服务器,将tokenkey放在请求头中
            // config.headers.token = token;
        } else {
            // if (config.url.indexOf('login') == -1) {
            //     // location.href = '/login'
            // }
        }
        return config;
    },
    error => {
        return Promise.reject(err);
    }
);


//http response 拦截器
_axios.interceptors.response.use(
    response => {
        if (response.data.code === 403) {
            Message.error(response.data.msg);
            // location.href = '/login'
            //其余错误状态处理 
        } else {
            return response;
        }
    },
    error => {
        // location.href = "/login"
        return Promise.reject(error)
    }
)


/**
 * 封装get方法
 * @param url
 * @param data
 * @returns {Promise}
 */

export function get(url, params) {
    return new Promise((resolve, reject) => {
        _axios.get(url , {
            params: params
        })
            .then(response => {
                resolve(response.data);
            })
            .catch(err => {
                reject(err)
            })
    })
}


/**
 * 封装post请求
 * @param url
 * @param data
 * @returns {Promise}
 */

export function post(url, data) {
    return new Promise((resolve, reject) => {
        _axios.post(url, data)
            .then(response => {
                resolve(response.data);
            }, err => {
                reject(err)
            })
    })
}

/**
 * 封装put请求
 * @param url
 * @param data
 * @returns {Promise}
 */

export function put(url, data) {
    return new Promise((resolve, reject) => {
      _axios.put(url, data)
        .then(response => {
          resolve(response.data)
        }).catch(err => {
        reject(err)
      })
    })
  }

在main.js引入import { get, post,put } from ‘./js/axios’

import { get, post,put } from './js/axios'

Vue.prototype.$get = get;
Vue.prototype.$post = post;
Vue.prototype.$put = put;

在需要请求的页面自己this.$请求方(‘url’,参数).then()