webSocket、Ajax轮询、长轮询(long poll)

ajax轮询

ajax轮询的原理很简单，让浏览器间隔几秒就发送一次请求，询问服务器是否有新信息。

一个简单的实例：

function showUnreadNews()  {      $(document).ready(function() {          $.ajax({              type: "POST",              url: "unread_list.php",              dataType: "json",              success: function(data) {                  alert(data);              }          });      });  }  setInterval('showUnreadNews()',5000);//轮询执行，5000ms一次  

long poll（长轮询）

原理跟 ajax轮询 差不多，都是采用轮询的方式，不过采取的是阻塞模型，也就是说，客户端发起连接后，如果没消息，就一直不返回Response给客户端，直到有消息才返回或超时。返回完之后，客户端再次建立连接，周而复始，基于事件的触发，一个事件接一个事件。

一个简单的实例：

function showUnreadNews()  {      $.ajax({          type: "POST",          url: "unread_list.php",          dataType: "json",          success: function(data) {                     //处理返回数据            alert(data);            //再次请求            showUnreadNews();        },        complete:function(XMLHttpRequest,textStatus)        {              if(textStatus=='timeout'){//判断是否超时                showUnreadNews();//超时，重新请求            }          }    });   }

缺点：Ajax轮询需要服务器有很快的处理速度与快速响应。long poll需要很高的并发，体现在同时容纳请求的能力。

WebSocket

WebSocket是HTML5开始提供的一种在单个 TCP 连接上进行全双工通讯的协议。浏览器和服务器只需要做一个握手的动作，然后，浏览器和服务器之间就形成了一条快速通道。两者之间就直接可以数据互相传送。
浏览器通过 JavaScript 向服务器发出建立 WebSocket 连接的请求，连接建立以后，客户端和服务器端就可以通过 TCP 连接直接交换数据。

一个简单的实例：

var ws;function WebSocketTest(){   if ("WebSocket" in window)   {      alert("您的浏览器支持 WebSocket!");      // 打开一个 web socket      ws = new WebSocket("ws://localhost:9998/echo");      ws.onopen = function()      {         // Web Socket 已连接上，使用 send() 方法发送数据         ws.send("发送数据");         alert("数据发送中...");      };      ws.onmessage = function (evt)       {          var received_msg = evt.data;         alert("数据已接收..." + received_msg);      };      ws.onerror = function (evt) {          //出错          alert(JSON.stringify(evt));       }      ws.onclose = function()      {          // 关闭 websocket         alert("连接已关闭...");       };   }   else   {      // 浏览器不支持 WebSocket      alert("您的浏览器不支持 WebSocket!");   }}ws.close();//关闭连接