文档章节

js 心跳握手

appleZ
 appleZ
发布于 2015/12/03 13:24
字数 462
阅读 25
收藏 0

1.背景:js需要收集一些信息上报

上报方式是开始 每隔 30s、1min、5min、10min。。上报一次数据,稳定后保持 xxmin上报一次,根据这个情景写了一段心跳握手 配合其他xx的对象进行数据发送

2.说明

构造函数可以传递三个参数 分别是 

timer, count, interval

timer 是一个数组,代表开始时指定间隔的时间段 例如 [30, 60, 90, 120] ,这样就会在开始后的 30s、60s、90、120s发送请求

count 是发送次数,循环上面的发动方式

interval 作用是循环完毕上面指定的时间间隔后一直以特定的时间间隔发送数据

方法只有三种:

add(fn)添加回调函数 

start 开始发送

stop 停止发送

3.下面是记录片段:

var HandShake = (function(){
		var timeout, timerCache;
		var startDate, intval = 0;
		var timerFn = [];
		var inaccuracies = 0;
		var isType = function(param){
			return function(obj){
					Object.prototype.toString.apply(obj) == "[object " + param +"]"
			}
		}
		var isArray = Array.isArray || isType("Array");
		var isFunction = isType("Function");
		
		var handShake = function(timer, count, interval){
			this.timer = timer;
			timerCache = Array.prototype.slice.call(timer);
			this.count = count;
			this.interval = interval;
		}
		
		handShake.prototype.add = function(fn){
			Array.prototype.push.call(timerFn, fn);
		}
		handShake.prototype.start = function(){
			
			var _this = this;
			startDate = startDate || +new Date;
			if(!this.timer.length){
				if(this.count > 1){
					this.count--;
					this.timer = Array.prototype.slice.call(timerCache);
					//this.start();
				}else{
					if(this.interval){
						this.timer = [this.interval];
					}else{
						return;
					}
				}
			}
			var timer_begin = this.timer.shift();
			intval += timer_begin;
			timeout = setTimeout(function(){ 
				var time = +new Date - startDate;
				//console.log(time);
				inaccuracies = time - intval * 1000;//inaccuracies 时间偏差 下次心跳补回来
				for(var i = 0; i < timerFn.length; i++)
				{
					timerFn[i]();
				}
				_this.start();
			}, timer_begin * 1000 - inaccuracies); 
		}
		
		handShake.prototype.stop = function(){
			intval = 0;
			inaccuracies = 0;
			clearTimeout(timeout);
		}
		return handShake;
	})();

4.总结:

握手这里很简单,有需要可以直接拷贝过去,只有一个地方需要说明, setTimeout是异步操作 一般像我们这样的场景时间间隔都不精准,会有些偏差,我里面做了一下时间偏差的处理,时间会在下次心跳的时候做修补,提升了一点准确性。

© 著作权归作者所有

共有 人打赏支持
appleZ
粉丝 1
博文 38
码字总数 9774
作品 0
深圳
Vue 全家桶,深入Vue 的世界

FinGet 26 日志 9 分类 15 标签 RSS GitHub E-Mail SegmentFault 推荐阅读 从浏览器多进程到JS单线程,JS运行机制最全面的一次梳理 前端进阶系列 八段代码彻底掌握 Promise 通俗大白话来理解...

FinGet
07/02
0
0
talent-tan/tio-websocket-showcase

tio-websocket-showcase 项目介绍 展示tio-websocket的用法,官方提供的唯一tio-websocket示范教程 包括wss和流量监控及处理等高级特性 还包括t-io作者写的一个用于连接websocket服务器的js小...

talent-tan
05/06
0
0
web socket and web worker 基础原理及使用

个人认为HTML5最吸引人的两大功能, web socket 和 worker为构建高效能的web应用提供了新的参考方案。 大体来说,web socket提供更高效的传输协议,web worker提供多线程提高web应用计算效率...

ancient_wind
2015/05/25
0
1
浏览器---WEB开发基础之三

通过HTTP协议的介绍,打开网页必须建立TCP连接,然后通过HTTP协议进行交互,因此,浏览器访问网址,第一件事就是建立TCP连接,但是TCP连接是基于IP的,而我们输入的却是网址,所以,实际上第...

ayesd
2014/07/17
0
1
最近排查android webview https的发热耗电和加载速度慢问题解决

最近排查android webview https的发热耗电和加载速度慢问题 问题:H5页面发热耗电 排查:通过android studio profiler 查看CPU消耗曲线,发现静置情况下webview轮播图波浪式消耗CPU,且峰值高...

ljianbing
05/28
0
0

没有更多内容

加载失败,请刷新页面

加载更多

下一页

[雪峰磁针石博客]软件测试专家工具包1web测试

web测试 本章主要涉及功能测试、自动化测试(参考: 软件自动化测试初学者忠告) 、接口测试(参考:10分钟学会API测试)、跨浏览器测试、可访问性测试和可用性测试的测试工具列表。 安全测试工具...

python测试开发人工智能安全
今天
2
0
JS:异步 - 面试惨案

为什么会写这篇文章,很明显不符合我的性格的东西,原因是前段时间参与了一个面试,对于很多程序员来说,面试时候多么的鸦雀无声,事后心里就有多么的千军万马。去掉最开始毕业干了一年的Jav...

xmqywx
今天
2
0
Win10 64位系统,PHP 扩展 curl插件

执行:1. 拷贝php安装目录下,libeay32.dll、ssleay32.dll 、 libssh2.dll 到 C:\windows\system32 目录。2. 拷贝php/ext目录下, php_curl.dll 到 C:\windows\system32 目录; 3. p...

放飞E梦想O
今天
0
0
谈谈神秘的ES6——(五)解构赋值【对象篇】

上一节课我们了解了有关数组的解构赋值相关内容,这节课,我们接着,来讲讲对象的解构赋值。 解构不仅可以用于数组,还可以用于对象。 let { foo, bar } = { foo: "aaa", bar: "bbb" };fo...

JandenMa
今天
1
0
OSChina 周一乱弹 —— 有人要给本汪介绍妹子啦

Osc乱弹歌单(2018)请戳(这里) 【今日歌曲】 @莱布妮子 :分享水木年华的单曲《中学时代》@小小编辑 手机党少年们想听歌,请使劲儿戳(这里) @须臾时光:夏天还在做最后的挣扎,但是晚上...

小小编辑
今天
54
8

没有更多内容

加载失败,请刷新页面

加载更多

下一页

返回顶部
顶部