前端用js登录失败次数五次,倒计时禁止登录
前端用js登录失败次数上线,倒计时禁止登录
// 取出输入密码错误的次数
let error_times = window.localStorage.getItem('userCode')
// 超过登录次数
if(error_times >= 3){
this.disabled = true //禁用按钮
// 获取触发时间获取超次数时间并保存
var timestamp = parseInt(new Date().getTime()/1000)
window.localStorage.setItem('timestamp',timestamp)
//页面显示倒计时59秒
this.timeOut = Math.floor((59000/1000) %60)
var auth_timetimer = setInterval(()=>{
this.timeOut--;
if(this.timeOut<=0){
this.count = 0,
this.disabled = false; //关闭禁用登录状态
window.localStorage.removeItem('userCode') //清空登录错误次数
clearInterval(auth_timetimer); //清除倒计时
}
}, 1000);
// 刷新页面时
created() {
this.init() //页面初始化
},
methods: {
init(){
let error_times = window.localStorage.getItem('userCode')
//判断是否输入了三次错误密码
if(error_times >= 3){
this.disabled = true //禁用按钮
var nowTime = parseInt(new Date().getTime()/1000) //进入页面的时间
//判断是否存在倒计时
if(window.localStorage.getItem('timestamp')){
//输入超过3次被限制的时间
var timestamp = window.localStorage.getItem('timestamp')
if(timestamp >= 0){ //判断倒计时是否结束
//过去的时间
var ms = nowTime-timestamp
//剩余的时间
this.timeOut = 59-ms
//判断倒计时是否结束
if(59000 > this.timeOut){
var auth_timetimer = setInterval(()=>{
this.timeOut--;
if(this.timeOut<=0){
this.count = 0,
this.disabled = false;
window.localStorage.removeItem('userCode')
clearInterval(auth_timetimer);
}
}, 1000);
}
}
}else{
this.disabled = false
window.localStorage.removeItem('userCode')
}
},
}
参考文献: https://blog.csdn.net/weixin_47211345/article/details/120450271
浙公网安备 33010602011771号