templates翻译,沈阳seo,网站 例,泾阳做网站哈喽大家好啊#xff0c;最近做Vue项目看到axios axios官网#xff1a;起步 | Axios 中文文档 | Axios 中文网 (axios-http.cn) 重要点#xff1a; axios是基于Promise封装的 axios能拦截请求和响应 axios能自动转换成json数据 等等
安装#xff1a;
$ npm i… 哈喽大家好啊最近做Vue项目看到axios axios官网起步 | Axios 中文文档 | Axios 中文网 (axios-http.cn) 重要点 axios是基于Promise封装的 axios能拦截请求和响应 axios能自动转换成json数据 等等
安装
$ npm install axios Vue项目中使用axios实现请求拦截
import axios from axios;// 引入axiosconst httpAxios axios.create({});// 创建实例let config {TIMEOUT: 600000,//设置超时时间为10min
};// axios 配置超时时间
httpAxios.defaults.timeout config.TIMEOUT;// axios设置 请求拦截httpAxios.interceptors.request.use(// config配置选项config {console.log(config,1)return config;},// errorerror {return Promise.reject(error);}) Vue项目中使用axios实现响应拦截 // axios响应拦截httpAxios.interceptors.response.use(// response响应成功response {const config response.config;console.log(config,2)return response;},// 响应errorerror {const config error.config;console.log(config,3)if(error.message.includes(timeout)) {return Promise.reject(timeout);// reject这个错误信息// 判断请求异常信息中是否含有超时timeout字符串}return Promise.reject(网络链接失败请稍后再试!)}) 封装axios请求
export const getHttpInfo function (data) {return new Promise((resolve, reject) {let token if (data.headers) {token data.headers.Authorization}httpAxios(data).then((res) {resolve(res)}).catch((e) {})})
} 设置超时时间并在响应拦截中判断超时并提示 gethttpInfo({method: post,url: url,data: this.order,headers: {Authorization: localStorage.getItem(token)}}).then((res) {}).catch((error) {this.$message({type: warning,message: error!timeout ? error : 其他错误})});
参考原文
Vue项目请求超时处理_vue接口请求超时处理_一捆铁树枝的博客-CSDN博客
