技术总结
一、实名认证页面(RealNameAuthentication.html)
1.相机拍照蒙层,前端不易实现
解决:用原生代码来解决的。进入拍摄界面,js所调用函数如下(该函数包含网络请求)
function idCardPut(ruid, okCallback, failCallback, errorCallback) {
var success = function(result) {
var response = JSON.parse(result);
if (response.meta.code === 0 && okCallback) {
okCallback(response.meta, response.data)
} else if (failCallback) {
failCallback(response.meta, response.data)
}
}
var failed = function(msg) {
if (errorCallback)
errorCallback(msg);
}
var callbackId = plus.bridge.callbackId(success, failed);
plus.bridge.exec('ApiClient', 'idCardPut', [callbackId, '/user/auth/idcard/upload', '', ruid]);
}
二、人保购险页面(PersonalInsurancePay.html)
1.通过支付链接所打开的页面,若未支付,无法返回到人保购险页面
解决:打开带原生导航栏的页面(点击导航栏的按钮可返回)
payWebview = mui.openWindow({
id: 'pay_page',
url: 'LoadingPage.html',
styles: {
titleNView: {
style: 'transparent',
backgroundColor: '#FFFFFF',
titleText: '保单支付',
titleColor: '#000000',
autoBackButton: true,
}
}
});
2.支付接口回调的响应时间太长(大概一分钟),采用此方法用户体验很差
解决:采用轮询的方式,设置一个定时器,支付链接页面加载完成后调用该定时器,每隔2s查询一次保单的支付状态(注:页面关闭时进行完最后一次支付状态的查询再关闭定时器)
// 设置一个定时器,点击支付按钮后,轮询支付情况
function pollingCheckPay() {
setTimeout(function() {
getInfoOfPolicy(gGetInfor.policy_number,checkPayCallback);
}, 2000);
}
三、mui的一些坑
1.提示框的效果不行,应该是代码最后没加上’div’
//可能你是这样写的
mui.alert(msg, "提示", ['确定'], function() {})
//加上'div'才有样式,该参数是指是否使用h5绘制的对话框
mui.alert(msg, "提示", ['确定'], function() {},'div')
2.mui的确认框confirm使用
mui.confirm(getConfirmMsg(val), "请确认身份信息", ["信息有误", '确认'], function(e) {
if (e.index === 0) {
take_photo(ruid);
} else if (e.index === 1) {
mui.showLoading("正在加载..", "div");
infoConfirm("id_card", ruid, buid);
}
}, "div")
3.mui预加载的目标页面,不可用mui.openWindow传参
mui.init({
preloadPages: [{
id: 'PersonalInfo',
url: 'PersonalInfo.html',
}]
});
mui.openWindow({
id: 'PersonalInfo',
url: 'PersonalInfo.html',
extras:{
name:'小明'
}
});
4.适配
由于要适配至安卓4.4(Android 4.4是谷歌于2013年11月1日发布的手机操作系统。),且6.0之前版本的webview不支持ES6,故使用es5纯原生开发。
项目收获
1.即时和开发团队成员沟通很重要,沟通的效率会决定自己对项目的理解,以及开发的效率,好的沟通可以加快开发的速度且可减少代码更改量;
2.项目开发前的准备工作很重要,一开始未梳理清楚整个页面流程,导致一开始效率较低,且开发乏力,应一开始就提醒大家开个会,理清楚页面间逻辑;
3.混合开发,一开始不清楚和涉及自己任务的其他人的任务的衔接(如拍照页面),一开始该问和自己任务相关的人到底在做什么,大概负责的内容是什么;
4.以测试和上线为中心很重要,自己的页面可能还有点问题,在要测试的时候应以测试为中心,若阻挡测试流程,应注释掉自己的问题代码,或先砍掉自己的有问题的功能,以便整个项目流程能够正常测试和正常上线;