From ef798981b5f46b7114d25a21e510b159208677be Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E8=82=96=E8=AF=97=E9=9B=85?= Date: Mon, 16 Sep 2019 17:32:26 +0800 Subject: [PATCH] =?UTF-8?q?!494=20=E6=B3=A8=E5=86=8C=E7=9F=AD=E4=BF=A1?= =?UTF-8?q?=E5=80=92=E8=AE=A1=E6=97=B6=E5=AD=98=E5=88=B0localstorage?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/Common/Utils.ts | 54 ---------------- src/UI/Components/MainContent/Regist.tsx | 80 +++++++++++++++--------- 2 files changed, 51 insertions(+), 83 deletions(-) diff --git a/src/Common/Utils.ts b/src/Common/Utils.ts index e89994d97..206b18a3e 100644 --- a/src/Common/Utils.ts +++ b/src/Common/Utils.ts @@ -257,57 +257,3 @@ export function getFileSize(size: number) } } -//CookieUtils -/** - * 添加 cookie - * @param name 名称 - * @param value 值 - * @param expiresHours 过期时间 - */ -export function addCookie(name, value, expiresHours) -{ - let cookieString = `${name}=${escape(value)}`; - // 判断是否设置过期时间,0代表关闭浏览器时失效 - if (expiresHours > 0) - { - const date = new Date(); - date.setTime(date.getTime() + expiresHours * 1000); - cookieString = `${cookieString};expires=${date.toUTCString()}`; - } - document.cookie = cookieString; -} - -/** - * 修改 cookie - * @param name 名称 - * @param value 值 - * @param expiresHours 过期时间 - */ -export function editCookie(name, value, expiresHours) -{ - let cookieString = `${name}=${escape(value)}`; - if (expiresHours > 0) - { - const date = new Date(); - date.setTime(date.getTime() + expiresHours * 1000); // 单位是毫秒 - // @ts-ignore - cookieString = `${cookieString};expires=${date.toGMTString()}`; - } - document.cookie = cookieString; -} - -/** - * 根据名字获取cookie的值 - * @param name - */ -export function getCookieValue(name) -{ - const strCookie = document.cookie; - const arrCookie = strCookie.split('; '); - for (const cookie of arrCookie) - { - const arr = cookie.split('='); - if (arr[0] === name) - return unescape(arr[1]); - } -} diff --git a/src/UI/Components/MainContent/Regist.tsx b/src/UI/Components/MainContent/Regist.tsx index 5c046b69b..e63a08731 100644 --- a/src/UI/Components/MainContent/Regist.tsx +++ b/src/UI/Components/MainContent/Regist.tsx @@ -7,7 +7,7 @@ import { IObservableValue, observable } from 'mobx'; import { PostJson, RequestStatus } from '../../../Common/Request'; import { SignUrl, ResourcesCDN_HOST } from '../../../Common/HostUrl'; import { AppToaster } from '../Toaster'; -import { addCookie, editCookie, getCookieValue } from '../../../Common/Utils'; +import { safeEval } from '../../../Common/eval'; interface IRegistInput { @@ -32,7 +32,8 @@ enum InputType PHONE = 2, OK = 3, } - +const prefix = "time_"; +let SMSTimer: NodeJS.Timeout; @inject("store") @observer export default class Regist extends React.Component<{ store?: TopPanelStore }> { @@ -64,15 +65,6 @@ export default class Regist extends React.Component<{ store?: TopPanelStore }> { PHONE: Intent.NONE, }; } - UNSAFE_componentWillMount() - { - const countdown = getCookieValue('secondsremained') ? getCookieValue('secondsremained') : 0; // 获取cookie值 - if (countdown !== undefined && countdown > 0) - { - this.SMSBtnText = `${countdown}s后重新获取`; - this.settime(); // 开始倒计时 - } - } handleRegist = async () => { if (this.inputIntent.PSW !== Intent.SUCCESS) @@ -152,35 +144,65 @@ export default class Regist extends React.Component<{ store?: TopPanelStore }> { message: "短信已发送，请注意查收", timeout: 1000, }); - addCookie('secondsremained', 120, 120); - const countdown = getCookieValue('secondsremained') ? getCookieValue('secondsremained') : 0; // 获取cookie值 - if (countdown !== undefined && countdown > 0) - { - this.settime(); // 开始倒计时 - } + //存入LocalStorage + localStorage.setItem(prefix + this.registInput.user_phone, new Date().getTime().toString()); + //开始倒计时 + this.SetTime(); } else this.SMSBtnText = `获取短信验证码`; } - private settime = () => + private SetTime = (count: number = 120) => { - let countdown = 120; - // @ts-ignore - countdown = getCookieValue('secondsremained'); - const timer = setInterval(() => + if (SMSTimer) + clearInterval(SMSTimer); + SMSTimer = setInterval(() => { - if (countdown <= 0) + if (count <= 0) { - clearInterval(timer); + clearInterval(SMSTimer); this.SMSBtnText = '获取短信验证码'; - } else + this.inputIntent.PHONE = Intent.SUCCESS; + } + else { - this.SMSBtnText = `${countdown}s后重新获取`; - countdown--; + this.SMSBtnText = `${count}s后重新获取`; + count--; } - editCookie('secondsremained', countdown, countdown + 1); }, 1000); } + // 检查当前手机号在LocalStorage中是否已有记录. 如有记录,倒计时是否过期 + CheckPhoneNumFromLocalStorage() + { + let user_phone = this.registInput.user_phone; + let aa = localStorage.getItem(prefix + user_phone); + clearInterval(SMSTimer); + if (aa) + { + let time = safeEval(aa); + let timeLine = Math.floor((new Date().getTime() - time) / 1000); + if (timeLine < 120) + { + //计时未过期的号码 + this.errMsg = "与上次发送间隔不足两分钟"; + this.flag = InputType.PHONE; + this.SetTime(120 - timeLine); + } + else + { + //计时已过期的号码 + localStorage.removeItem(prefix + user_phone); + this.SMSBtnText = '获取短信验证码'; + this.inputIntent.PHONE = Intent.SUCCESS; + } + } + else + { + //LocalStorage无记录的号码 + this.SMSBtnText = '获取短信验证码'; + this.inputIntent.PHONE = Intent.SUCCESS; + } + } valueTest = async (type: InputType) => { let text = ""; @@ -238,7 +260,7 @@ export default class Regist extends React.Component<{ store?: TopPanelStore }> { { this.flag = InputType.OK; this.errMsg = ""; - this.inputIntent.PHONE = Intent.SUCCESS; + this.CheckPhoneNumFromLocalStorage(); } else {