需求背景
1.Android项目多为Java写的，经常会因为数据null出现空指针，代码中如果每个数据都判断，显得冗余。
2.前端的控件总是用多个条件判断是否显示。如果漏掉一个条件就会出现问题。发版后，产品如果需要改变判断条件，客户端就要重新发版。
3.有些时候后台给的数据并不是前端要的，沟通不足。前端使用起来会增加开发成本。
1.先看我们的数据
{
"statusCode":200,
"errorCode":null,
"comments":"成功",
"result":{ },
"pagination":{
"count":27,
"offset":0,
"length":20,
"sortingConditions":[ ]
},
"data":[
{
"showClueId":"5c6bd384a8e206762fca6356",
"showName":"女11无语",
"showType":"Acrobatics",
"referenceType":null,
"referenceUrl":null,
"resources":null,
"imageSource":null,
"imageSourceRemark":null,
"status":"AUDITING",
"showId":null,
"sellerId":null,
"sellerName":null,
"sellerCellphone":null,
"auditId":null,
"auditor":null,
"auditTime":1550570496000,
"rejectType":"INFO_NOT_EXACT",
"comments":null,
"showTypeDesc":"曲艺杂谈",
"imageSourceDesc":null,
"statusDesc":"审核中",
"rejectTypeDesc":"所提供信息不准确",
"referenceTypeDesc":null
}
]
}
演出上新
对话框提示
希望在以下功能点改进：
1.errorCode多余。只用statusCode就可以表示状态码。
2.无论是列表还是简单数据，data节点下都是{}。
3.不要返回null。都要有值，如0 、""、false、[]、{}。
4.数据应该归类，层次结构明显。statusDesc、status应该归于一个对象。showTypeDesc、showType应该归于一个对象。
5.枚举值String AUDITING,前端要维护一套一样的字符串。如果错一个字母Android、iOS、h5都要要重新改动，不如返回int数字1、2、3。
6.判断控件的显示与否，应该返回一个boolean或者int供前端判断。多个条件控制控件显示的应该由后台处理好为1个字段后返回。这样即使以后想增减条件只要后台改动即可。
7.对话框提示，标题和内容应该由后台返回，放在一个对象里。这样易于维护，保证前端的文案统一。
8.点击列表跳转到不同页面，应该由后台控制。返回对象有跳转的页面和参数。
2.看看美团的数据
美团外卖订单页
分享红包
外卖详情页json如下：
{
"data": {
"navigate_bar": [{
"type": 1,
"icon": "http://p1.meituan.net/aichequan/fb27f3a99a25309c03054c63fd705b892093.png",
"click_url": "https://kf.dianping.com/csCenter/access/waimai_waimai_mtWaimaiApp?referId=6448781592289262&userId=66381444"
}, {
"type": 2,
"icon": "http://p0.meituan.net/aichequan/fdb456e728c85353e90443b00ac26ed42284.png",
"click_url": "meituanwaimai://waimai.meituan.com/browser?inner_url=http://i.waimai.meituan.com/node/message/getcategory?p_url=message-getcategory%26el_biz%3Dwaimaiapp%26el_page%3Dmessage-getcategory"
}, {
"type": 3,
"icon": "https://p1.meituan.net/coupon/b07a62973c2df7d806090441901381c93291.png@!style1",
"click_url": "",
"envelope_share_tip": {
"icon": "https://p1.meituan.net/coupon/f02ce51bd851c69d42e139e108eacb1213099.png@!style1",
"title": "【送您一个拼手气红包】",
"desc": "快分享给小伙伴看看谁会撞大运",
"envelope_total": 20,
"share_info": {
"content": "最高10元大包随机出没，手快有，手慢无~",
"icon": "https://p1.meituan.net/coupon/ddf7714ba86483c7f301958434ffe9495691.jpg@!style1",
"url": "https://activity.waimai.meituan.com/coupon/sharechannel/B2EA8E1ABA8B47EA82DB475BA17B517D?urlKey=66F29B1382F84304B2EF2592094F7993",
"title": "【美团外卖】第6个领取的人红包最大！",
"url_key": "",
"channel_url_key": ""
},
"channels": [1, 2],
"button_name": "发红包",
"share_icon": "https://p1.meituan.net/coupon/b07a62973c2df7d806090441901381c93291.png@!style1"
}
}],
"order_status_desc": {
"show_position": 0,
"status_desc": "订单已完成"
},
"order_operate_area": {
"fst_desc": "",
"snd_desc": "感谢您对美团外卖的信任，期待再次光临。",
"third_desc": "",
"button_list": [{
"code": 2027,
"title": "申请售后",
"highlight": 0,
"click_url": "",
"icon_url": "",
"sub_label_list": [{
"code": 2028,
"title": "联系商家",
"desc": "提前联系商家可以提高退款效率哦",
"highlight": 0,
"click_url": "",
"icon_url": ""
}, {
"code": 2003,
"title": "申请退款",
"desc": "",
"highlight": 0,
"click_url": "",
"icon_url": ""
}]
}, {
"code": 1001,
"title": "再来一单",
"highlight": 1,
"click_url": "",
"icon_url": "",
"sub_label_list": []
}]
},
"order_common_info": {
"order_template_type": 0,
"show_map_flag": 0,
"weather_type": 0,
"order_status": 8,
"status_code": 130,
"pay_status": 3,
"logistics_status": 40,
"order_push_time": 1551083436,
"status_time": 1551106524,
"order_time": 1551083432,
"pay_success_time": 1551083436,
"preorder_begin_deal_time": 0,
"expected_arrival_time": 0,
"delivery_time": 1551085476,
"formatted_delivery_time": "2月25日 17:04",
"wm_order_pay_type": 2,
"use_privacy": 1,
"privacy_icon": "http://p1.meituan.net/aichequan/950784aad109cf7351e814f86f7bc64b10002.png",
"can_feedback": 1,
"no_rider_confirm_alert": 0,
"no_rider_confirm_alert_text": "",
"delivery_type": 4,
"actual_delivery_type": 1
},
"poi_info": {
"city_id": 0,
"poi_name": "",
"poi_icon": "",
"poi_latitude": 0,
"poi_longitude": 0,
"poi_address": "",
"contact_way": [{
"type": 0,
"icon": "http://p0.meituan.net/aichequan/5e45fa48316cda43c659b92c4d1eb9cb1924.png",
"big_icon": "http://p0.meituan.net/aichequan/a661ba651b184f319278d97569ab5cc95718.png",
"poi_phone_list": [{
"type": 2,
"title": "商家电话",
"phone": "02158759567"
}, {
"type": 2,
"title": "商家电话",
"phone": "4009210219"
}]
}, {
"type": 1,
"icon": "http://p1.meituan.net/aichequan/89950613a48860ab6c4fd5760aa470821810.png",
"big_icon": "http://p1.meituan.net/aichequan/6177ef69d981da6efad9aeb2261fe1045992.png",
"poi_im": {
"poi_im_entrance_status": 0,
"poi_dx_id": 137440049808,
"b_app_id": 4,
"remind_msg": ""
}
}]
},
"yunying_area": {
"url": "http://p1.meituan.net/wmbanner/1157dc14cf5e644aa4d81157e683a98b52950.png",
"action": 2,
"target": "meituanwaimai://waimai.meituan.com/browser?inner_url=http%3A%2F%2Fmarketing.waimai.meituan.com%2Fo%2Factivity%2FredirectH5%3Factivity_id%3D28216%26ys%3D3%26ys_id%3D5%26entry_id%3Db_A7OTp%26entry_item_id%3D5"
},
"coupon_compensate": {
"is_compensate": false,
"coupon_info_list": [],
"button_text": "",
"background": "",
"click_url": ""
},
"address_modify_info": {
"modify_status": 0,
"modify_btn_content": "",
"modify_type": 0,
"order_extra_cat": 0
},
"order_ext_info": {
"ext": ""
}
},
"code": 0,
"msg": "成功",
"traceid": "-4511537110752729940"
}
美团外卖个人中心
个人中心页json如下：
{
"data": {
"user_info": {
"click_desc": "个人信息>"
},
"vip_info": {
"user_type": 2,
"show_vip_entrance": false,
"entrance_desc": "",
"highlight": false,
"h5_url": ""
},
"settings_info": {
"show_clean_cache": true,
"show_auto_download": true,
"mt_protocol_and_illustrate": "美团协议与说明"
},
"message_info": {
"message_type": 0,
"unread_count": 0,
"h5_url": "meituanwaimai://waimai.meituan.com/browser?inner_url=http://i.waimai.meituan.com/node/message/getcategory?p_url=message-getcategory%26el_biz%3Dwaimaiapp%26el_page%3Dmessage-getcategory"
},
"category_list": [{
"show_title": 0,
"cat_title": "我的信息",
"fun_list": [{
"fun_code": 1,
"fun_title": "我的收藏",
"icon": "http://p1.meituan.net/xianfu/9c1388ba5fbb367c1a93996f39c2fba94506.jpg",
"click_url": "meituanwaimai://waimai.meituan.com/likedpoi",
"need_login": 1,
"desc_secd": "",
"desc_secd_status": 0,
"bubble": {
"type": 0,
"description": "",
"version": 0
}
}, {
"fun_code": 4,
"fun_title": "我的足迹",
"icon": "http://p1.meituan.net/xianfu/7ad7da19bfadd5e6081b7606025214254582.jpg",
"click_url": "meituanwaimai://waimai.meituan.com/footprint",
"need_login": 1,
"desc_secd": "",
"desc_secd_status": 0,
"bubble": {
"type": 0,
"description": "",
"version": 0
}
}, {
"fun_code": 2,
"fun_title": "我的评价",
"icon": "http://p0.meituan.net/xianfu/5d02f44df0f9f26ea0eca95957824bae4444.jpg",
"click_url": "meituanwaimai://waimai.meituan.com/mycommentlist",
"need_login": 1,
"desc_secd": "",
"desc_secd_status": 0,
"bubble": {
"type": 0,
"description": "",
"version": 0
}
}, {
"fun_code": 5,
"fun_title": "答谢记录",
"icon": "http://p1.meituan.net/xianfu/5c1bf832376403ca2ab22b8d8748e0fd5479.jpg",
"click_url": "meituanwaimai://waimai.meituan.com/browser?inner_url=http%3a%2f%2fi.waimai.meituan.com%2fnode%2frider%2fusertiplist",
"need_login": 1,
"desc_secd": "",
"desc_secd_status": 0,
"bubble": {
"type": 0,
"description": "",
"version": 0
}
}, {
"fun_code": 6,
"fun_title": "我的地址",
"icon": "http://p0.meituan.net/xianfu/a813bff1813024b05ff45422deac24bd4276.jpg",
"click_url": "meituanwaimai://waimai.meituan.com/mineaddress",
"need_login": 1,
"desc_secd": "",
"desc_secd_status": 0,
"bubble": {
"type": 0,
"description": "",
"version": 0
}
}]
}, {
"show_title": 1,
"cat_title": "我的资产",
"fun_list": [{
"fun_code": 7,
"fun_title": "红包",
"icon": "http://p1.meituan.net/xianfu/a361ce97f9f00f2715bb960a789d925e2315.jpg",
"click_url": "meituanwaimai://waimai.meituan.com/coupons",
"need_login": 1,
"desc_secd": "9个未使用",
"desc_secd_status": 0,
"bubble": {
"type": 0,
"description": "",
"version": 0
}
}, {
"fun_code": 8,
"fun_title": "代金券",
"icon": "http://p0.meituan.net/xianfu/875f13a76045b7f6862a2b7149babec32329.jpg",
"click_url": "meituanwaimai://waimai.meituan.com/poicoupons",
"need_login": 1,
"desc_secd": "18张未使用",
"desc_secd_status": 0,
"bubble": {
"type": 2,
"description": "",
"version": 1540451286
}
}, {
"fun_code": 21,
"fun_title": "外卖豆",
"icon": "http://p0.meituan.net/aichequan/54cdbca154e2b6c8c117e5530cc64bae1858.png",
"click_url": "meituanwaimai://waimai.meituan.com/browser?future=1&inner_url=https%3a%2f%2factivity.waimai.meituan.com%2facstatic%2fmature%2fvirtualcurrency",
"need_login": 1,
"desc_secd": "50个",
"desc_secd_status": 0,
"bubble": {
"type": 2,
"description": "new",
"version": 1534770962
}
}, {
"fun_code": 9,
"fun_title": "我的钱包",
"icon": "http://p1.meituan.net/xianfu/2c14b3425c7bf1f3d63d11f47a7ef9ea2230.jpg",
"click_url": "meituanpayment://wallet/launch",
"need_login": 1,
"desc_secd": "签到赢现金",
"desc_secd_status": 0,
"bubble": {
"type": 2,
"description": "赢现金",
"version": 1550216692
}
}, {
"fun_code": 9,
"fun_title": "借钱",
"icon": "http://p0.meituan.net/walletopenplatform/34c73f10f017877677edfdee7d4c9a9d1205.png",
"click_url": "https://expenses-fe.meituan.com?utm_source=fin_group_mine&ehwebview=1",
"need_login": 1,
"desc_secd": "最高5万",
"desc_secd_status": 0,
"bubble": {
"type": 2,
"description": "秒过",
"version": 1550216013
}
}]
}, {
"show_title": 1,
"cat_title": "我的服务",
"fun_list": [{
"fun_code": 13,
"fun_title": "帮助与反馈",
"icon": "http://p1.meituan.net/xianfu/317aabdd31dfcfa1739149089a2e041a2780.jpg",
"click_url": "meituanwaimai://waimai.meituan.com/browser?inner_url=http%3A%2F%2Fi.waimai.meituan.com%2Fnode%2Faccount%2Fhelp",
"need_login": 0,
"desc_secd": "",
"desc_secd_status": 0,
"bubble": {
"type": 0,
"description": "",
"version": 0
}
}, {
"fun_code": 14,
"fun_title": "客服中心",
"icon": "http://p0.meituan.net/xianfu/55454d4faaed6ad212b2b8a929edef372425.jpg",
"click_url": "meituanwaimai://waimai.meituan.com/browser?inner_url=https%3a%2f%2fh5.dianping.com%2fapp%2fcs-fe-mai-portal%2findex.html%3fneed_login%3d1%26appkey%3dwaimai_portal_waimaiapp%26subSource%3dMT_WAIMAI_APP&userId=66381444&appName=android&appVer=7.5.4",
"need_login": 0,
"desc_secd": "",
"desc_secd_status": 0,
"bubble": {
"type": 0,
"description": "",
"version": 0
}
}]
}, {
"show_title": 1,
"cat_title": "更多推荐",
"fun_list": [{
"fun_code": 11,
"fun_title": "邀请有奖",
"icon": "http://p0.meituan.net/xianfu/cf5ddfcae114ed8d7d147d51064532252477.jpg",
"click_url": "meituanwaimai://waimai.meituan.com/browser?inner_url=https%3a%2f%2fpromotion-waimai.meituan.com%2finvite%2fpage%2fmain%3fsource_id%3d1",
"need_login": 1,
"desc_secd": "",
"desc_secd_status": 0,
"bubble": {
"type": 0,
"description": "",
"version": 0
}
}, {
"fun_code": 19,
"fun_title": "商家入驻",
"icon": "http://p1.meituan.net/aichequan/53ccba9fafa40b27953f354dbfdda463755.png",
"click_url": "meituanwaimai://waimai.meituan.com/browser?inner_url=https%3a%2f%2fi.meituan.com%2fkd%2f%3fsource%3d1",
"need_login": 0,
"desc_secd": "",
"desc_secd_status": 0,
"bubble": {
"type": 0,
"description": "",
"version": 0
}
}, {
"fun_code": 16,
"fun_title": "骑手招募",
"icon": "http://p0.meituan.net/aichequan/57afa43ad250fd67c71adbc793ecd4691811.png",
"click_url": "meituanwaimai://waimai.meituan.com/browser?inner_url=https%3A%2F%2Fpeisong.meituan.com%2Fapp%2FriderRecruitmentFusion%2Findex%3FchannelCode%3Dwmic%26cityCode%3D100000%26recruitType%3D102",
"need_login": 0,
"desc_secd": "",
"desc_secd_status": 0,
"bubble": {
"type": 0,
"description": "",
"version": 0
}
}, {
"fun_code": 12,
"fun_title": "我要合作",
"icon": "http://p0.meituan.net/aichequan/39a38a017728c7513b1e7e30241300fc2854.png",
"click_url": "meituanwaimai://waimai.meituan.com/browser?inner_url=http%3A%2F%2Fi.waimai.meituan.com%2Fstatic%2Fhtml%2Fshop_enter.html",
"need_login": 0,
"desc_secd": "",
"desc_secd_status": 0,
"bubble": {
"type": 0,
"description": "",
"version": 0
}
}, {
"fun_code": 24,
"fun_title": "美团公益",
"icon": "http://p1.meituan.net/aichequan/c2eef59a0c51ae78b34a214214bebac33356.png",
"click_url": "https://gongyi.meituan.com/m?fromSource=wmcenter",
"need_login": 0,
"desc_secd": "",
"desc_secd_status": 0,
"bubble": {
"type": 0,
"description": "",
"version": 0
}
}]
}],
"premium_campaign": {
"show": false,
"link": "",
"text": "",
"icon_url": "",
"bg_url": "",
"buy_status": 0,
"bubble": {
"type": 0,
"description": "",
"version": 0
}
},
"wm_card": {
"title": "美团会员",
"description": "已购得美团会员，卡内有2个红包可用",
"link": "https://i.waimai.meituan.com/node/campaign/coupon-preview",
"link_text": "立即使用",
"link_show_type": 0,
"show": true,
"wmcard_status": 3
}
},
"code": 0,
"msg": "成功",
"traceid": "2177383065663856725"
}
总结如下:
1.数据没有null，为0、""、false。前后端交互很强，现有的问题是前后端沟通不多，后台给的并不一定是前端想要的。可以增加接口设计环节，前后端共同参与。
2.小图标归类于navigate_bar。右上角客服图标、消息图标、发红包图标归于一类。点击客服图标、消息图标，跳转到对应页面click_url。
{
"type":1,
"icon":"[http://p1.meituan.net/aichequan/fb27f3a99a25309c03054c63fd705b892093.png](http://p1.meituan.net/aichequan/fb27f3a99a25309c03054c63fd705b892093.png)",
"click_url":"[https://kf.dianping.com/csCenter/access/waimai_waimai_mtWaimaiApp?referId=6448781592289262&userId=66381444](https://kf.dianping.com/csCenter/access/waimai_waimai_mtWaimaiApp?referId=6448781592289262&userId=66381444)"
}
点击发红包图标，弹出对话框。click_url为“”。
"envelope_share_tip":{
"icon":"[https://p1.meituan.net/coupon/f02ce51bd851c69d42e139e108eacb1213099.png@!style1](https://p1.meituan.net/coupon/f02ce51bd851c69d42e139e108eacb1213099.png@!style1)",
"title":"【送您一个拼手气红包】",
"desc":"快分享给小伙伴看看谁会撞大运",
"envelope_total":20,
"share_info":{
"content":"最高10元大包随机出没，手快有，手慢无~",
"icon":"[https://p1.meituan.net/coupon/ddf7714ba86483c7f301958434ffe9495691.jpg@!style1](https://p1.meituan.net/coupon/ddf7714ba86483c7f301958434ffe9495691.jpg@!style1)",
"url":"[https://activity.waimai.meituan.com/coupon/sharechannel/B2EA8E1ABA8B47EA82DB475BA17B517D?urlKey=CD5BA7906FC8486F8A6CA629758B0432](https://activity.waimai.meituan.com/coupon/sharechannel/B2EA8E1ABA8B47EA82DB475BA17B517D?urlKey=CD5BA7906FC8486F8A6CA629758B0432)",
"title":"【美团外卖】第9个领取的人红包最大！",
"url_key":"",
"channel_url_key":""
},
"channels":[
1,
2
],
"button_name":"发红包",
"share_icon":"[https://p1.meituan.net/coupon/b07a62973c2df7d806090441901381c93291.png@!style1](https://p1.meituan.net/coupon/b07a62973c2df7d806090441901381c93291.png@!style1)"
}
3.申请售后、再来一单等标签按钮后台返回。
"button_list":[
{
"code":2027,
"title":"申请售后",
"highlight":0,
"click_url":"",
"icon_url":"",
"sub_label_list":[
{
"code":2028,
"title":"联系商家",
"desc":"提前联系商家可以提高退款效率哦",
"highlight":0,
"click_url":"",
"icon_url":""
},
{
"code":2003,
"title":"申请退款",
"desc":"",
"highlight":0,
"click_url":"",
"icon_url":""
}
]
},
{
"code":1001,
"title":"再来一单",
"highlight":1,
"click_url":"",
"icon_url":"",
"sub_label_list":[
]
}
]
4.点击按钮跳转。点击我的收藏 "click_url":"meituanwaimai://waimai.meituan.com/likedpoi"，跳转的是美团外卖app的likedpoi页面。
5.多个标签的代码(例如:票面标签)
{
"seatPlanTags": [
{
"displayName": "折",
"name": "DISCOUNT"
},
{
"displayName": "抢",
"name": "QIANG"
}
]
}
参考美团的button_list。name字段 DISCOUNT、QIANG多余，只要标签名称或者int标识。
网友评论