首页 > 移动平台 > 详细

axios另类封装

时间:2020-01-12 17:25:53      阅读:85      评论:0      收藏:0      [点我收藏+]
/**
 * 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另类封装

原文:https://www.cnblogs.com/0520euv/p/12182987.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!