优雅的axios封装

项目src目录下创建http文件夹
包含 service.js axios.js api.js url.js四个js文件

// service.js
// 拦截器
import axios from 'axios';
import Vue from 'vue'
//获取token
function getToken() {
    //假设token存储与cookies中
    return Vue.$cookies.get('token')
}

//创建axios实例
let service = axios.create({
    baseURL: '请求地址',
    timeout: 5000
})

//请求拦截
service.interceptors.request.use(
    config => {
        if (getToken()) {
            config.headers['token'] = getToken();
            config.headers['Content-Type'] = 'application/json;chartset=utf-8';
        }
        return config;
    },
    error => {
        Promise.reject(error);
    }
)

//响应拦截
service.interceptors.response.use(
    response => {
        let res = response.data;
        if (response.status == 200) {//请求成功时
            return res
        } else {
            //各种请求状态的处理 异常code处理
            console.log('error', response)
            return Promise.reject('error')
        }
    },
    error => {
        return Promise.reject(error);
    }
)

export default service;

// axios.js
// 请求封装
import service from './service'

export function get(url, params){
    return new Promise((resolve, reject)=>{
        service.get(url, params).then(res=>{
            console.log(url, params)
            resolve(res);
        }).catch(err=>{
            reject(err);
        })
    })
}

export function post(url, params){
    return new Promise((resolve, reject)=>{
        service.post(url, params).then(res=>{
            resolve(res);
        }).catch(err=>{
            reject(err);
        })
    })
}

// api.js
// 请求管理
import url from './url'
import { post } from './axios'

export function login(params){
    return post(url.user_login, params);
}
export function register(params){
    return post(url.user_register, params);
}

// url.js
// 存储项目请求地址
// 请求地址
const url = {};

url.user_login = "api/user/login";
url.user_register = 'api/user/register'
export default url;

// 使用 index.vue
import { login } from "@/http/api.js";
async getlogin() {
  let parms = {
    user_phone: this.user_phone,
    user_password: this.user_password
  };
  let data = await login(parms);
  console.log(data)
},