利用X5平台开发银行代管系统，增加指纹扫描登录模块

Masion · 发表于 2015-2-28 21:12:06

利用X5为某银行开发代管业务系统。出于安全性考虑，客户要求用户登录系统时，不仅要输入用户名，密码还要求核对指纹。在login界面中，由于还没有拿到session，前后台数据传输与普通动作调用不一样，特地把这个模块拿出来与大家分享。

指纹仪用的是浙江维尔科技股份有限公司的JZT-988型号的指纹仪
指纹仪图片

无标题1111.png

指纹比对的实现过程如下图所示：
无标题.png

Masion · 发表于 2015-2-28 21:28:32

浙江维尔科技提供了一个前台页面实现的案例，用来帮助大家学习他的指纹仪接口
备注：目前这个接口只支持IE，不支持chrome，其他浏览器还没有进行测试

Masion · 发表于 2015-2-28 21:37:30

在登录界面中总体思路：
用户按完指纹后，拿到字符串格式的指纹特征码，把这个指纹特征码借助用户名，密码的通道传到后台去与存在数据库中的该用户指纹模板做匹配（与验证密码在同一个模块）

Masion · 发表于 2015-2-28 21:45:26

本帖最后由 Masion 于 2015-2-28 21:54 编辑

在 /UI/portal/system/js/login.js 中修改 doLogin 函数

doLogin: function(){
//登录处理程序
var msg = this.doGetDefaultCheckMsg(); //拿到默认的msg信息
if (msg) { //如果msg有内容
this.items.hintLable && this.items.hintLable.text(msg).show(); //显示msg内容
return; //退出登录
}
this.items.loadingImage && this.items.loadingImage.show(); //显示登录进度图片
this.doDisabledInput(true); //在登录过程中，禁止利用输入框重新输入内容
if (typeof $.jpolite.Login._error_count_ == "undefined")
$.jpolite.Login._error_count_ = 0; //将登录错误计数器清零
var username = $.trim(this.items.usernameInput.val().toLowerCase()); //拿到用户名（转成小写）
var password = this.items.passwordInput.val(); //拿到密码
password = hex_md5(password); //密码进行md5加密
var param = {}; //定义请求的参数
if(portalConfig.captcha){
param['captcha'] = this.items.captchaInput.val(); //如果允许校检码，则向param中压入校检码的值
}
var captcha = $("#captcha_input").val(); //拿到校检码的值
// var agent = this.items.agentSelect ? (this.items.agentSelect.val() || "") : ""; //拿到代理的值

复制代码

注：在此之前需要在 /UI/portal/login.w 的页面源码中引入指纹仪控件对象，一般放在body里面<body>
<object classid="clsid:933DB2AB-51BF-4204-9E30-C907FE352A5E" width="0" height="0" id="dtm" codebase="libFPDev_WL.ocx"> </object>

Masion · 发表于 2015-2-28 21:47:53

本帖最后由 Masion 于 2015-2-28 22:25 编辑

下面是dologin中新增加的部分

//采集指纹特征字符串
var DevType;
var iRet = dtm.FPIDevDetect(); //查找指纹设备接口号
if(iRet == 0)
{
DevType=iRet; //指纹仪接在了USB口
}
else if(iRet == -1)
{
DevType=0; //没有接上指纹仪，退出系统
return;
}
else
{
//alert("串口设备，串口号：COM"+iRet);
DevType=iRet; //指纹仪接在了串口上，返回串口号
}
iRet = dtm.FPIGetFeature(DevType, 15000); //采集指纹特征码
if(iRet == 0)
{
//将特征码赋值给参数param
var str=dtm.FPIGetFingerInfo();
str=str.replace(/</g,"a");
str=str.replace(/>/g,"b");
param['fingerPrintFeature'] = str;
}
else
{
alert("采集指纹特征失败!");
return;
}

复制代码

Masion · 发表于 2015-2-28 21:48:51

本帖最后由 Masion 于 2015-2-28 21:50 编辑

新增部分结束

/*利用用户名、密码、本地参数（语言），参数map（校检码）进行系统登录，此时指纹特征码在param中搭乘X5平台的通道传往后台*/
$.jpolite.Data.system.User.login(username, password, $.jpolite.Login.getLocale(), param, function(data){
//登录返回后的处理
if(data && data.status){
//如果返回正常
$.cookie("justep-username", username, {expires:7,path:'/'}); //将登录信息写入cookie
if($.jpolite.Login.items.maximizeCheckbox.get(0).checked){ //检查是否选中了“最大化”按钮
if(!window.opener){
$.jpolite.Login.maximize(); //如果窗口没打开，以最大化打开窗口
}else{
//如果窗口打开，则打开indexPage（url中包括indexpage的url地址，timestamp和代理client）
var url = window.location.href.replace(/login.*\.w.*/, $.jpolite.Login.indexPage) + "?timestamp=" + new Date().valueOf();
var client = $.urlParam('client');
if(client)
url += '&client=' + client;
window.location.href = url;
}

复制代码

Masion · 发表于 2015-2-28 22:04:46

本帖最后由 Masion 于 2015-2-28 22:15 编辑

浙江维尔科技提供后后台进行指纹对比的java demo
如附件所示
可以把附件中的 JINDemo\src下的com 目录扔到平台中的/BIZ/system/logic/code/dsrc目录下
正式使用之前需要编译一下

Masion · 发表于 2015-2-28 21:24:44

本帖最后由 Masion 于 2015-2-28 22:45 编辑

第一步完成指纹模板登记：总的思路是让管理员在人员信息的页面上增加指纹模板登记功能，利用厂家提供的接口函数，将指纹模板转换成字符串，将这个字符串存到数据库中的SA_OPPerson的fFingerPrintTemplate字段中（本字段为512位的字符串类型，为新增字段，详见 http://bbs.justep.com/thread-69209-1-1.html

在页面： /UI/SA/OPM/organization/personDetail.w 的页面上增加“采集指纹模板”按钮，它的click事件代码如下：

personDetail.trigger1Click = function(event){
//采集指纹模板
var strMB = "";
//查找设备接口号
var iRet = dtm.FPIDevDetect();
if(iRet == 0)
{
//alert("USB设备，iRet="+iRet);
DevType=iRet; //设备接在USB口上
}
else if(iRet == -1)
{
alert("没有找到设备，iRet="+iRet); //没有设备接入，跳出函数
DevType=0;
return;
}
else
{
alert("串口设备，串口号：COM"+iRet); //指纹仪接在串口上，返回串口号
DevType=iRet;
}
iRet = dtm.FPIGetTemplate(DevType, 15000); //采集指纹模板，按三次计算指纹模板；再按一次，核对指纹模板
if(iRet == 0)
{
strMB = dtm.FPIGetFingerInfo();
justep.xbl("dPerson").setValue("fFingerPrintTemplate", strMB); //将指纹模板存到数据组件中
}
else
{
alert("采集指纹模板失败!");
}
};

复制代码

之后，通过“确定”按钮onclick事件中的 personData.saveData() 将指纹模板字符串存到数据库

注：在这之前需要在页面源码里引入指纹仪控件对象，一般是放在layout里面：
<xui:layout style="height:100%;width:100%;position:relative;" id="rootLayout"
type="absolute">
<object classid="clsid:933DB2AB-51BF-4204-9E30-C907FE352A5E" width="0" height="0" id="dtm" codebase="libFPDev_WL.ocx"> </object>

Masion · 发表于 2015-2-28 21:33:59

登记指纹模板的操作界面如下图所示:
捕获.PNG

Masion · 发表于 2015-2-28 21:59:14

本帖最后由 Masion 于 2015-2-28 22:05 编辑

在后台的登录动作（/BIZ/system/logic/code/dsrc/OPMProcedure.java）中修改login函数如下

private static Object login(String name, Date loginDate, String pwd, String lang, boolean checkPwd, String ip, Map<Object, Object> options){
ContextHelper.getSessionContext().put(OrgConstants.SYSTEM_LOGIN_IP, ip); //将登录设备的ip放到SessionContext中
name = getLoginNameByMail(name); //拿到用户名name
if (Utils.isEmptyString(lang)){
lang = "zh_CN"; //拿到语言，默认为简体中文
}
List result = (List)OrgUtils.login1(name, loginDate, pwd, lang, checkPwd, ip, options); //查询符合条件的操作者（检查密码符合？）
if ("true".equals(result.get(0))){ //如果返回true
Operator operator = ContextHelper.getOperator(); //取当前操作者
UserManager.instance().addUser(new User(ContextHelper.getSessionContext().getSessionID(), operator.getName(), operator.getID(), CommonUtils.getCurrentDateTime(), operator.getLoginIP()));
//在userManager的示例里表中添加操作者（当前sessionID，当前操作者姓名，当前操作者ID，当前日期，当前IP）
}
//拿到当前登录设备的设备类型和操作系统类型
String deviceType = "未知";
String operatingSystem = "未知";
if (options!=null){
deviceType = (String)options.get("DeviceType");
if (Utils.isEmptyString(deviceType)){
deviceType = "未知";
}
operatingSystem = (String)options.get("OperatingSystem");
if (Utils.isEmptyString(operatingSystem)){
operatingSystem = "未知";
}
}
//将设备类型和操作系统类型压到session上下文中
ContextHelper.getSessionContext().put("DeviceType", deviceType);
ContextHelper.getSessionContext().put("OperatingSystem", operatingSystem);
//这里为新增加内容，这里为新增加内容，这里为新增加内容，这里为新增加内容，这里为新增加内容，
String fingerPrintFeature="yiersan";
if (options!=null){
fingerPrintFeature = (String)options.get("fingerPrintFeature");
checkFingerPrint(fingerPrintFeature,name); //检查指纹是否符合
}
//新增完毕，新增完毕，新增完毕，新增完毕，新增完毕，新增完毕，新增完毕，新增完毕，新增完毕，新增完毕，
checkClientApp(); //检查客户端设备
return result; //返回符合条件的操作者列表
}

复制代码

在本文件需要引入厂家提供的指纹对比的类：import com.wellcom.verify.GfpVerifyWell;

		自动登录	找回密码
密码			注册

[分享] 利用X5平台开发银行代管系统，增加指纹扫描登录模块

评分

评分