我们在做vue项目时,用户登录是一个重点,当然,手机号码注册登录屡见不鲜,但要防机器大量注册呢,也就是通俗说的防机器人,这时一个 极验验证 就能完美解决这种问题。
话不多说 上代码:
做之前 要先引入一个gt.js
http://static.geetest.com/static/tools/gt.js
反正我是在login页面引入的
想用极验验证 ,首先要获取到UUID
uuid有四种算法:
1、
function
uuid() {
var
s = [];
var
hexDigits =
"0123456789abcdef"
;
for
(
var
i = 0; i < 36; i++) {
s[i] = hexDigits.substr(Math.floor(Math.random() * 0x10), 1);
}
s[14] =
"4"
;
// bits 12-15 of the time_hi_and_version field to 0010
s[19] = hexDigits.substr((s[19] & 0x3) | 0x8, 1);
// bits 6-7 of the clock_seq_hi_and_reserved to 01
s[8] = s[13] = s[18] = s[23] =
"-"
;
var
uuid = s.join(
""
);
return
uuid;
}
|
2、 function
guid() {
return
'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'
.replace(/[xy]/g,
function
(c) {
var
r = Math.random()*16|0, v = c ==
'x'
? r : (r&0x3|0x8);
return
v.toString(16);
});
}
3、
function
guid() {
function
S4() {
return
(((1+Math.random())*0x10000)|0).toString(16).substring(1);
}
return
(S4()+S4()+
"-"
+S4()+
"-"
+S4()+
"-"
+S4()+
"-"
+S4()+S4()+S4());
}
4、
function
uuid(len, radix) {
var
chars =
'0123456789ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz'
.split(
''
);
var
uuid = [], i;
radix = radix || chars.length;
if
(len) {
// Compact form
for
(i = 0; i < len; i++) uuid[i] = chars[0 | Math.random()*radix];
}
else
{
// rfc4122, version 4 form
var
r;
// rfc4122 requires these characters
uuid[8] = uuid[13] = uuid[18] = uuid[23] =
'-'
;
uuid[14] =
'4'
;
// Fill in random data. At i==19 set the high bits of clock sequence as
// per rfc4122, sec. 4.1.5
for
(i = 0; i < 36; i++) {
if
(!uuid[i]) {
r = 0 | Math.random()*16;
uuid[i] = chars[(i == 19) ? (r & 0x3) | 0x8 : r];
}
}
}
return
uuid.join(
''
);
}
然后就是


然后~ 执行你的点击事件 吼吼
成功之后 再发送那个手机验证码 。
不要忘了 获取uuid和init方法 是在进入这个login页面就要立即执行的
所以 放在mounted里 比较合适
放在methods也行 只需要在 这里调用就好了;
总的来说 就是两层验证 第一层是这个极验验证 第二层 才是手机号验证码。