vue axios请求封装-蒲公英云

vue axios请求封装

红太狼 2023-01-03 14:17 404阅读 0赞

axios.defaults.baseURL = 'http://172.16.26.133:8080/XCPS'; //填写域名
//http request 拦截器
axios.interceptors.request.use(
    config => { 
        config.data = JSON.stringify(config.data);
        config.headers = { 
            "content-type": "application/json",
        }
        return config;
    },
    error => { 
        return Promise.reject(err);
    }
);
//响应拦截器即异常处理
axios.interceptors.response.use(response => { 
    return response
}, err => { 
    if (err && err.response) { 
        switch (err.response.status) { 
            case 400:
                console.log('错误请求')
                break;
            case 401:
                console.log('未授权，请重新登录')
                break;
            case 403:
                console.log('拒绝访问')
                break;
            case 404:
                console.log('请求错误,未找到该资源')
                break;
            case 405:
                console.log('请求方法未允许')
                break;
            case 408:
                console.log('请求超时')
                break;
            case 500:
                console.log('服务器端出错')
                break;
            case 501:
                console.log('网络未实现')
                break;
            case 502:
                console.log('网络错误')
                break;
            case 503:
                console.log('服务不可用')
                break;
            case 504:
                console.log('网络超时')
                break;
            case 505:
                console.log('http版本不支持该请求')
                break;
            default:
                console.log(`连接错误${ err.response.status}`)
        }
    } else { 
        console.log('连接到服务器失败')
    }
    return Promise.resolve(err.response)
})
/** * 封装get方法 * @param url * @param data * @returns {Promise} */
export function get(url, params = { }) { 
    return new Promise((resolve, reject) => { 
        axios.get(url, { 
                params: params
            })
            .then(response => { 
                resolve(response.data);
            })
            .catch(err => { 
                reject(err)
            })
    })
}
/** * 封装post请求 * @param url * @param data * @returns {Promise} */
export function post(url, data = { }) { 
    return new Promise((resolve, reject) => { 
        axios.post(url, data)
            .then(response => { 
                resolve(response.data);
            }, err => { 
                reject(err)
            })
    })
}
/** * 封装patch请求 * @param url * @param data * @returns {Promise} */
export function patch(url, data = { }) { 
    return new Promise((resolve, reject) => { 
        axios.patch(url, data)
            .then(response => { 
                resolve(response.data);
            }, err => { 
                reject(err)
            })
    })
}
/** * 封装put请求 * @param url * @param data * @returns {Promise} */
export function put(url, data = { }) { 
    return new Promise((resolve, reject) => { 
        axios.put(url, data)
            .then(response => { 
                resolve(response.data);
            }, err => { 
                reject(err)
            })
    })
}
/** * 下面是获取数据的接口 */
/** * 测试接口 * 名称：exam * 参数：paramObj/null * 方式：fetch/post/patch/put */
export const http = { 
    get,
    post,
    patch,
    put
}