本例子以vue语法伪代码书写:

1,获取服务端北京时间

getRealTime() {
let that = this;
var xhr = new XMLHttpRequest();
if( !xhr ){
xhr = new ActiveXObject("Microsoft.XMLHTTP");
}
xhr.open("HEAD",location.href,true);
xhr.onreadystatechange=function(){
if( xhr.readyState == 4 && xhr.status == 200 ){
that.nowTime = xhr.getResponseHeader("Date");
that.changeTime();
}
}
xhr.send(null);
}

2,实现闹钟走动

changeTime() {
let that = this;
if(that.nowTime){
setInterval(() => {
var t = new Date(that.nowTime).getTime();
t += 1000;
that.nowTime = new Date(t).pattern('yyyy-MM-dd HH:mm:ss');
}, 1000);
}
}

3,页面使用

<div>北京时间:{{nowTime}}</div>

js 获取服务端时间,并实现时钟的更多相关文章

  1. js获取服务端IP及端口及协议

    alert("location:"+window.location); alert("href: "+window.location.href); alert( ...

  2. 项目开发中的一些注意事项以及技巧总结 基于Repository模式设计项目架构—你可以参考的项目架构设计 Asp.Net Core中使用RSA加密 EF Core中的多对多映射如何实现? asp.net core下的如何给网站做安全设置 获取服务端https证书 Js异常捕获

    项目开发中的一些注意事项以及技巧总结   1.jquery采用ajax向后端请求时,MVC框架并不能返回View的数据,也就是一般我们使用View().PartialView()等,只能返回json以 ...

  3. 微信小程序 客户端时间 与 服务端时间

    服务端时间 db.serverDate(); 在操作数据库,上传数据的时候可以使用服务端时间 wx.cloud.init();//初始化云 const db = wx.cloud.database() ...

  4. Vue 爬坑之路(十一)—— 基于 Nuxt.js 实现服务端渲染(SSR)

    直接使用 Vue 构建前端单页面应用,页面源码时只有简单的几行 html,这并不利于网站的 SEO,这时候就需要服务端渲染 2016 年 10 月 25 日,zeit.co 背后的团队对外发布了一个 ...

  5. 使用DWR实现JS调用服务端Java代码

    DWR简介 DWR全称Direct Web Remoting,是一款非常优秀的远程过程调用(Remote Procedure Call)框架,通过浏览器提供的Ajax引擎实现在前端页面的JS代码中调用 ...

  6. next.js、nuxt.js等服务端渲染框架构建的项目部署到服务器,并用PM2守护程序

    前端渲染:vue.react等单页面项目应该这样子部署到服务器 貌似从前几年,前后端分离逐渐就开始流行起来,把一些渲染计算的工作抛向前端以便减轻服务端的压力,但为啥现在又开始流行在服务端渲染了呢?如v ...

  7. js 获取当前的时间

    第一个小程序,用js获取当前的时间,,比较特殊的是 月是从0开始算的,显示的时候要加1,获取日用getDate(),获取周 getDay(), 直接上代码 <!DOCTYPE html> ...

  8. asp.net获取服务端和客户端信息

    asp.net获取服务端和客户端信息 获取服务器名:Page.Server.ManchineName获取用户信息:Page.User 获取客户端电脑名:Page.Request.UserHostNam ...

  9. 客户端获取服务端自定义类数据 z

    客户端获取服务端自定义类数据 问题一:超时问题,在最后获取数据的时候突然提示服务超时,服务已断开 解决:配置文件添加: <bindings> <wsHttpBinding> & ...

随机推荐

  1. Django 中使用redis

    Django使用redis   方式一,使用Django-redis模块 #安装: pip3 install django-redis CACHES = { "default": ...

  2. .net core 根据已有数据库创建实体Model

    这三个引用需要与.net core 版本一致,否则后续其他操作时会出错 可以到NuGET包中找到对应的版本然后添加,或者使用一下语句将版本号修改为.net core对应的版本然后执行 Install- ...

  3. 洛谷 P4779 【模板】单源最短路径(标准版) 题解

    P4779 [模板]单源最短路径(标准版) 题目背景 2018 年 7 月 19 日,某位同学在 NOI Day 1 T1 归程 一题里非常熟练地使用了一个广为人知的算法求最短路. 然后呢? 100 ...

  4. GoCN每日新闻(2019-10-13)

    GoCN每日新闻(2019-10-13) 1. 通过测试学习Go语言 https://mp.weixin.qq.com/s/MGT_yoP_NdWVGpwlAJFK4A2. go panic reco ...

  5. 【AtCoder】 ARC 103

    link C-//// 直接算会出现奇偶两组选了同一个数,注意处理一下就行 #include<bits/stdc++.h> #define ll long long #define dbg ...

  6. Linux 备份工具dump

    dump的功能很强,除了可以备份整个文件外,还能够针对目录来备份,还可以指定等级.什么意思呢?假设你的/home是独立的一个 文件系统,那你第一次进行过dump后,再进行第二次dump时,可以指定不同 ...

  7. socket http tcp ip 区别联系

    功能是实现继承复用.刚才做了一个简要的概述,里面有一些常用的概念,这里做个简短的概念普及介绍:(1),TCP/IP------TPC/IP协议是传输层协议,主要解决数据如何在网络中传输.(2),Soc ...

  8. 【Tensorflow】tf.nn.depthwise_conv2d如何实现深度卷积?

    版权声明:本文为博主原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接和本声明. 本文链接:https://blog.csdn.net/mao_xiao_feng/article/ ...

  9. Unity3D新手入门初级教程

    根据游戏调查公司 Newzoo 针对全球手机游戏市场所做的调查报告显示,2016年全球游戏市场规模将达到 996 亿美元,其中手机游戏市场将以 21.3% 的增幅获得约 369 亿美元的收入,而中国手 ...

  10. Spark2.x(六十):在Structured Streaming流处理中是如何查找kafka的DataSourceProvider?

    本章节根据源代码分析Spark Structured Streaming(Spark2.4)在进行DataSourceProvider查找的流程,首先,我们看下读取流数据源kafka的代码: Spar ...