官方网站

前端

准备工作:确保已经在极验用户后台获取到了 captchaId

配置参数

1.引入初始化函数

1
<script src="https://static.geetest.com/v4/gt4.js"></script>

2.初始化

1
<div id="captcha"></div>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
initGeetest4(
{
captchaId: "您的captchaId",
nativeButton: {
width: "300px",
height: "40px",
}, // 极验按钮样式设置
userInfo: "user@geetest.com", // 用户信息
},
function (captcha) {
// captcha为验证码实例
captcha.appendTo("#captcha"); // 调用appendTo将验证码插入到页的某一个元素中,这个元素用户可以自定义
}
);

3.二次验证

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
initGeetest4(
{
// 省略配置参数
},
function (captchaObj) {
// 省略其他方法的调用

// 这里调用了 onSuccess 方法,该方法介绍见下文
captchaObj.onSuccess(function () {
var result = captchaObj.getValidate();

// ajax 伪代码
$.ajax({
url: "服务端",
data: result,
dataType: "json",
success: function (res) {
console.log(res.result);
},
});
});
}
);

重置

1
captchaObj.reset();

后端

后端使用 Nodejs + Express

官方 Demo

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
var express = require("express");
var querystring = require("querystring");
const crypto = require("crypto");
var axios = require("axios");
var router = express.Router();

// geetest 公钥
// geetest public key
const CAPTCHA_ID = "";

// geetest 密钥
// geetest secret key
const CAPTCHA_KEY = "";

// geetest 服务地址
// geetest server url
const API_SERVER = "http://gcaptcha4.geetest.com";

// geetest 验证接口
// geetest server interface
const API_URL = API_SERVER + "/validate" + "?captcha_id=" + CAPTCHA_ID;

/* GET home page. */
router.get("/", function (req, res, next) {
res.render("index");
});

router.get("/login", function (req, res, next) {
req.query = querystring.parse(req.url.split("?")[1]);
// 前端参数
// web parameter
var lot_number = req.query["lot_number"];
var captcha_output = req.query["captcha_output"];
var pass_token = req.query["pass_token"];
var gen_time = req.query["gen_time"];

// 生成签名, 使用标准的hmac算法,使用用户当前完成验证的流水号lot_number作为原始消息message,使用客户验证私钥作为key
// 采用sha256散列算法将message和key进行单向散列生成最终的 “sign_token” 签名
// use lot_number + CAPTCHA_KEY, generate the signature
var sign_token = hmac_sha256_encode(lot_number, CAPTCHA_KEY);

// 向极验转发前端数据 + “sign_token” 签名
// send web parameter and “sign_token” to geetest server
var datas = {
lot_number: lot_number,
captcha_output: captcha_output,
pass_token: pass_token,
gen_time: gen_time,
sign_token: sign_token,
};

// post request
// 根据极验返回的用户验证状态, 网站主进行自己的业务逻辑
// According to the user authentication status returned by the geetest, the website owner carries out his own business logic
post_form(datas, API_URL)
.then((result) => {
if (result["result"] == "success") {
console.log("validate success");
res.send("success");
} else {
console.log("validate fail:" + result["reason"]);
res.send("fail");
}
})
.catch((err) => {
// 当请求Geetest服务接口出现异常,应放行通过,以免阻塞正常业务。
// When the request geetest service interface is abnormal, it shall be released to avoid blocking normal business.
console.log("Geetest server error:" + err);
res.send("success");
});
});

// 生成签名
// Generate signature
function hmac_sha256_encode(value, key) {
var hash = crypto
.createHmac("sha256", key)
.update(value, "utf8")
.digest("hex");
return hash;
}

// 发送post请求, 响应json数据如:{"result": "success", "reason": "", "captcha_args": {}}
// Send a post request and respond to JSON data, such as: {result ":" success "," reason ":" "," captcha_args ": {}}
async function post_form(datas, url) {
var options = {
url: url,
method: "POST",
params: datas,
timeout: 5000,
};

var result = await axios(options);

if (result.status != 200) {
// geetest服务响应异常
// geetest service response exception
console.log("Geetest Response Error, StatusCode:" + result.status);
throw new Error("Geetest Response Error");
}
return result.data;
}

module.exports = router;