實現Web端即時通訊的方法:輪詢(短輪詢)、長輪詢(comet)、長連接(SSE)、WebSocket


Web端即時通訊技術

即時通訊技術簡單的說就是實現這樣一種功能:服務器端可以即時地將數據的更新或變化反應到客戶端,例如消息即時推送等功能都是通過這種技術實現的。但是在Web中,由於瀏覽器的限制,實現即時通訊需要借助一些方法。這種限制出現的主要原因是,一般的Web通信都是瀏覽器先發送請求到服務器,服務器再進行響應完成數據的現實更新。

實現Web端即時通訊的方法

輪詢(短輪詢)、長輪詢(comet)、長連接(SSE)、WebSocket。

分類

它們大體可以分為兩類,一種是在HTTP基礎上實現的,包括短輪詢、comet和SSE;

另一種不是在HTTP基礎上實現是,即WebSocket。

一、輪詢(短輪詢)

  短輪詢的基本思路就是瀏覽器每隔一段時間向服務器發送http請求,服務器端在收到請求后,不論是否有數據更新,都直接進行響應。在服務端響應完成,就會關閉這個Tcp連接,這種方式實現的即時通信,本質上還是瀏覽器發送請求,服務器接受請求的一個過程,通過讓客戶端不斷的進行請求,使得客戶端能夠模擬實時地收到服務器端的數據的變化。

  這種方式的優點是比較簡單,易於理解,實現起來也沒有什么技術難點,它的兼容性也比較好的只要支持http協議就可以用這種方式實現。缺點是顯而易見的,這種方式由於需要不斷的建立http連接,嚴重浪費了服務器端和客戶端的資源。(因為建立Tcp連接是非常消耗資源的,服務端響應完成就會關閉這個Tcp連接,下一次請求再次建立Tcp連接。)尤其是在客戶端,距離來說,如果有數量級想對比較大的人同時位於基於短輪詢的應用中,那么每一個用戶的客戶端都會瘋狂的向服務器端發送http請求,而且不會間斷。人數越多,服務器端壓力越大,這是很不合理的。

  因此短輪詢不適用於那些同時在線用戶數量比較大,並且很注重性能的Web應用。

  並且瀏覽器定時向服務器發送請求,獲取最新數據,由於定時發送請求,兩次請求之間的數據更新並不能及時響應,可能會有實時數據更新不及時的情況。

JS 實現

// 請求數據方法
const request = () => {} // 每隔5秒發送一次請求
setInterval(request(), 5000)

二、長輪詢(comet)

  當服務器收到客戶端發來的請求后,服務器端不會直接進行響應,而是先將這個請求掛起,然后判斷服務器端數據是否有更新。如果有更新,則進行響應,如果一直沒有數據,則到達一定的時間限制(服務器端設置)才返回。 。 客戶端JavaScript響應處理函數會在處理完服務器返回的信息后,再次發出請求,重新建立連接。

  長輪詢和短輪詢比起來,明顯減少了很多不必要的http請求次數,相比之下節約了資源。長輪詢的缺點在於,連接掛起也會導致資源的浪費。

  客戶端發送請求后服務器端不會立即返回數據,服務器端會阻塞請求連接不會立即斷開,直到服務器端有數據更新或者是連接超時才返回,客戶端才再次發出請求新建連接、如此反復從而獲取最新數據。大致效果如下:

js實現

// 請求數據方法
const request = () => {} // 當數據請求返回結果后發起下一次請求
request().then(res => { request(); })

輪詢與長輪詢都是基於HTTP的,兩者本身存在着缺陷:輪詢需要更快的處理速度;長輪詢則更要求處理並發的能力;兩者都是“被動型服務器”的體現:服務器不會主動推送信息,而是在客戶端發送ajax請求后進行返回的響應。而理想的模型是"在服務器端數據有了變化后,可以主動推送給客戶端",這種"主動型"服務器是解決這類問題的很好的方案。Web Sockets就是這樣的方案。

短輪詢和長輪詢的區別  

長、短輪詢是指客戶端請求服務端時,服務端給予應答的方式。

短輪詢

  • 短輪詢是服務器收到請求不管是否有數據都直接響應請求

  • 受到響應隔一段時間在發送同樣的請求查詢是否有數據;

缺點:

  • 實時性低

長輪詢

  • 長輪詢是服務器收到請求后如果有數據, 立刻響應請求;

  • 如果沒有數據就會 hold 一段時間,這段時間內如果有數據立刻響應請求;

  • 如果時間到了還沒有數據, 則響應 http 請求;瀏覽器受到 http 響應后立在發送一個同樣http 請求查詢是否有數據;

缺點:

  • 瀏覽器端對統一服務器同時連接有最大限制, 最好同一用戶只存在一個長輪詢;

  • 服務器端沒有數據 hold 住連接時會造成浪費, 容易產生服務器瓶頸;

三、長連接(SSE)

  SSE是HTML5新增的功能,全稱為Server-Sent Events。它可以允許服務推送數據到客戶端。SSE在本質上就與之前的長輪詢、短輪詢不同,雖然都是基於http協議的,但是輪詢需要客戶端先發送請求。而SSE最大的特點就是不需要客戶端發送請求,可以實現只要服務器端數據有更新,就可以馬上發送到客戶端。

  SSE的優勢很明顯,它不需要建立或保持大量的客戶端發往服務器端的請求,節約了很多資源,提升應用性能。並且后面會介紹道,SSE的實現非常簡單,並且不需要依賴其他插件。

四、WebSocket

  WebSocket是Html5定義的一個新協議,與傳統的http協議不同,該協議可以實現服務器與客戶端之間全雙工通信。簡單來說,首先需要在客戶端和服務器端建立起一個連接,這部分需要http。連接一旦建立,客戶端和服務器端就處於平等的地位,可以相互發送數據,不存在請求和響應的區別。

  WebSocket的優點是實現了雙向通信,缺點是服務器端的邏輯非常復雜。現在針對不同的后台語言有不同的插件可以使用。

四種Web即時通信技術比較

  從兼容性角度考慮,短輪詢>長輪詢>長連接SSE>WebSocket;

  從性能方面考慮,WebSocket>長連接SSE>長輪詢>短輪詢。


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM