原创：小姐姐味道(微信公众号ID：xjjdog)，欢迎分享，转载请保留出处。

本文实现了一个类似jenkins滚动日志的小功能，如果你正在做发布系统类似的东西，这个功能会非常有用。

滚动日志

jenkins的日志能够滚动显示，关闭后重新进入依然能够继续滚动，非常棒。做这种效果，直接想到的有两种方式：

1) Websocket

2) 轮询获取

可是我太笨了，websocket代码对我来说有点复杂。另外我还没想清楚如果关了日志窗口重新进入，ws会有什么样的反应。所以我们还是轮询吧。

通过chrome的Inspect功能去偷窥jenkins。可以看到，每隔1秒钟会发送一次请求到服务器，进行增量日志的获取。传入的参数只有一个，就是文件偏移量。

我觉得我们可能想一块儿去了。

整个过程还是比较简单的，下面简短的描述下，并附上最主要功能的代码块。

服务端

开启一个新的线程执行构建

过程如下：

两点说明：

1) 终止条件成功的判断需要进行约定。比如，读到”BUILD-OK”字样，证明Build成功

2) 服务可能异常终止。所以需要有定时清理进程，去更新长时间没有相应的线程状态

3) 通过添加一个内存Map，可以很容易实现正在执行的JOB功能

根据提供的偏移量读取文件内容

String logPath = "tmp.log";BufferedReader reader = new BufferedReader( new FileReader(new File(logPath)));/* 跳过已经读取过的日志 */long realSkip = reader.skip(start);/* 从跳过的地址开始读取下面的日志 */String line;StringBuilder sb = new StringBuilder();while ((line = reader.readLine()) != null) { sb.append(line); sb.append(""); /* 将读取的长度追加到变量中 */ realSkip +=sb.length();}reader.close();/* 查询build的状态，用来给前端滚动日志一个截止状态 */int status = this.queryBuildStatus(buildId);/*返回三个值1)本次读取的内容2)下次读取的偏移量3)项目状态*/return new ChunkLog(sb.toString(),realSkip ,status);

本段代码试图通过传入的文件偏移量，读取当前文件剩余的内容返回给用户。如果文件持续写入，通过不断的轮询，就可以达到滚动日志的效果。

不多说，看注释即可。

前端

设置几个全局变量

//起始便宜量var Start = 0//轮询var timer = null

主要的轮询接口

id为log的

标签，用来接收、显示日志。

function appendData(hash) { $.ajax({ url: '/chunk/' + hash + '/' + Start, type: 'GET', dataType: 'json', success: function(res) { var log = res.log; $("#log").append(log) Start = res.start End = res.end if (End) { if(typeof timer !== 'undefined' ){ clearInterval(timer) } } } })}

按钮触发事件

//重置$("#log").html("")Start = 0;timer = setInterval(function() { appendData(hash)},1000);

当点击查看日志时，触发此函数，就可以随时随地看到最新的滚动日志了。

作者简介：小姐姐味道 (xjjdog)，一个不允许程序员走弯路的公众号。聚焦基础架构和Linux。十年架构，日百亿流量，与你探讨高并发世界，给你不一样的味道。我的个人微信xjjdog0，欢迎添加好友，​进一步交流。​