微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

axios+Promise封装request请求

1.axios全局配置

axios.defaults.baseURL = 'http://127.0.0.1:8888';
axios.defaults.timeout = 5000; //超时时间
axios.defaults.headers.post['Content - Type'] = 'application/json;charset=UTF-8';

2.axios请求拦截

axios.interceptors.request.use((config) => {
    // 拦截成功onFulfilled
    // (里面有发送请求的所有信息, 增加token, 数据, 过渡动画等)
    console.log(config);
    config.abc = "hello,World";
    // 一定要返回congfig
    return config;

}, (error) => {
    // 拦截失败onRejected
    return Promise.error(error);
})

3.axios响应拦截(不返回页面拿不到数据)

axios.interceptors.response.use((res) => {
    console.log(res.data);
    return res.data;
}, (error) => {
    return Promise.error(error);
})

4.request请求

export default function request(url = '', parmas = {}, type = 'GET') {
    // 返回的也是一个promise
    return new Promise((resolve, reject) => {
        let promise = null;
        // 1.判断请求的类型
        if (type.toupperCase() === 'GET') { //get请求
            promise = axios({
                url,
                params: parmas
            })
        } else if (type.toupperCase() === 'POST') {
            promise = axios({
                method: 'POST',
                url,
                data: parmas
            })
        }
        // 2.处理返回值
        promise.then((res) => {
            // 通过resolve()把res返回给外部
            resolve(res);
        }).catch((err) => {
            // 通过reject()把失败结果返回给外部
            reject(err);
        })
    })
}

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 [email protected] 举报,一经查实,本站将立刻删除。

相关推荐