龙空技术网

前端人你在秒杀活动中写的倒计时真的准确吗

程序员成梓 515

前言:

当前小伙伴们对“倒计时js毫秒”大致比较注意,姐妹们都需要分析一些“倒计时js毫秒”的相关知识。那么小编也在网摘上网罗了一些对于“倒计时js毫秒””的相关知识,希望各位老铁们能喜欢,咱们一起来学习一下吧!

原标题:前端倒计时不准的问题怎么处理

大家好,我是成梓,每天不造两个BUG就不开心的的“老”程序员。

马上双12啦,电商网站,团购类网站很多都有都有秒杀的活动。秒杀自然涉及前端倒计时的问题。

很多人的做法就是用定时器就处理了,觉得这个功能超简单,而且还没什么技术含量。

活动做多了你有没有考虑过下边这两个问题:

由于js是单线程的,也就是阻塞的,定时可定会不准。无论setTimeout()还是setInterval(),可能都有问题;他们有人写了一个页面来验证到底有没有误差。从跑出来的数据看出来已经存在误差了。用户先打开你的活动页面,然后切换到其他应用,再回到活动页面,这期间js可能停止执行。

有的人就给改进方案了。

本质上来说,只需要两个时间点就可以了:当前时间、秒杀开始时间。有了这两个数据,我们就可以倒计时了。两个时间的差值就是我们要倒计时的时间差,每隔1秒减少1或者每隔1毫秒减少1。重要的是,当前的时间不要用new Date(),这是获取手机的时间,如果用户修改手机的时间,这个会跟随变化的。基于此,当前的时间必须是服务端传过来的。用户每次打开网页,都会传服务器的当前时间。秒杀开始的时间一般是后台配置好的,只要配置了,他就定了。是个不变的量。

还有的人给了另外的方案,初始化时请求一次服务器时间 serverTime,再 new 一个设备时间 deviceTime,deviceTime 与 serverTime 的差作为时间偏移修正,

每次递归时 new 一个系统时间,解决 setTimeout 和 setInterval 不准确的问题,倒计时就没问题了。

对此,你有什么看法,贴一个我整理的方案,欢迎评论区发现制造bug。

=====END=====

我是成梓,关注我,带你开心的制造BUG。

每日分享一句话

有些路,你不走下去,就不会知道那边的风景有多美。

声明

本文章为“成梓”原创,未经允许不得删改、盗用至任何平台,否则将追究法律责任。

标签: #倒计时js毫秒