springMVC和HTML SEE完成消息推送
Posted 晓未苏
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了springMVC和HTML SEE完成消息推送相关的知识，希望对你有一定的参考价值。
HTML5 服务器发送事件(Server-Sent Events)
服务器发送事件（Server-sent Events）是基于 WebSocket 协议的一种服务器向客户端发送事件和数据的单向通讯。
html5 服务器发送事件（server-sent event）允许网页获得来自服务器的更新。
这种技术封装在 SSE EventSource API里，打开链接可以阅读。SSE EventSource API 被W3C制定为HTML5的一部分。
后台代码：
@Controller
@RequestMapping("/test")
public class TestController {
@RequestMapping(value="push",produces="text/event-stream")
public @ResponseBody String push(){
JSONObject json = new JSONObject();
json.put("username", "sse");
json.put("age", "18");
//注意：返回数据的格式要严格按照这样写，前面"data:" 和 后面'\\n\\n'不可少
return "data:info: "+json+"\\n\\n";
}
}
前端代码：
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>SSE方式消息推送</title>
</head>
<body>
<div>SSE方式消息推送</div>
<div id="message"></div>
<script type="text/javascript">
//判断浏览器是否兼容
if(!!window.EventSource){
var source = new EventSource('test/push');
//两种调用方式
source.addEventListener('message',function(e){
document.getElementById("message").innerHTML = e.data;
console.log("get message:"+e.data);
});
/* source.onmessage=function(e){
document.getElementById("message").innerHTML = e.data;
console.log("get message:"+e.data);
} */
source.addEventListener('open',function(e){
console.log("connect is open");
},false);
/* source.onopen=function(e){
console.log("connect is open");
} */
source.addEventListener('error',function(e){
if(e.readyState == EventSource.CLOSE){
console.log("connect is close");
}else{
console.log(e.readyState);
}
},false);
/* source.οnerrοr=function(e){
if(e.readyState == EventSource.CLOSE){
console.log("connect is close");
}else{
console.log(e.readyState);
}
} */
}else{
console.log("web is not support");
}
</script>
</body>
</html>
服务启动效果：
服务关闭效果
后台服务关闭SSE也会一直向后台请求数据。后台启动后SSE会自动连接获取数据
以下分析是抄自博主:哥哦狗子
短轮询
短轮询的基本思路就是浏览器每隔一段时间向浏览器发送 http 请求，服务器端在收到请求后， 不论是否有数据更新，都直接进行 响应。这种方式实现的即时通信，本质上还是浏览器发送请求，服务器接受请求的一个过程，通 过让客户端不断的进行请求，使得客 户端能够模拟实时地收到服务器端的数据的变化。
优点
这种方式的优点是比较简单，易于理解。
缺点
这种方式由于需要不断的建立 ht tp 连接，严重浪费了服务器端和客户端的资源。当用户增加时，服务器端的压力就会变大，这 是很不合理的。
长轮询
长轮询的基本思路是，首先由客户端向服务器发起请求，当服务器收到客户端发来的请求后，服 务器端不会直接进行响应，而是先将 这个请求挂起，然后判断服务器端数据是否有更新。如果有更新，则进行响应，如果一直没有数 据，则到达一定的时间限制才返回。 客户端 JavaScript 响应处理函数会在处理完服务器返回的信息后，再次发出请求，重新建立 连接。
长轮询和短轮询比起来，
优点
它的 优点是明显减少了很多不必要的 http 请求次数，相比之下节约了资源。
缺点
长轮询的缺点在于， 连接挂起也会导致资源的浪费。
SSE
SSE 的基本思想是，服务器使用流信息向服务器推送信息。严格地说，http 协议无法做到服务 器主动推送信息。但是，有一种变通方法，就是服务器向客户端声明，接下来要发送的是流信息。也就是说，发送的不是一次性的数 据包，而是一个数据流，会连续不断 地发送过来。这时，客户端不会关闭连接，会一直等着服务器发过来的新的数据流，视频播放就 是这样的例子。SSE 就是利用这种机 制，使用流信息向浏览器推送信息。它基于 http 协议，目前除了 IE/Edge，其他浏览器都支 持。
优点
它相对于前面两种方式来说，不 需要建立过多的 http 请求，相比之下节约了资源。
上面三种方式本质上都是基于 http 协议的，我们还可以使用 WebSocket 协议来实现。
WebSocket
WebSocket 是 Html5 定义的一个新协 议，与传统的 http 协议不同，该协议允许由服务器主动的向客户端推送信息。使用 WebSocket 协议的缺点是在服务器端的配置 比较复杂。WebSocket 是一个全双工的协议，也就是通信双方是平等的，可以相互发送消息， 而 SSE 的方式是单向通信的，只能 由服务器端向客户端推送信息，如果客户端需要发送信息就是属于下一个 http 请求了。
以上是关于springMVC和HTML SEE完成消息推送的主要内容，如果未能解决你的问题，请参考以下文章
iOSCGContextSaveGState: invalid context 0x0. If you want to see the backtrace, please set CG_CONTE(代
未解决：dpkg-source: error: aborting due to unexpected upstream changes, see /tmp/-1.diff.rm5mTN(代