如何知道 reCAPTCHA v3 是否有效？
How to know if reCAPTCHA v3 works or not?
我的前端是这样使用 vuetify 的：
validate: async function () {
let tokenCaptcha
await this.$recaptcha('login').then((token) => {
tokenCaptcha = token
})
if (this.$refs.form.validate() && tokenCaptcha) {
let params = {
birthDate: this.birthday,
emailAddress: this.email,
name: this.fullname,
phoneNumber: this.phone,
recaptcha: tokenCaptcha
}
this.modalSummary = true
await this.setSummary(params) // Async vuex store / post to api backend
if (this.dataSummary) {
this.success = true
} else {
this.success = false
}
}
}
参考：https://www.npmjs.com/package/vue-recaptcha-v3
我的 backend/server 端像这样使用 express js(node js) :
app.post('/summary', function (req, res) {
if (req.body.recaptcha === undefined || req.body.recaptcha === '' || req.body.recaptcha === null) {
res.send({success: false, msg: 'Please select captcha first'});
return;
}
const secretKey = 'xxxxxx';
const verificationURL = `https://www.google.com/recaptcha/api/siteverify?secret=${secretKey}&response=${req.body.recaptcha}&remoteip=${req.connection.remoteAddress}`;
https.get(verificationURL, (resG) => {
let rawData = '';
resG.on('data', (chunk) => { rawData += chunk })
resG.on('end', function() {
try {
var parsedData = JSON.parse(rawData);
if (parsedData.success === true) {
let data = {
date_of_birth: req.body.birthDate,
email_address: req.body.emailAddress,
full_name: req.body.name,
phone_number: req.body.phoneNumber,
}
let sql = "INSERT INTO summary SET ?";
let query = conn.query(sql, data,(err, results) => {
if(err) throw err;
res.send({success: "OK", message: 'Success', data: data});
});
} else {
res.send({success: false, msg: 'Failed captcha verification'});
return;
}
} catch (e) {
res.send({success: false, msg: 'Failed captcha verification from Google'});
return;
}
});
});
});
代码有效。但是如何知道 reCAPTCHA v3 是否有效？
因为版本 3 验证码没有出现。我只是想确定我的代码流是否正确。除此之外，如果它是机器人，我想检查验证码是否出现
- 在用户界面（右下角）你应该有这个：
- 后台：获取recaptcha的响应结果。喜欢：
console.info(parsedData)
必须看起来像：
{
"success": true|false, // whether this request was a valid reCAPTCHA token for your site
"score": number // the score for this request (0.0 - 1.0)
"action": string // the action name for this request (important to verify)
"challenge_ts": timestamp, // timestamp of the challenge load (ISO format yyyy-MM-dd'T'HH:mm:ssZZ)
"hostname": string, // the hostname of the site where the reCAPTCHA was solved
"error-codes": [...] // optional
}
^https://developers.google.com/recaptcha/docs/v3#site_verify_response
您也可以将令牌登录到控制台。
每次发送表单时都会生成不同的令牌 - 这样您就知道验证码 v3 有效。
只需输入：
console.log(token);
Yuu 应该在控制台中得到这种类型的唯一字符串：
enter image description here
在网页（右下角）上，您应该有如下 Google 验证码图标：
您可以在管理页面验证点击数和分数分布(https://www.google.com/recaptcha/about/)
我的前端是这样使用 vuetify 的：
validate: async function () {
let tokenCaptcha
await this.$recaptcha('login').then((token) => {
tokenCaptcha = token
})
if (this.$refs.form.validate() && tokenCaptcha) {
let params = {
birthDate: this.birthday,
emailAddress: this.email,
name: this.fullname,
phoneNumber: this.phone,
recaptcha: tokenCaptcha
}
this.modalSummary = true
await this.setSummary(params) // Async vuex store / post to api backend
if (this.dataSummary) {
this.success = true
} else {
this.success = false
}
}
}
参考：https://www.npmjs.com/package/vue-recaptcha-v3
我的 backend/server 端像这样使用 express js(node js) :
app.post('/summary', function (req, res) {
if (req.body.recaptcha === undefined || req.body.recaptcha === '' || req.body.recaptcha === null) {
res.send({success: false, msg: 'Please select captcha first'});
return;
}
const secretKey = 'xxxxxx';
const verificationURL = `https://www.google.com/recaptcha/api/siteverify?secret=${secretKey}&response=${req.body.recaptcha}&remoteip=${req.connection.remoteAddress}`;
https.get(verificationURL, (resG) => {
let rawData = '';
resG.on('data', (chunk) => { rawData += chunk })
resG.on('end', function() {
try {
var parsedData = JSON.parse(rawData);
if (parsedData.success === true) {
let data = {
date_of_birth: req.body.birthDate,
email_address: req.body.emailAddress,
full_name: req.body.name,
phone_number: req.body.phoneNumber,
}
let sql = "INSERT INTO summary SET ?";
let query = conn.query(sql, data,(err, results) => {
if(err) throw err;
res.send({success: "OK", message: 'Success', data: data});
});
} else {
res.send({success: false, msg: 'Failed captcha verification'});
return;
}
} catch (e) {
res.send({success: false, msg: 'Failed captcha verification from Google'});
return;
}
});
});
});
代码有效。但是如何知道 reCAPTCHA v3 是否有效？
因为版本 3 验证码没有出现。我只是想确定我的代码流是否正确。除此之外，如果它是机器人，我想检查验证码是否出现
- 在用户界面（右下角）你应该有这个：
- 后台：获取recaptcha的响应结果。喜欢：
console.info(parsedData)
必须看起来像：
{
"success": true|false, // whether this request was a valid reCAPTCHA token for your site
"score": number // the score for this request (0.0 - 1.0)
"action": string // the action name for this request (important to verify)
"challenge_ts": timestamp, // timestamp of the challenge load (ISO format yyyy-MM-dd'T'HH:mm:ssZZ)
"hostname": string, // the hostname of the site where the reCAPTCHA was solved
"error-codes": [...] // optional
}
^https://developers.google.com/recaptcha/docs/v3#site_verify_response
您也可以将令牌登录到控制台。 每次发送表单时都会生成不同的令牌 - 这样您就知道验证码 v3 有效。
只需输入：
console.log(token);
Yuu 应该在控制台中得到这种类型的唯一字符串： enter image description here
在网页（右下角）上，您应该有如下 Google 验证码图标：
您可以在管理页面验证点击数和分数分布(https://www.google.com/recaptcha/about/)