通常情況下,無論是瀏覽器還是移動端缴挖,與服務器之間的交互都是主動的袋狞,即客戶端向服務器端發(fā)發(fā)出請求后,服務器端將數(shù)據(jù)返回給客戶端醇疼,他們之間的對應模式為:客戶端請求--服務端響應硕并。
但若想要服務器端主動將信息推送給客戶端,例如實時金融證卷信息秧荆、訂閱新聞倔毙,天氣提醒、監(jiān)控系統(tǒng)等乙濒,都需要服務器主動推送消息給客戶端陕赃。
目前解決該問題的技術:
一、反向Ajax技術
反向Ajax技術即通過實用技術模擬服務器端和客戶端之間的響應通信來繞過Ajax只能從客戶端向服務器端發(fā)出請求的限制颁股。其說白了還是傳統(tǒng)的請求模式么库,這是在后臺做的,前臺看不出來甘有。
Http輪詢:
即定時的通過Ajax查詢服務器端诉儒,客戶端定時向服務器端發(fā)送ajax請求,服務器端接收到請求后馬上響應信息并關閉連接亏掀。要求兩次請求間隔時間必須盡可能的小忱反,但若時間間隔減小泛释,客戶端瀏覽器在相同時間內(nèi)就會發(fā)出更多的請求,這些請求中大部分都不會返回有用的數(shù)據(jù)温算,這會白白地浪費掉帶寬和處理資源怜校。
JSONP輪詢:
JSONP輪詢和HTTP輪詢類似,不同之處在于使用JSONP可以發(fā)送跨域請求(請求不屬于您所在的域)注竿,JSONP請求通城炎拢可以通過它的調(diào)用參數(shù)和返回內(nèi)容識別出來,其是可執(zhí)行的JavaScript代碼巩割。要想在 JavaScript 中實現(xiàn)輪詢裙顽,可以使用setInterval來定期地發(fā)出 Ajax 請求。
這種技術實現(xiàn)起來非常簡單喂分,但它不具有伸縮性锦庸,需要不斷地向服務器端發(fā)送消息,會對服務器造成極大的性能浪費蒲祈,加重網(wǎng)絡負載甘萧,拖累服務器。
Piggyback polling(捎帶輪詢):
捎帶輪詢是一種比輪詢更聰明的做法梆掸,它會刪除所有非必需的請求(沒有返回數(shù)據(jù)的那些)扬卷,且不存在時間間隔,客戶端在需要的時候向服務器端發(fā)送請求酸钦。不同之處在于響應的部分怪得,響應被分成兩個部分:對請求數(shù)據(jù)的響應和對服務器時間的響應。捎帶輪詢通常針對服務器端的所有 Ajax 請求可能會返回一個混合的響應卑硫。
這種方法因為客戶端控制了何時發(fā)送請求徒恋,所以沒有不返回數(shù)據(jù)的請求,對資源的消耗較少欢伏,可用在所有瀏覽器上入挣。但這仍然算是客戶端主動去請求服務器端,當服務器累積了事件想要傳送端戶端時硝拧,在客戶端沒有發(fā)送請求時也不能主動發(fā)送給客戶端径筏。
二、Comet
Comet基于HTTP長連接的“服務器推”技術障陶,是一個Web應用模型滋恬,能夠?qū)⒎掌鲗崟r地將更新信息傳送到客戶端,目前有兩種實現(xiàn)方式抱究,長輪詢和iframe流恢氯。
實現(xiàn)原理是客戶端發(fā)送請求到服務端,服務器端會阻塞請求直到有數(shù)據(jù)傳遞或超時才返回,之后客戶端 JavaScript 響應處理函數(shù)會在處理完服務器返回的信息后酿雪,再次發(fā)出請求遏暴,重新建立連接。當客戶端處理接收的數(shù)據(jù)指黎、重新建立連接時,服務器端可能有新的數(shù)據(jù)到達州丹;這些信息會被服務器端保存直到客戶端重新建立連接醋安,客戶端會一次把當前服務器端所有的信息取回。即還是要客戶端先貢獻它的“第一次”墓毒,只要客戶端先請求服務器端一次吓揪,以后兩端就熟了,服務器端想主動約客戶端就約所计。
Comet 的一大優(yōu)點是柠辞,每個客戶端始終都有一個向服務器端打開的通信鏈路。服務器端可以通過在事件到來時立即提交(完成)響應來把事件推給客戶端主胧,或者它甚至可以累積再連續(xù)發(fā)送叭首。因為請求長時間保持打開的狀態(tài),故服務器端需要特別的功能來處理所有的這些長生存期請求踪栋。
HTTP長輪詢:
長輪詢(long polling)模式涉及了打開連接的技術焙格,連接由服務器端保持著打開的狀態(tài),只要已有事件發(fā)生夷都,響應就會被提交眷唉,然后關閉連接。而后一個新的長輪詢連接就會被正在等待新事件的客戶端重新打開囤官。實現(xiàn)可以使用 script 標簽或是單純的XMLHttpRequest對象來實現(xiàn) HTTP 長輪詢冬阳。
iframe流:
iframe流方式是在頁面中插入一個隱藏的iframe,利用其src屬性在服務器和客戶端之間創(chuàng)建一條長鏈接党饮,服務器向iframe傳輸數(shù)據(jù)(通常是HTML肝陪,內(nèi)有負責插入信息的javascript),來實時更新頁面劫谅。從技術上來講见坑,兩種常見的流技術包括 Forever Iframe(或者 hidden IFrame),或是被用來在 JavaScript 中創(chuàng)建 Ajax 請求的XMLHttpRequest對象的多部分 (multi-part) 特性捏检。
iframe流方式的優(yōu)點是瀏覽器兼容好荞驴,但沒有方法來實現(xiàn)可靠的錯誤處理或跟蹤連接的 狀態(tài),且有些在緩沖方面有問題贯城。
三熊楼、WebSocket
WebSocket是一種在單個TCP連接上進行全雙工通訊的協(xié)議,它允許服務器端主動向客戶端推送數(shù)據(jù),在WebSocket API中鲫骗,瀏覽器和服務器只需要完成一次握手犬耻,兩者之間就直接可以創(chuàng)建持久性的連接,并進行雙向數(shù)據(jù)傳輸执泰。
而比較新的技術去做輪詢的效果是Comet枕磁。這種技術雖然可以雙向通信,但依然需要反復發(fā)出請求术吝。而且在Comet中计济,普遍采用的長連接,也會消耗服務器資源排苍。在這種情況下沦寂,HTML5定義了WebSocket協(xié)議,能更好的節(jié)省服務器資源和帶寬淘衙,并且能夠更實時地進行通訊传藏。WebSocket 協(xié)議在2008年誕生,2011年成為國際標準彤守。所有瀏覽器都已經(jīng)支持了毯侦。它的最大特點就是,服務器可以主動向客戶端推送信息遗增,客戶端也可以主動向服務器發(fā)送信息叫惊,是真正的雙向平等對話,屬于服務器推送技術的一種做修。
其他特點包括:
(1)建立在 TCP 協(xié)議之上霍狰,服務器端的實現(xiàn)比較容易。
(2)與 HTTP 協(xié)議有著良好的兼容性饰及。默認端口也是80和443蔗坯,并且握手階段采用 HTTP 協(xié)議,因此握手時不容易屏蔽燎含,能通過各種 HTTP 代理服務器宾濒。
(3)數(shù)據(jù)格式比較輕量,性能開銷小屏箍,通信高效绘梦。
(4)可以發(fā)送文本,也可以發(fā)送二進制數(shù)據(jù)赴魁。
(5)沒有同源限制卸奉,客戶端可以與任意服務器通信。
(6)協(xié)議標識符是ws(如果加密颖御,則為wss)榄棵,服務器網(wǎng)址就是 URL。
如:ws://example.com:80/some/path
參考資料:
Ajax和Comet:https://www.ibm.com/developerworks/cn/web/wa-reverseajax1/index.html
https://www.ibm.com/developerworks/cn/web/wa-lo-comet/
WebSocket:http://www.ruanyifeng.com/blog/2017/05/websocket.html
https://www.cnblogs.com/study-everyday/p/6140498.html