极验——行为验证的开发与使用

一、极验

    相对于传统的图片验证码，极验将人机交互的安全提升了一个大大的阶梯，无论从页面ui、用户使用体验和网站安全任何一个方面，极验都完美的胜出。本篇主要介绍在开发中如何应用极验行为验证的技术，至于极验api、申请极验应用id和秘钥的方法，请看极验官网，点击这里进入极验官方网站。

二、配置文件

    不同于极验官方API，我将应用id、秘钥等配置数据放在了properties配置文件里，方便进行查看和管理。配置文件如下：

geetest.id=592c1eab4790ba082fd27b24305ef6

geetest.key=1bd3860bf8d3ccce4f050de1456471

geetest.isnewfailback=true

geetest.clienttype=web

    关于如何获取配置文件的信息，请看我的博客：还没写= = 

三、后台方法

    其实后台方法这里主要是转发生成极验验证或验证极验的请求，当然，我们也可以在这里记录具体的信息或者其他。不过这里博主并没有做这些，只是简单的去转发请求。

    1.极验验证初始化

     这里需要说一下，代码里部分的参数是配置在常量类里的，大家在实际使用的时候，根据自己的情况去修改即可。初始化的方法如下：

/**
	 * 初始化极验
	 * 
	 * @param request
	 * @param geetestDto
	 * @param random	防止缓存
	 * @return
	 */
	@RequestMapping("init/{random}")
	@ResponseBody
	@SysControllerLog(description="极验验证初始化",logType=101,module=101)
	public String initGeetest(HttpServletRequest request) {
		GeetestLib geetestLib = new GeetestLib(prop.getPropValue(SysParams.GEETEST_ID),
				prop.getPropValue(SysParams.GEETEST_KEY),Boolean.valueOf(prop.getPropValue(SysParams.GEETEST_CALL_BACK)));
		
		//自定义参数,可选择添加
		User user = (User)request.getSession().getAttribute(SysParams.CURRENT_USER);
		HashMap<String, String> param = new HashMap<String, String>();
		param.put("user_id", user==null?SysParams.ADMIN_ID:user.getUserId()); 	//网站用户id
		param.put("client_type", prop.getPropValue(SysParams.GEETEST_CLIENT_TYPE)); 	
		param.put("ip_address", IPUtil.getRemoteHost(request)); 
		
		String resStr = "{}";
		
		//进行验证预处理
		int gtServerStatus = geetestLib.preProcess(param);
		//将服务器状态设置到session中
		request.getSession().setAttribute(geetestLib.gtServerStatusSessionKey, gtServerStatus);
		//将userid设置到session中
		request.getSession().setAttribute(SysParams.GEETEST_USER_ID, user==null?SysParams.ADMIN_ID:user.getUserId());
		
		resStr = geetestLib.getResponseStr();
		
		System.out.println("请求极验初始化的返回结果为："+resStr);
		return resStr;
	}

    2.极验验证

    极验验证的方法我是没有使用的，如果没有特别需要的管理或记录的可以忽略这个方法。代码如下：

/**
	 * 极验二次验证
	 * 
	 * @param request
	 * @param geetestDto
	 * @return
	 */
	@RequestMapping("verify/{random}")
	@ResponseBody
	@SysControllerLog(description="极验二次验证",logType=101,module=101)
	public String verifyGeetest(HttpServletRequest request) {
		GeetestLib gtSdk = new GeetestLib(prop.getPropValue(SysParams.GEETEST_ID),
				prop.getPropValue(SysParams.GEETEST_KEY),Boolean.valueOf(prop.getPropValue(SysParams.GEETEST_CALL_BACK)));
		
		String challenge = request.getParameter(GeetestLib.fn_geetest_challenge);
		String validate = request.getParameter(GeetestLib.fn_geetest_validate);
		String seccode = request.getParameter(GeetestLib.fn_geetest_seccode);
		
		//从session中获取gt-server状态
		int gt_server_status_code = (Integer) request.getSession().getAttribute(gtSdk.gtServerStatusSessionKey);
		//从session中获取userid
		String userid = (String)request.getSession().getAttribute(SysParams.GEETEST_USER_ID);
		
		//自定义参数,可选择添加
		HashMap<String, String> param = new HashMap<String, String>(); 
		param.put("user_id", userid); 
		param.put("client_type", prop.getPropValue(SysParams.GEETEST_CLIENT_TYPE)); 
		param.put("ip_address", IPUtil.getRemoteHost(request));
		
		int gtResult = 0;
		if (gt_server_status_code == 1) {
			//gt-server正常，向gt-server进行二次验证
			gtResult = gtSdk.enhencedValidateRequest(challenge, validate, seccode, param);
			System.out.println("极验二次校验返回结果："+gtResult);
		} else {
			// gt-server非正常情况下，进行failback模式验证
			System.out.println("failback:use your own server captcha validate");
			gtResult = gtSdk.failbackValidateRequest(challenge, validate, seccode);
			System.out.println("极验二次校验返回结果："+gtResult);
		}

		// 验证成功
		if (gtResult == 1) {
			return AjaxDone.retParam(BackCode.GEETEST_SUCCESS, gtSdk.getVersionInfo());
		} else {		
			return AjaxDone.retParam(BackCode.GEETEST_FAIL, gtSdk.getVersionInfo());
		}
	}

    3.极验返回码

    极验详细的返回码信息，可以参照官方API。

四、前台生成极验验证

    1.demo页面为注册页面，首先引入js（具体路径视个人情况）：

<script type="text/javascript" src="${pageContext.request.contextPath }/static/geetest/gt.js"></script> 

    2.定义极验验证的显示区域

<div>
		        <div id="captcha"> </div>
		    </div>

    3.初始化极验验证

/*****************极验滑动验证*********************/
        $(function(){
        	$.ajax({
			    // 获取id，challenge，success（是否启用failback）
			    url: "${pageContext.request.contextPath }/common/geetest/init/" + (new Date()).getTime(), // 加随机数防止缓存
			    type: "post",
			    dataType: "json",
			    success: function (data) {
			    	var msg =  $.parseJSON(data); 
			         // 调用 initGeetest 初始化参数
		            // 参数1：配置参数
		            // 参数2：回调，回调的第一个参数验证码对象，之后可以使用它调用相应的接口
		            initGeetest({
		                gt: msg.gt,
		                challenge: msg.challenge,
		                new_captcha: msg.new_captcha, // 用于宕机时表示是新验证码的宕机
		                product: "float", // 产品形式，包括：float，popup,当为bind时，可以自定义检查验证，这里不需要记录用户的校验数据，故不使用
		                offline: !msg.success, 
		                width: "100%"
		            }, function (captchaObj) {
		            	captchaObj.appendTo("#captcha");
				        
		            });
			    }
			});
			
        });

    4.验证极验验证的结果

    这里，我是与获取短信验证码的点击事件绑定在一起的，当用户需要获取验证码时，需要先通过短信验证。需要注意的是，captchaObj不是全局变量，所以，建议页面的函数尽量写在初始化函数的回调函数里。代码如下：

var validate = captchaObj.getValidate();
if (!validate) {
	layui.use('layer', function(){
		var $ = layui.jquery, layer = layui.layer; //独立版的layer无需执行这一句
		layer.msg('请点击上方按钮进行验证');
	});
	return;
}

    5.重置极验验证

//重置验证码
captchaObj.reset();

五、使用效果