vue axios 哀求过滤空值
过滤判断哀求参数中是否是有字符串、空对象、空数组、null、undefined、NaN中的一个,不包含数字0一、npm安装 lodash 包
二、request.js 哀求拦截配置
point：
1、哀求拦截器中添加对 params / data 传参的空值判断
2、针对文件上传类的接口，必要屏蔽空值校验，否则会出错。—— 如在文件上传类的接口当中添加 noEmptyCheck 字段，过滤校验。
import axios from 'axios';
import { pickBy } from 'lodash';
import { isEmpty } from '@/utils/utils';
// 创建 axios 实例
const service = axios.create({
// axios中请求配置有baseURL选项，表示请求URL公共部分
baseURL,
// 超时
timeout: 30000
});
// 添加请求拦截器
service.interceptors.request.use(
(config) => {
// 是否需要设置 token,如果请求中自带了Authorization，就不向cookie中取
const isToken = !!(config.headers || {}).Authorization;
// 在发送请求之前做些什么 token
if (getToken() && !isToken) {
config.headers['Authorization'] = 'Bearer ' + getToken(); // 让每个请求携带自定义token 请根据实际情况自行修改
}
// 传参时如果为空或null，不传该字段
// 【注】：这里不用lodash的isEmpty，因为空格和数字0无法正确判断
if(!config.noEmptyCheck) {
if(config.params) {
config.params = pickBy(config.params, parameter => !isEmpty(parameter));
}
if(config.data) {
config.data = pickBy(config.data, parameter => !isEmpty(parameter));
}
}
return config;
},
(error) => {
// 对请求错误做些什么
return Promise.reject(error);
}
);
// 导出 axios 实例
export default service; /**
* 判断某个值是否是空字符串、空对象、空数组、null、undefined、NaN中的一个,不包含数字0
* @param {*} val
*/
export function isEmpty(val) {
let flag = false;
const type = Object.prototype.toString.call(val);
switch (type) {
// 空字符串
case '':
if(val.trim() === '') {
flag = true;
}
break;
// null
case '':
flag = true;
break;
// undefined
case '':
flag = true;
break;
// NaN
case '':
if(isNaN(val)) {
flag = true;
}
break;
// 空数组
case '':
if(val.length === 0) {
flag = true;
}
break;
// 空对象
case '':
if(Object.keys(val).length === 0) {
flag = true;
}
break;
}
return flag;
}
免责声明：如果侵犯了您的权益，请联系站长，我们会及时删除侵权内容，谢谢合作！更多信息从访问主页：qidao123.com:ToB企服之家，中国第一个企服评测及商务社交产业平台。
页:
[1]