微信h5页面在ios设备上定时器切入后台后不执行导致验证码倒计时出问题解决方法

问题描述：

一般计算验证码的思路是，采用定时器开启60s进行倒计时，然后将60这个值进行递减，将值赋值到显示数据的那个变量上。这种方式在安卓上是没问题的，因为安卓切入后台之后定时器还是会执行，所以时间的计算上不会有问题。但是ios不是，ios一旦切入后台定时器就停了，切回来再继续，所以上述的思路就会有问题，和真正经过的时间不一样了。

解决思路：

为了兼容所有设备，就必须要一直采用计算真实时间差的方式进行倒计时。这样的话，在安卓上面通过计算真实时间差计时，时间没问题。在ios设备上，切入后台切回来的时候，定时器恢复，计算真实的时间差，然后设置上去，这样就可以了。

code：

showCodeTimer() {
   // 初始化显示时间
   this.codeTime = 60；
   // 获取点击时间
   const second = Math.floor(new Date().getTime() / 1000);
   // end

   this.timer = setInterval(() => {
      // 获取当前时间
      const newSecond = Math.floor(new Date().getTime()/1000);
      // 得到剩余时间
      const time = 60 - Math.round(newSecond - second);
      // end

      if (time < 1) {
         // 时间超过了60s就干掉定时器了
         clearInterval(this.timer);
         this.timer = null;
         // 自己的逻辑
      } else {
         // 时间没超过60s,就赋值给显示时间变量
         this.codeTime = time;
      }
   }, 1000);
},