SSE 服务器推送

服务器推送在某些场景下是非常重要且不可或缺的部分，比如看 NBA 总决赛的时候，各种比赛数据的实时更新等，而著名的 WebSocket 协议就可以很简单的实现服务器推送，当然我要讲的并不是 WebSocket ，而是 server-sent event （ SSE ）。

SSE

Server-sent event （ 简称 SSE ），顾名思义，服务器推送事件，在 web 的 HTML5 标准中已经得到实现。

SSE 本质上仍然是使用 HTTP（ 包括后文均指 1.1 版 ）协议，其本身并没有跳出 HTTP 协议内容的规范， HTTP 协议其实是无法做到服务器主动推送的，那么 SSE 又是如何实现的呢？

当我们点击某个视频进行观看，这时就相当于客户端发起一个 HTTP 请求，而视频服务器接受到请求之后进行响应，并将视频通过 stream 的形式源源不断的发送给客户端，其实这就是我们看视频的时候不断增长的进度条，为什么这样做，因为响应的文件太大，无法直接完成传输，所以就以 stream 流的形式进行。

而 SSE 其实与上面的场景类似，在响应上做文章，仍然由客户端发起请求，但是服务器接受到请求后保持此连接，一次一次慢慢的推送消息，这就形成了我们看到的服务器推送。

SSE 兼容性一览

通过上图我们可以看到 SSE 在 PC 和移动端都是支持的，至于 IE 这个老大难，大家都懂的。

实战

1、先准备一个我们的服务器端，每秒钟推送数据：

很简单是不是，重点关注下红色框中的部分，保持连接、使用事件流的形式、不使用缓存，每秒钟推送一下当前的时间等，注释我都写了，你肯定可以看懂。

2、再写个前端页面负责展示：

代码很简单，打印下服务器推送的数据，看我的注释你就明白了。

3、最终的效果：

结语

SSE 实现服务器推送更加轻量、实现更简单，某些时候是一种不错的选择。