基于HTML5实现的网页录屏器设计 报告+代码

基于HTML5实现的录屏器

目录

基于HTML5实现的录屏器	1

1.项目简介	1

2.1记录影响页面元素变化的Action	2

2.2通过样条曲线模拟鼠标轨迹	4

2.3通过鼠标数据生成热力图	5

2.4对于用户隐私的脱敏	6

2.5沙箱化提升安全	6

2.6基于视频GOP(I/B/P帧)算法的压缩技术	6

2.7播放、跳转与快进	6

2.8在客户端进行的Gzip压缩	7

2.9数据上传	7

1.项目简介

如果你爱打游戏，一定打过魔兽争霸3（暴露年纪），你也许会游戏导出的录像文件感到好奇，明明打了一个小时游戏，为什么录像才几百KB而已。不过很快你又发现另一个问题，在每次导入录像的时候需要重新加载一次地图，否则就不能播放。

录像记录的数据不是一个视频文件，而是带着时间戳的一系列动作，导入地图的时候，实际相当于初始了一个状态，在这个状态的基础上，只需要对之前的动作进行还原，也就还原了之前的游戏过程，这就是repl的基本原理了