首先说一下,为什么要服务器时间同步, 因为服务器时间和本地电脑时间存在一定的时间差。有些对时效性要求非常高的应用,例如时时彩开奖,是不能容忍这种时间差存在的。

方案1:每次倒计时去服务端请求时间
//开启定时器
var timer = setInterval(function () {
//执行请求,获取当前服务端时间并进行相应操作
}, 1000);

这个方案对于稍微有点经验的开发人员来说,都知道是不可取的。因为这会给服务器造成无法想象的压力,导致应用崩溃。在这个页面停留一分钟,那么请求就发送了60次,假如此时有100个人在访问这个页面,那么一分钟就有6000条请求,人数如果再增长,这绝对会造成不必要的服务器压力。并且这个方案的倒计时,也会存在很大的误差,因为请求存在延迟,跟你的网络状态也有很大的关系。

方案2:从服务端返回以服务器时间为基准的倒计时时间戳
//开启定时器
//假设请求获取到一个时间戳时间差 dateDiff
var timer = setInterval(function () {
//每秒会获取本地时间,这样就算执行的周期不准确 也可以准确的获取时间差
var countDown = endTime - (+Date.now())/1000 + dateDiff;
// 倒计时页面渲染
}, 1000);

优点:

  • 在页面生命周期中请求一次
  • 准确度高,就算页面打开很久还是保持高准确度

缺点:

  • 由于每秒获取当前时间,假如刻意在倒计时时期内,修改了本地时间将会导致倒计时异常。

js 倒计时(服务器时间同步)的更多相关文章

  1. js倒计时 手机休眠时 时间不进行减少

    http://www.111cn.net/wy/js-ajax/94218.htm 手机版网页js倒计时存在的问题与解决的方法 www.111cn.net 更新:2015-09-16 编辑:kp123 ...

  2. js倒计时-倒计输入的时间

    计算指定时间到指定时间之间相差多少天.时.分.秒. 节日.活动.商城常用. 原理: 主要使用到时间戳,也就是从1970 年 1 月 1 日 到指定时间的毫秒数. 1. 求出毫秒差 :当两个时间直接进行 ...

  3. js 倒计时(可自定义时间)

    <html> <head> <title>js 倒计时</title> </head> <body> <div> & ...

  4. js倒计时显示

    <!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>j ...

  5. Js倒计时程序

    Js倒计时程序 点击下载

  6. JS倒计时网页自动跳转代码

    <title>JS倒计时网页自动跳转代码</title> <script language="JavaScript" type="text/ ...

  7. 局域网内Linux服务器时间同步

    局域网内Linux服务器时间同步   1.将一台能够上网的服务器作为时间服务器:  # /usr/bin/rdate -s time-b.timefreq.bldrdoc.gov //将时间服务器与互 ...

  8. JS倒计时 代码

    JS倒计时 代码 <div> <span id="KSD">3</span>天 <span id="KSH">1 ...

  9. 用http-server 创建node.js 静态服务器

    今天做一本书上的例子,结果代码不能正常运行,查询了一下,是语法过时了,书其实是新买的,出版不久. 过时代码如下 var connect=require('connect'); connect.crea ...

随机推荐

  1. UIGraphicsBeginImageContext - 位图上下文

    UIGraphicsBeginImageContext 首先,先来认识一个UIGraphicsBeginImageContext,它会创建一个基于位图的上下文(context)(默认创建一个透明的位图 ...

  2. Java基础---IO(一)---IO流概述、字符流、字节流、流操作规律

    第一讲     IO概述 概述 1.IO流:即InputOutput的缩写. 2.特点: 1)IO流用来处理设备间的数据传输. 2)Java对数据的操作是通过流的方式. 3)Java用于操作流的对象都 ...

  3. windows 计划任务执行python脚本

    1.  查找并打开Windows计划任务 2. 创建任务 3. 输入名称 4. 通过触发器设置运行时间或周期 5. 通过操作,设置运行的脚本 a. 操作选择'启动程序' b. 程序或脚本选择 pyth ...

  4. 广度优先搜索(BFS)——迷宫的最短路径

    宽度优先搜索按照距开始状态由近到远的顺序进行搜索,因此可以很容易的用来求最短路径,最少操作之类问题的答案. 宽度优先搜索介绍(一篇不错的文章). 题目描述: 给定一个大小为N*M的迷宫.迷宫有通道和墙 ...

  5. loadrunner scripts

    1. ReadFile: Action(){ int count,total=0; char buffer [50]; long file_stream; char * filename = &quo ...

  6. 自己动手写fullPage插件

    仿造fullPage.js https://alvarotrigo.com/fullPage/#firstPage 自己参照网上教程写了一个,加了注释.主要是练习造轮子的能力,需求是不断变化的只拿来用 ...

  7. 设计模式,Let's “Go”! (下)

    * { color: #3e3e3e } body { font-family: "Helvetica Neue", Helvetica, "Hiragino Sans ...

  8. 安卓两个build.gradle的区别

    作为安卓入门选手,在导入第三方的时候才发现居然有两个build.gradle,我说咋不对啊,原来是导错了(可能是因为我没有看安卓培训的视频吧). 那么就说一下这两个的作用(一个Project的,一个M ...

  9. ArrayBuffer和TypedArray,以及Blob的使用

    前端使用TypedArray编辑二进制 ES6提供了, ArrayBuffer和TypedArray, 让前端也可以直接操作编辑二进制数据, 网页中的类型为file的input标签, 也可以通过Fil ...

  10. 教学服务系统设计之PHP后台设计

    项目简介 本项目是与@nameoverflow同学合作.该同学负责vue 前端的设计,我负责php后台的接口实现.本文将主要记录php后台. 本项目的Github地址:https://github.c ...