极验证的运用（nodejs部署）

在页面中加入一些验证码，避免外部恶意破坏。下面描述的是本人在工作过程中用nodejs对极验证部署的总结。

1、用nodejs部署极验证思路：
安装依赖：request、express、body-parser、supervisor、express-session。
利用 npm install gt3-sdk –save 安装SDK，然后引入：var Geetest = require('gt3-sdk');
部署第一个接口：

var click = require('./static/click');
app.get("/gt/register-click", function (req, res) {

    // 向极验申请每次验证所需的challenge
    click.register(null, function (err, data) {
        if (err) {
            console.error(err);
            res.status(500);
            res.send(err);
            return;
        }

        if (!data.success) {
            // 进入 failback，如果一直进入此模式，请检查服务器到极验服务器是否可访问
            apirefer

            // 为以防万一，你可以选择以下两种方式之一：

            // 1. 继续使用极验提供的failback备用方案
            req.session.fallback = true;
            res.send(data);

            // 2. 使用自己提供的备用方案
            // todo
        } else {
            // 正常模式
            req.session.fallback = false;
            res.send(data);
        }
    });
});

部署第二个接口：

app.post("/gt/validate-click", function (req, res) {
    // 对ajax提供的验证凭证进行二次验证
    click.validate(req.session.fallback, {
        geetest_challenge: req.body.geetest_challenge,
        geetest_validate: req.body.geetest_validate,
        geetest_seccode: req.body.geetest_seccode
    }, function (err, success) {
        if (err) {
            // 网络错误
            res.send({
                status: "error",
                info: err
            });

        } else if (!success) {
            // 二次验证失败
            res.send({
                status: "fail",
                info: '登录失败'
            });
        } else {
            res.send({
                status: "success",
                info: '登录成功'
            });
        }
    });
});

2、web页面使用极验：
引入初始化的js文件：<script src="gt.js"></script>
调用初始化函数进行初始化：

$.ajax({
        url: "gt/register-click?t=" + (new Date()).getTime(), // 加随机数防止缓存
        type: "get",
        dataType: "json",
        success: function (data) {
            // 调用 initGeetest 进行初始化
            // 参数1：配置参数
            // 参数2：回调，回调的第一个参数验证码对象，之后可以使用它调用相应的接口
            initGeetest({
                // 以下 4 个配置参数为必须，不能缺少
                gt: data.gt,
                challenge: data.challenge,
                offline: !data.success, // 表示用户后台检测极验服务器是否宕机
                new_captcha: data.new_captcha, // 用于宕机时表示是新验证码的宕机

                product: "popup", // 产品形式，包括：float，popup
                width: "300px"
                // 更多前端配置参数说明请参见：http://docs.geetest.com/install/client/web-front/
            }, handler);
        }
    });

初始化完成之后，进行具体的流程操作。

var handler = function (captchaObj) {
        captchaObj.appendTo('#captcha');
        captchaObj.onReady(function () {
            $("#wait").hide();
        });
        $('#btn').click(function () {
            var result = captchaObj.getValidate();
            if (!result) {
                return alert('请完成验证');
            }
            $.ajax({
                url: 'gt/validate-click',
                type: 'POST',
                dataType: 'json',
                data: {
                    username: $('#username2').val(),
                    password: $('#password2').val(),
                    geetest_challenge: result.geetest_challenge,
                    geetest_validate: result.geetest_validate,
                    geetest_seccode: result.geetest_seccode
                },
                success: function (data) {
                    if (data.status === 'success') {
                        alert('登录成功');
                    } else if (data.status === 'fail') {
                        alert('登录失败，请完成验证');
                        captchaObj.reset();
                    }
                }
            });
        })
        // 更多前端接口说明请参见：http://docs.geetest.com/install/client/web-front/
    };

也可以换成绑定按钮的登录方式，需要把初始化函数中的参数product换成：bind。
后续的操作代码做如下修改：

var handler = function (captchaObj) {
        captchaObj.appendTo('#captcha');
        captchaObj.onReady(function () {
            $("#wait").hide();
        });
        captchaObj.onSuccess(function(){
            var result = captchaObj.getValidate();
            if (!result) {
                return alert('请完成验证');
            }
            $.ajax({
                url: 'gt/validate-click',
                type: 'POST',
                dataType: 'json',
                data: {
                    username: $('#username2').val(),
                    password: $('#password2').val(),
                    geetest_challenge: result.geetest_challenge,
                    geetest_validate: result.geetest_validate,
                    geetest_seccode: result.geetest_seccode
                },
                success: function (data) {
                    if (data.status === 'success') {
                        alert('登录成功');
                    } else if (data.status === 'fail') {
                        alert('登录失败，请完成验证');
                        captchaObj.reset();
                    }
                }
            });
            // 更多前端接口说明请参见：http://docs.geetest.com/install/client/web-front/
        })
        window.gt = captchaObj;
    };

    $('#btn').click(function(){
        window.gt.verify();
    })

最后具体的项目代码可以参照： https://github.com/wwjhzc/A-validation
项目部署官方文档：https://docs.geetest.com/install/deploy/client/web
作者：rookie.he（kuke_kuke）
博客链接：http://blog.csdn.net/qq_33599109
欢迎关注支持，谢谢！