Netty学习之实战WebSocket框架

Netty学习之实战WebSocket框架说到WebSocket技术，其实源于服务器推送技术，在现实中很多时候需要的数据是不断变化的，⽐如股市数据、聊天软件，因此就需要⼀种客户端想要在不刷新页⾯的情况下实时获取到服务器端最新数据的技术，⽽以往的数据获取都是基于客户端主动请求，服务端返回对应数据。因此就有了服务器推送技术。服务器推送技术主要由以下⼏种：Ajax短轮询、Ajax长轮询、SSE、HTTP流、WebSocket。⼀、服务器推送技术1、Ajax短轮询实现简单，客户端（浏览器）定时向服务器端发送请求，获取最新的数据。可以通过在⼀个定时器中触发ajax请求来实现。优点：实现⾮常简单，JS端进⾏⼀些更改即可，⽆需后端服务任何改动；缺点：轮询的间隔过长，会导致⽤户不能及时接收到更新的数据；轮询的间隔过短，会导致查询请求过多，增加服务器端的负担。代码如下：//每两秒触发⼀次ajax请求，获取最新的数据setInterval(function(){//dosomeajaxcallheretoretrievelatestdata},2000);2、Ajax长轮询在Ajax轮询的基础上做的⼀点改进，在后端数据没有更新的时候不再返回空响应，⽽且后端⼀直保存连接，直到后端有数据变化，则相应请求并且关闭连接，前端收到数据，马上再次向后端发起请求，并处理刚刚收到的数据。客户端发起⼀个请求到服务器端(httprequest)服务器端⼀直保持连接打开，直到有数据数据可发送给客户端，再返回这个请求(httpresponse)客户端收到服务器端返回的数据后，处理数据，并⽴马发起⼀个新的请求优点：可以及时获取到最新的数据相较于轮询策略，减少了请求数量缺点：服务器端要⼀直保持连接，不能释放，由于⼀个服务器能够处理的连接数有限，当达到服务器处理的上限的时候，服务器将⽆法响应新的请求代码如下：functionasync(){$.ajax({url:'',success:function(){async();//successcode}});}Servlet3⾥的异步任务以及Spring带来的DeferedResult都是使⽤Ajax的长连接。3、HTTP流HTTP流区别于轮询和长轮询⽅法，它在客户端⽹页的⽣命周期内，只需要使⽤⼀个HTTP连接，也就是只会向服务器发送⼀个请求，对于这个请求，服务器会保持HTTP连接（不返回response），然后周期性的向浏览器发送数据。//server端⽰例(nodejs)letexpress=require("express");letapp=express();app.use(express.static("resources"));app.get("/httpstream",function(req,res){varx=0;res.setHeader('Connection','Transfer-Encoding');res.setHeader('Content-Type','text/html;charset=utf-8');res.setHeader('Transfer-Encoding','chunked');//声明数据传输编码为chunked，让浏览器及时处理setInterval(function(){res.write(x+++"|");//每隔2s向客户端发送⼀次数据},2000);});app.listen(3000);服务器端接收到请求后，每隔两秒向客户端输出⼀点⽂字，但是不会使⽤res.end()或者res.send()结束当前http请求。//客户端⽰例jsvarxhr=newXMLHttpRequest();varreceived=0;varresult="";xhr.open("get","/httpstream",true);xhr.onreadystatechange=function(){if(xhr.readyState==3){//readystate3表⽰正在解析数据result=xhr.responseText.substring(received);//截取最新的数据received+=result.length;console.log(result);}}xhr.send();随着不断从服务器端接收到数据，客户端的readyState会周期性的变成3，responseText包含所有的数据源。通过received来记录之前已经处理过的数据长度，然后在responseText中截取最新的数据。优点：页⾯的整个⽣命周期内，只需要建⽴⼀个http连接。缺点：如果接⼊的客户端过多，服务器端会因为http连接有限⽽⽆法为新的客户端提供服务。客户端接收到的数据流会越来越⼤，最终可能会引发页⾯的性能问题4、SSE(Server-Sent-Events)SSE(Server-SentEvents)是基于HTTP实现的⼀套服务器向客户端发送数据的API。他是针对上⾯说到的三种⽅法（轮询，长轮询，HTTP流）的⼀个标准API实现。使⽤SSEAPI可以创建到服务器端的单向连接，服务器可以通过这个连接发送任意数据。它有以下特点：断开⾃动连接服务器响应的MIME类型必须是text/event-stream需要浏览器API⽀持(参考)使⽤⽅法如下：//客户端jsvarsource=newEventSource(url);//建⽴连接时触发source.onopen=function(){//dosomethinghere};//从服务器端接收到新的事件时触发source.onmessage=function(event){vardata=event/服/务器返回.data;的数据存放在event.data中};//连接异常时触发source.onerror=function(){//dosomethinghere};客户端创建⼀个EventSource对象，绑定到对应的url，然后监听该对象的onmessage事件就可以获取到最新的数据。//server端⽰例(nodejs)letexpress=require("express");letapp=express();app.use(express.static("resources"));app.get("/httpstream",function(req,res){varx=0;res.writeHead(200,{"Content-Type":"text/event-stream","Cache-Control":"no-cache","Connection":"keep-alive"});//每个1s往客户端发送⼀条数据setInterval(function(){res.write("data:"+x+++"\n\/发/送的数据格式必须是"data内:容></n");/n"},1000);});app.listen(3000);5、WebSocket5.1、什么是WebSocket？WebSocket是html5出来的协议，http是不⽀持久链接的，WebSocket其实是⼀个新协议，实现了与客户端与服务器双向，基于消息的⽂本或⼆进制数据通信；适合于对数据的实时性要求⽐较强的场景，如即时通信、直播、共享桌⾯；后端需要单独实现；客户端并不是所有浏览器都⽀持。通信协议两部分?5.2、WebSocket⼀是开放性HTTP握⼿连接协商连接参数，在交换数据之前，客户端必须与服务器协商适当的参数以建⽴连接⼆是⼆进制消息分帧机制（接收消息的⽂本和⼆进制数据传输）。WebSocket协议提供了很多强⼤的特性：基于消息的通信、⾃定义的⼆进制分帧层、⼦协议协商、可选的协议扩展，等等。5.3、什么是HTTP协议升级？即先通过HTTP实现握⼿，然后进⾏协议升级，后续使⽤WebSocket协议进⾏通讯。WebSocket和http协议有⼀定的交集，前端跟服务端建⽴websocket连接需要先发送⼀个htt请求，并再请求数据⾥表明协议需要升级为websocket。应⽤层通过sec-websocket-k和seyc-websocket-accept标识⼀个唯⼀的websocket通道。如下所⽰：最后，前述握⼿完成后，如果握⼿成功，该连接就可以⽤作双向通信信道交换WebSocket消息。到此，客户端与服务器之间不会再发⽣HTTP通信，⼀切由WebSocket协议接管。5.4、如何协议升级WebSocket是通过WebSocketServerHandshaker处理服务端的websocket协议升级。handshaker.handshake的本质是在当前pipeline添加websocket协议的编解码器，并移除http协议编解码器。5.5、Websocket消息实体-WebSocketFrameWebSocket⽀持多种消息实体，可以⽤在不同场景，例如⽂本、流式⼆进制数据、⼼跳检测等。如下图所⽰，不同的消息实体实现类实现不同的消息功能。