手机短信验证码计时后转变app后在切回来并未更新计时的情况
原创使用的是vue框架,编写了发送验证码的功能,后来发现如果剩余的验证码被发送40s, 剪切并将页面改回40s,这太离谱了,然后我将使用缓存进行处理。
我用注释标记了关键部分的代码。
// 发送验证码
async sendCode(newKeyCode = undefined) {
if (!this.isSendCodeActive) {
return;
}
this.sendCodeLoaing = true;
if (!this.globalProcessData.getPublicKey() && !newKeyCode) {
// 没有publicKeyCode,重新获取
this.rsaFailure();
return;
}
const params = {
data: {
mobile: this.codeForm.phoneNum,
},
};
// 将data数据被加密和封装request再次请求接口
const request = this.$loginUtils.handleEncryptionRequest(
params,
// 如果公钥不存在,则使用刷新的公钥。
newKeyCode || this.globalProcessData.getPublicKey()
);
const response = await sendAuthCode(request).catch(() => {});
if (response.code !== 0) {
this.$message({
message: response.msg,
type: error,
});
this.sendCodeLoaing = false;
return;
}
if (this.timeObj.codeCount) {
clearTimeout(this.timeObj.codeCount);
}
// !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!
window.sessionStorage.setItem(
time_ + location.href,
new Date().getTime()
);
// !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!
this.countDownFn(this.countDownNum);
// this.countDownNum--;
},
// 倒计时
countDownFn(time) {
this.countDownNum = time;
if (time === 0) {
this.sendMsg = 重新发送;
this.countDownNum = COUNT_DOWN_NUMBER;
this.sendCodeLoaing = false;
return;
}
this.countDownNum--;
// !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!
// 当前时间
const nowTime = new Date().getTime();
// !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!
// 上次缓存时间
const lastTime = window.sessionStorage.getItem(time_ + location.href);
// !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!
// 两个时间差
const diff = nowTime - lastTime / 1000;
// !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!
// 如果本地缓存具有读取秒数,则使用本地缓存的读取秒数。
if (diff < 60) {
this.countDownNum = 60 - diff;
}
this.sendMsg = 剩余${this.countDownNum}秒;
this.timeObj.codeCount = setTimeout(() => {
this.countDownFn(this.countDownNum);
}, 1000);
}, 版权声明
所有资源都来源于爬虫采集,如有侵权请联系我们,我们将立即删除
itfan123



