美文网首页
axios 封装 拦截请求,上传数组,上传formdata

axios 封装 拦截请求,上传数组,上传formdata

作者: 多点干货少点废话 | 来源:发表于2020-09-21 15:03 被阅读0次

"use strict";

import axios from "axios";
import qs from "qs";

axios.interceptors.request.use((config) => {
        // 接口包含login就换请求头 随便改就好 不固定 
    if(config.url.includes('/login/')){
        // console.log('config',config.baseURL)
        config.baseURL = '/login/'
    }else{
        config.baseURL = '/api/'
    }
  return config;

}, function (error) {
  // Do something with request error
  return Promise.reject(error);
});

// 拦截响应
axios.interceptors.response.use(res => {
     const code = res.data.code
    return res;
}, function(error) {
    return Promise.reject(error);
});

var CancelToken = axios.CancelToken;
var source = CancelToken.source();

// 组件销毁时  结束get 请求    
// CancelToken get方式在第二个参数,post在第三个参数
var clearGet = function(url) {
    return new Promise((resolve) => {
        axios.get(url, {
            cancelToken: source.token
        }).then(res => {
            resolve(res.data);
        }).catch(err => {
            if (axios.isCancel(err)) {
                // window.console.log('Request canceled', err.message);
            } else {
                // 处理错误
            }
        })
    })
}

// get 请求
var get = function get(url, params) {
    return new Promise((resolve, reject) => {
        axios.get(url, {
            params: params
        }).then(res => {
            resolve(res.data);
        }).catch(err => {
            reject(err.data)
        })
    })
}

// post 请求
var post = function post(url, params,headers) {
    return new Promise((resolve, reject) => {
        axios.post(url, qs.stringify(params),headers)
            .then(res => {
                resolve(res.data);
            })
            .catch(err => {
                reject(err.data)
            })
    });
}

// post 上传数组
var arrPost = function arrPost(url, data, param, config) {
    config.params = param;
    return new Promise((resolve, reject) => {
        axios.post(url, data, config)
            .then(response => {
                resolve(response.data)
            })
            .catch(err => {
                reject(err)
            })
    })
}

// post上传formdata数据
var formDataPost = function formDataPost(url, params,headers) {
    return new Promise((resolve, reject) => {
        axios.post(url,params,headers)
            .then(res => {
                resolve(res.data);
            })
            .catch(err => {
                reject(err.data)
            })
    });
}

// 删除
var del = function deletes(url) {
    return new Promise((resolve, reject) => {
        axios.delete(url)
            .then(res => {
                resolve(res.data);
            })
            .catch(err => {
                reject(err.data)
            })
    });
}

export default {
    get,
    post,
    del,
    arrPost,
    clearGet,
    source,
    CancelToken,
    formDataPost
}

相关文章

网友评论

      本文标题:axios 封装 拦截请求,上传数组,上传formdata

      本文链接:https://www.haomeiwen.com/subject/wopvyktx.html