众所周知,前端不能完全信任后端的, 我们经常会做一些特殊处理来兼容可能出现的异常情况, 比如
//接口返回
rs = {
data : {
list : [{name : '用户名'}]
}
}//前端在渲染列表的时候,往往要进行多次兼容, 就像下面那样
rs && rs.data && rs.data.list && rs.data.list.forEach(function(item, index)
$('body').append('<div>' + item.name + '</div>');
});
如果某个地方, 忘了做处理, 并且后端返回的接口和我们约定的格式不同,就可能导致页面报错,为了解决该问题, 接口兼容工具应运而生。
我们只要在前端写好一套默认的接口模版, 工具会自动修正接口,并将不满足要求的地方, 转成你设定的默认值。
比如 :
//默认接口模版
var default = {
count : 0,
data : {
list : [{
name : '默认用户名'
}]
}
}
//接口返回
rs = {
msg : '获取成功'
count : 99,
data : {
list : [{
name : '小明'
},{
name : ''
},{
age : 18
}]
}
}
//通过工具兼容后的结果
rs = interfaceRepair(default, rs);
{
count : 99,
data : {
list : [{
name : '小明'
},{
name : '默认用户名'
},{
name : '默认用户名'
}]
}
}
这样, 是不是就能解决你的问题了呢,我们再也不用担心因为接口原因导致页面报错啦
更多详情, 请在github查看哦, github地址
网友评论