|
|
所谓的SSE(Sever-Sent Event),就是浏览器向服务器发送了一个HTTP请求，保持长连接，服务器不断单向地向浏览器推送“信息”，这么做是为了节省网络资源，不用一直发请求，建立新连接。
- 优点：SSE和WebSocket相比，最大的优势是便利，服务端不需要第三方组件，开发难度低，SSE和轮询相比它不用处理很多请求，不用每次建立新连接，延迟低。
- 缺点：如果客户端有很多需要保持很多长连接，这回占用大量内存和连接数。
数据格式 客户端实现 if(typeof(EventSource)!=="undefined") { //判断是否支持EventSource
var source = new EventSource('push'); //为http://localhost:8080/sse/push
source.addEventListener('message', function (e) {
}
source.addEventListener('open', function (e) {
}
source.addEventListener('error', function (e) {
}
} |
支持默认3种事件，连接一旦建立就会触发open事件，客户端收到服务器发来的数据，就会触发message事件，如果发生通讯错误（如断开连接）就会触发error事件。
默认情况，服务器发来的数据，总是触发message事件，开发者也可以自定义SSE事件，这种情况下，发送回来的数据不会触发message事件。
source.addEventListener('foo', function (event) {
var data = event.data;
// handle message
}, false); |
上面的例子中使用foo事件监听。
服务器实现 服务器向浏览器发送的 SSE 数据，必须是 UTF-8 编码的文本，具有如下的 HTTP 头信息。
Content-Type: text/event-stream
Cache-Control: no-cache
Connection: keep-alive |
每一次发送的信息，由若干个message组成，每个message之间用
分隔。每个message内部由若干行组成，每一行都是如下格式。
上面的field可以取四个值。
data //数据项
event //事件项 默认message
id //数据标识符用id字段表示，相当于每一条数据的编号
retry //重连时间 |
此外，还可以有冒号开头的行，表示注释。通常，服务器每隔一段时间就会向浏览器发送一个注释，保持连接不中断。
一般发送格式：
event: userconnect
data: {"username": "bobby", "time": "02:33:48"}
retry:1000 |
问题 我们来看一下《颠覆者》中的例子：
@ResponseBody
public String push() {
Random r = new Random();
try {
Thread.sleep(5000L);
} cache(Exception e) {
e.printStackTrace();
}
return "data:Testing 1,2,3" + r.nextInt()+"
";
} |
问题1：长连接？ 这里return之后连接就中断了，怎么反复推送消息？
图1：连接不断地被打开关闭
图2：请求一直再重复发送
问题描述：
我们可以看到每个请求只返回了一次数据，服务器每次发完数据就断开了连接，但SSE默认会自动重连，所以客户端不断地重连（重新发送请求），但这样就类似ajax长轮询，并不减少网络资源占用。
SSE 浏览器默认如果3秒内没有发送任何信息，则开始重连。服务器端可以用retry参数信息，指定通信的最大间隔时间
改进方案：
我们发送消息时，不用return，因为一旦return 连接就断开了，我们应该把数据写入到response中，并用flush方法输出。
@RequestMapping(value = "/pushImprove")
@ResponseBody
public String getStreamDataImprove(HttpServletResponse httpServletResponse) {
httpServletResponse.setContentType("text/event-stream");
httpServletResponse.setCharacterEncoding("utf-8");
String s= "retry:10000
";
s += "data:Testing 1,2,3------- "+new Date() +"
";
while (true) {
try {
PrintWriter pw=httpServletResponse.getWriter();
Thread.sleep(100L);
pw.write(s);
pw.flush();
} catch (IOException | InterruptedException e) {
e.printStackTrace();
}
}
} |
实验结果
图3：连接只打开了一次
图4：请求也只出现了一次
这样就实现了客户端只发送一次请求，服务器不断地单向推送消息，保持长连接。 问题二:如何跳出循环 我们写了
让它保持连接，不停地推送数据，但是浏览器关闭了却没有抛出异常，这里很奇怪为什么连接关闭了还能执行flush方法？这样的话浏览器关闭了，服务器却仍在执行while循环，这种情况显然是不允许的。
问题解决：
查阅了PrintWriter源码后发现，在flush方法中已经对异常做了处理，所以调用时不会抛出异常，我们要检测异常可以调用它的checkError()函数。
public void flush() {
try {
synchronized (lock) {
ensureOpen();
out.flush();
}
}
catch (IOException x) {
trouble = true;
}
} |
我们关闭浏览器后，服务器下一次要推送时就会抛出异常，这个异常已经在PrintWriter的flush()中被捕捉了，我们只需它的调用checkError()，有错误的话return即可停止执行。
if(pw.checkError()){
log.println("客户端断开连接");
return;
} |
实验结果：
图5：关闭浏览器连接断开
可以看到浏览器关闭了以后，服务器也跳出了这个循环
如果客户端想在不关闭页面的情况下主动关闭连接，只需要设置一个按钮，点击以后调用EventSource.colse()即可关闭连接，服务端推送数据时因为连接已经关闭，就会抛出异常，跳出循环。 问题三：兼容性 SSE并没有在微软的IE和Edge浏览器上实现，可以使用第三方javaScript库实现，在页面引入evensource.js就可以实现。
evensource.js下载地址:
https://github.com/EventSource/eventsource
SSE完整源码
----------------------------
原文链接:https://www.jianshu.com/p/b1f00785799c
程序猿的技术大观园：www.javathinker.net
|
|
Java技术网站 → 『 Java开发技术 』 → 『 Spring框架和各种开源软件技术专题 』 → SSE(Server Sent Events) HTTP服务端推送详解 - hadoop_a9bb
消息
查看
搜索
好友
复制
引用
IP: 已设置保密
