一、背景介紹

? ? 傳統web請求，是顯式的向服務器發送http Request,拿到Response后顯示在瀏覽器頁面上。這種被動的交互方式不能滿足對信息實時性要求高的應用,譬如聊天室、股票交易行情、在線游戲等。Ajax輪詢雖然可以解決這個問題，但是會帶來增加服務器負擔、帶寬浪費，并且這種實現方式不夠優雅。而Comet技術就是為此而生的。

? ? 本文只探討基于瀏覽器的web端服務器推技術。服務器推技術在現實應用中有一些解決方案，主要分兩類：一類是需要瀏覽器額外安裝插件，基于套接口傳送信息或者是基于RMI、CORBA進行遠程調用，另一類則無需瀏覽器安裝任何插件，就是本文著重講的HTTP長連接技術：Coment。Alex Russell（Dojo Toolkit 的項目 Lead）稱這種基于 HTTP 長連接、無須在瀏覽器端安裝插件的“服務器推”技術為“Comet”。

? ? 寫本文的目的：網上的資料比較零碎，博客園的文章基本都是代碼+代碼，或者直接翻譯別人的成果，而對于原理性的東西講的很少。本文就是給有興趣或者即將開發服務器推技術的程序員一個技術概覽，摸清行內來龍去脈。我比較忌諱對一種新技術，上來就Focus到某個具體的技術上而不能自拔，盲人摸象。我們在定系統框架，敲定技術解決方案之前應該比較各個實現方案技術的優缺點，這樣才能做出好的系統來。

二、Comet實現模型

1.HTTP Long Polling：基于 AJAX 的長輪詢方式
? ? 眾所周知，AJAX可以異步調用XMLHttpRequest對象發送HttpRequest，Javascript響應處理函數根據服務端返回的信息對HTML頁面顯示進行更新。而使用AJAX實現服務器推與傳統AJAX應用的不同之處在于：

? ? a.服務器端會阻塞請求直到有數據返回或者超時；

? ? b.客戶端JS響應函數在處理完服務端返回的信息后會再次發出請求，重新建立連接；

? ? 如圖1所示，因為這種方案基于 AJAX，具有以下一些優點：請求異步發出；無須安裝插件；IE、Mozilla FireFox 都支持 AJAX。

圖1:基于 AJAX 的長輪詢方式

2.HTTP Streaming：基于 Iframe 及 htmlfile 的流方式
? ? 通過在 HTML 頁面里嵌入一個隱蔵幀，然后將這個隱蔵幀的 SRC 屬性設為對一個長連接的請求，服務器端就能源源不斷地往客戶端輸入數據。如圖2所示。

圖2. 基于流方式的服務器推模型

兩種方案對比：

? ? a.在對返回的數據處理方面：方案2（IFrame）返回的是對客戶端javascript調用，，如“<script type="text/javascript">js_func(“data from server ”)</script>”。服務器端將返回的數據作為客戶端 JavaScript 函數的參數傳遞；客戶端瀏覽器的 Javascript 引擎在收到服務器返回的 JavaScript 調用時就會去執行代碼。而方案1（AJAX）返回的是數據，通過JS可以很方便的操作DOM。

? ? b.使用IFrame還有一個明顯不足：IE、Morzilla Firefox 下端的進度欄都會顯示加載沒有完成，而且 IE 上方的圖標會不停的轉動，表示加載正在進行。不過這個問題已經被Google技術人員解決，并應用到Gtalk中，解決方案是：ActiveX 控件解決 iframe 請求長連接時 IE 的加載顯示問題，原文地址：“What else is burried down in the depth’s of Google’s amazing JavaScript?”。

三、實際開發時應該注意的問題

? ? 對于一個實際的應用而言，系統的穩定性和性能是非常重要的。將 HTTP 長連接用于實際應用，很多細節需要考慮。

1.不要在同一客戶端同時使用超過兩個的 HTTP 長連接

?這個是由于HTTP 1.1 規范中規定：客戶端不應該與服務器端建立超過兩個的 HTTP 連接，新的連接會被阻塞。所以，在設計上考慮讓多個 frame（AJAX）共用一個長連接。

2.服務器端的性能和可擴展性
? ? 一般的WEB服務器是為每個連接創建一個線程，所以在使用Comet時，服務器要維護大量并發，長期存在的長連接。在這種背景下，就需要服務器負載均衡和集群技術，或者在服務端做一些優化。這篇文章：http://rdc.taobao.com/blog/cs/?p=1062的測試表明：200萬個Http長連接占用率19G服務器內存，一個大約9kb；所以,你可以算一下你的服務器最多可以維護多少個長連接。

3.控制信息與數據信息使用不同的 HTTP 連接

? ? ?用長連接時，存在一個很常見的場景：客戶端網頁需要關閉，而服務器端還處在讀取數據的堵塞狀態，客戶端需要及時通知服務器端關閉數據連接。服務器在收到關閉請求后首先要從讀取數據的阻塞狀態喚醒，然后釋放為這個客戶端分配的資源，再關閉連接。

?

? ? ?所以在設計上，我們需要使客戶端的控制請求和數據請求使用不同的 HTTP 連接，才能使控制請求不會被阻塞。

? ? ?在實現上，如果是基于 iframe 流方式的長連接，客戶端頁面需要使用兩個 iframe，一個是控制幀，用于往服務器端發送控制請求，控制請求能很快收到響應，不會被堵塞；一個是顯示幀，用于往服務器端發送長連接請求。如果是基于 AJAX 的長輪詢方式，客戶端可以異步地發出一個 XMLHttpRequest 請求，通知服務器端關閉數據連接。

4.在客戶和服務器之間保持“心跳”信息

? ? ?客戶端不知道何時服務器才有數據傳送。服務器端需要確保當客戶端不在狀態（工作）時，釋放為這個客戶端分配的資源，防止內存泄漏。因此需要一種機制使雙方知道大家都在正常運行。

四、Comet框架介紹
? ? 由于Comet早在2006.2月就提出來了，所以并不是什么新鮮玩意，框架還是很多的，譬如：Dojox.cometd,?Pushlet，SingalR。

? ? Dojox.cometd：Comet概念的的提出者Alex Russel主導的Dojo項目分支，Dojo 基金會提出了 Bayeux 協議用來標準化 Comet 應用中客戶端和服務器端之間的通信。Dojox.cometd 實現了 Bayeux 協議的客戶端部分，使用 HTTP 長輪詢來作為數據的傳輸通道。

? ? Pushlet：基于HTTP流，而不是AJAX長輪詢。一個開源的 Comet 框架,Pushlet 使用了觀察者模型：客戶端發送請求，訂閱感興趣的事件；服務器端為每個客戶端分配一個會話 ID 作為標記，事件源會把新產生的事件以多播的方式發送到訂閱者的事件隊列里。貌似只支持Java。

? ? SingalR：基于AJAX長輪詢。ASP.NET團隊開發的一個開源的.net framework庫和Jquery插件。集成的客戶端與服務器庫，基于瀏覽器的客戶端和基于 ASP.NET 的服務器組件可以借助它來進行雙向多步對話。

五、SingalR的MVC4實踐

?1.安裝與運行環境:(Nuget) install-package Microsoft.AspNet.SignalR ,注意：PM>后面不要有空格。

或者到GitHub上下載源碼：https://github.com/SignalR/SignalR

這里順便提一下，SingalR服務端需要支持的OS：

• Windows Server 2012
• Windows Server 2008 r2.
• Windows 8
• Windows 7
• Windows Azure

????? .net framework4，4.5。WebSocket必須是4.5.

????? IIS7,7.5 ,integrated Mode,而不是classic Mode, WebSockets必須IIS8。更加詳盡的說明，請自行參考：http://www.asp.net/signalr/overview/getting-started/supported-platforms

2.核心實現：

首先，我們需要引用SignalR,用Nuget不需要自己手工添加，應為你的asp.net mvc項目自動添加好一切。

服務端Library:

Microsoft.AspNet.SignalR.Core
Microsoft.AspNet.SignalR.Owin
Microsoft.AspNet.SignalR.SystemWeb
Owin
Newtonsoft.Json

using System; using System.Collections.Generic; using System.Linq; using System.Web; using Microsoft.AspNet.SignalR;namespace DeepleoComet {public class ChatHub : Hub{public void Send(string name, string message){// Call the addNewMessageToPage method to update clients.Clients.All.addNewMessageToPage(name, message);}} }

?

客戶端的Jquery插件：

jquery.signalR-1.1.3.min.js.

?

@{ViewBag.Title = "Chat"; }<h2>Chat</h2><div class="container"><input type="text" id="message" /><input type="button" id="sendmessage" value="Send" /><input type="hidden" id="displayname" /><ul id="discussion"></ul> </div>@section scripts {<script src="~/Scripts/jquery.signalR-1.1.3.js"></script><script src="~/signalr/hubs"></script><script>$(function () {var chat = $.connection.chatHub;chat.client.addNewMessageToPage = function (name, message) {$('#discussion').append('<li><strong>' + htmlEncode(name)+ '</strong>: ' + htmlEncode(message) + '</li>');};$('#displayname').val(prompt('Enter your name:', ''));$('#message').focus();$.connection.hub.start().done(function () {$('#sendmessage').click(function () {chat.server.send($('#displayname').val(), $('#message').val());$('#message').val('').focus();});});});function htmlEncode(value) {var encodedValue = $('<div />').text(value).html();return encodedValue;}</script> }

?實現效果：

開兩個頁面：http://localhost:11968/ ，分別鍵入name,就可以實現一個簡單的聊天室功能了。

?

六、題外話：Comet的替代品：Html5的WebSocket

? ? ? 在瀏覽器中通過http僅能實現單向的通信,comet可以一定程度上模擬雙向通信,但效率較低,并需要服務器有較好的支持; flash中的socket和xmlsocket可以實現真正的雙向通信,通過 flex ajax bridge,可以在javascript中使用這兩項功能. 可以預見,如果websocket一旦在瀏覽器中得到實現,將會替代上面兩項技術,得到廣泛的使用.面對這種狀況，HTML5定義了WebSocket協議，能更好的節省服務器資源和帶寬并達到實時通訊。?

? ? ? 真是相見恨晚啊，才知道還有這么個東西，居然Web端也有了全雙工的Socket，貌似有個socket.io還支持IE6,我和我的小伙伴們都驚呆了。

? ? ? ?比較好的關于WebSocket文章：http://www.cnblogs.com/wei2yi/archive/2011/03/23/1992830.html

參考資料

1.原理：http://www.ibm.com/developerworks/cn/web/wa-lo-comet/

2.DOJO原理與實踐：http://www.ibm.com/developerworks/cn/web/wa-lo-w2fpak-comet/

3.淘寶200W長鏈接測試與優化：http://rdc.taobao.com/blog/cs/?p=1062

4.長連接百科：http://baike.baidu.com/view/2831907.htm

5.博客園Comet專題:http://kb.cnblogs.com/page/112185/

6.?Jetty+Dojo+Tomcat：http://blog.csdn.net/garfier/article/details/5942826

7.SingalR官網：http://signalr.net/

8.Singal輔導：http://www.asp.net/signalr

轉載于:https://www.cnblogs.com/deepleo/p/Comet.html

總結

以上是生活随笔為你收集整理的Comet：基于 HTTP 长连接的“服务器推”技术解析的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。