Tornado - 写一个SSE接口

SSE概述

服务器向客户端推送数据，有很多解决方案。除了“轮询” 和 WebSocket，HTML 5 还提供了 Server-Sent Events（以下简称 SSE）。
一般来说，HTTP 协议只能客户端向服务器发起请求，服务器不能主动向客户端推送。但是有一种特殊情况，就是服务器向客户端声明，接下来要发送的是流信息（streaming）。也就是说，发送的不是一次性的数据包，而是一个数据流，会连续不断地发送过来。这时，客户端不会关闭连接，会一直等着服务器发过来的新的数据流。本质上，这种通信就是以流信息的方式，完成一次用时很长的下载。
SSE 就是利用这种机制，使用流信息向浏览器推送信息。它基于 HTTP 协议，目前除了 IE/Edge，其他浏览器都支持。[1]

代码

客户端

参考http://www.w3school.com.cn/html5/html_5_serversentevents.asp

服务端

class ServerSentEvent(RequestHandler):

    def __init__(self, *args, **kwargs):
        super(ServerSentEvent, self).__init__(*args, **kwargs)
        self.set_header('Content-Type', 'text/event-stream')

    async def get(self):
        while True:
            if condition:
                self.out_put()
            time.sleep(2)

    def out_put(self):
        self.write('data:0\n\n')
        self.flush()

解释

要完成SSE服务端代码，需要如下几个操作：

• 在headers中添加Content-Type: text/event-stream，表明该接口是一个sse接口；

• 在接口中写一个死循环，在循环中：

  • 写入以data:开头，\n\n结尾的数据到输出缓冲区；

  • 将缓冲区数据刷新到请求响应中。

服务端启动后，通过浏览器访问该接口即可看到该请求处于不断刷新状态，并且在满足条件condition情况下会输出data:0。

总结

通过 SSE，可以实现当服务端收到某个操作后(例如上传了一份测试报告)，同时通知 SSE 接口向前端JS发送一个特定数据，JS接收到该数据后可以进行刷新操作，将新生成的数据刷新到页面。

其实 SSE 是将性能压力移交给服务端，从而减少客户浏览器（不断刷新）的性能消耗。

参考

[1] JavaScript 标准参考教程(alpha), 阮一峰