H5的办事器推送事件详解-
办事器推送事件（Server-sent Events）是基于WebSocket 协定的一种办事器向客户端发送事件&数据的单向通信。当前所有主流阅读器均支撑办事器发送事件，固然除了 Internet Explorer 。2333...
WebSocket 协定是继HTTP协定后又一办事器客户端通信协定，不一样于HTTP纯正的客户端要求办事器相应单向通信模式的是它支撑了办事端客户端的双向通信。
Server-sent Events 的运用
Server-sent Events（下列简称SSE）作为办事器=>客户端通信方式那必定客户端要有响应的办事地址和相应办法，办事端要有响应的数据发送办法；废话未几说，上代码！
客户端JS代码
H5页面需增加如下JS代码：
《script》
if (typeof (EventSource) !== "undefined") {
//推送办事接口地址
var eventSource = new EventSource("http://localhost:2242/webservice/ServerSent/SentNews");
//当通往办事器的连贯被打开
eventSource.onopen = function () {
console.log("连贯打开...");
}
//当差错产生
eventSource.onerror= function (e) {
console.log(e);
};
//当接收到新闻，此事件为默许事件
eventSource.onmessage = function (event) {
console.log("onmessage...");
eventSource.close()//关闭SSE链接
};
//办事器推送sentMessage事件
eventSource.addEventListener('sentMessage', function (event) {
var data = eval('('+event.data+')');//办事器端推送的数据，eval装换Json对象
var origin = event.origin;//办事器 URL 的域名局部，即协定、域名和端口，表示新闻的来源。
var lastEventId = event.lastEventId;////数据的编号，由办事器端发送。要是没有编号，这个属性为空。
//此处依据需求编写业务逻辑
console.log(data); }, false);
} else {
//阅读器不支撑server-sent events 所有主流阅读器均支撑办事器发送事件，除了 Internet Explorer。
document.getElementById("result").innerHTML = "Sorry, your browser does not support server-sent events...";
}
《script》办事端
办事端应该返回如何的数据格局？应该以什么样的相应给客户端呢？先来个.Net 的样例
////// 推送新闻 /// ///[HttpGet] public HttpResponseMessage SentNews() { HttpResponseMessage response = Request.CreateResponse(HttpStatusCode.OK); try { //response.Headers.Add("Access-Control-Allow-Origin", "*");//如需要跨域可配置 string data_str = “推送至客户端的数据”;//固然可以是json字符串格局 string even = "", data = ""; if (!string.IsNullOrWhiteSpace(data_str)) { even = "event:sentMessage\n"; data = "data:" + data_str + "\n\n"; } string retry = "retry:" + 1000 + "\n";//连贯断开后重连工夫（毫秒），其实可以了解为轮询工夫 2333... byte[] array = Encoding.UTF8.GetBytes(even + data + retry); Stream stream_result = new MemoryStream(array); response.Content = new StreamContent(stream_result); response.Content.Headers.ContentType = new MediaTypeHeaderValue("text/event-stream");//此处一定要配置 response.Headers.CacheControl = new CacheControlHeaderValue(); response.Headers.CacheControl.NoCache = false; } catch (Exception ex) { LogHelper.WriteWebLog(ex); } return response; }
看完以上代码我想你应当有个大约了，相应的方式还是HTTPResponse相应，但总是有点小小的请求的：
相应报头"Content-Type" 要设定为 "text/event-stream"
相应的数据格局也应当注意到了上述代码中的"data:"、"event:"和"retry:"这些标志：
1.event：表示该行用来声明事件的类型。阅读器在收到数据时，会发生对应类型的事件。
2.data：表示该行包括的是数据。以 data 开头的行可以涌现屡次。所有这些行都是该事件的数据。
3.retry：表示该行用来声明阅读器在连贯断开之后进行再次连贯以前的期待工夫。
4.id：表示该行用来声明事件的标识符（即数据的编号），不常用。
信赖看了本案牍例你已经把握了办法，更多出色请关注 百分百源码网 其它相干文章！
举荐浏览：
H5中的video标签没法播放mp4文件怎样解决
H5的多线程（Worker SharedWorker）运用详解
运用phonegap克隆和删除联络人
以上就是H5的办事器推送事件详解的细致内容，更多请关注 百分百源码网 其它相干文章！
