axios另类封装

/**
 * Created by bootdo.
 */
import axios from axios
import store from "../vuex/tab";
import {
  bus
} from ../bus.js

axios.defaults.withCredentials = true;
// axios.defaults.headers.common[‘Authorization‘] = AUTH_TOKEN;
//  axios.defaults.headers.post[‘Content-Type‘] = ‘application/x-www-form-urlencoded;charset=UTF-8‘;//配置请求头
// axios.defaults.headers.post[‘Content-Type‘] =  ‘application/x-www-form-urlencoded‘

//添加一个请求拦截器
axios.interceptors.request.use(
  config => {
    if (window.localStorage.getItem(access-token)) {
      config.headers.Authorization = window.localStorage.getItem(access-token);
    }
    store.state.loading = true
    return config
  },
  error => {
    return Promise.reject(error)
  }
);
// 添加一个响应拦截器
axios.interceptors.response.use(function (response) {
  store.state.loading = false
  if (response.data && response.data.code) {
    if (parseInt(response.data.code) === 401) {
      //未登录
      bus.$emit(goto, /login)
    }
  }

  return response;
}, function (error) {
  store.state.loading = false
  // Do something with response error
  return Promise.reject(error);
});

//基地址
let base = process.env.API_ROOT


//通用方法
export const POST = (url, params) => {
  return axios.post(`${base}${url}`, params).then(res => res.data)
}

//上传
export const POST_UPLOAD_FILE = (url, params) => {
  var instance = axios.create({
    baseURL: `${base}`,
    timeout: 5000,
    headers: { "Content-Type": "multipart/form-data" }
  });
  return instance.post(`${url}`, params).then(res => res.data);
}


//登录
export const POST_LOGIN = (url, params) => {
  var instance = axios.create({
    baseURL: `${base}`,
    timeout: 5000,
    headers: { Content-Type: application/json; charset=utf-8 }
  })
  return instance.post(`${url}`, params).then(res => res.data);
}

export const GET = (url, params) => {
  return axios.get(`${base}${url}`, {
    params: params
  }).then(res => res.data)
}

export const GETByConfig = (url, params) => {
  return axios.get(`${base}${url}`,
    params).then(res => res)
}

export const PUTByConfig = (url, params,config) => {
  return axios.put(`${base}${url}`,
    params,config).then(res => res)
}
export const PUT = (url, params) => {
  return axios.put(`${base}${url}`, params).then(res => res.data)
}

export const DELETE = (url, params) => {
  return axios.delete(`${base}${url}`, {
    params: params
  }).then(res => res.data)
}

export const PATCH = (url, params) => {
  return axios.patch(`${base}${url}`, params).then(res => res.data)
}

 

API编写【根据请求地址不同,进行归类】:

getData:params=>{
    return API.GET("后台给的请求地址", params)
  }
getData:id=>{
    return API.GET("后台给的请求地址/" + id)
  }
 

 

使用:

import API from  “API地址"

testGetData(){
    let params  = {};
    API.getData(params).then(result=>{
        if(result.code === 0){
         //代码块
}
    },
    err=>{
       this.$message.error({
            message: err.toString(),
            duration: 2000
          });
    }
).catch(error=>{
  this.$message.error({
          message: "请求出现异常",
          duration: 2000
        });
})
}

  

axios另类封装

上一篇:uni-app 计算属性 computed


下一篇:[转帖]挖洞经验 | Firefox for iOS浏览器的二维码扫码XSS漏洞