websocket協議全雙工協議


一.WebSocket簡單介紹

  隨着互聯網的發展,傳統的HTTP協議已經很難滿足Web應用日益復雜的需求了。近年來,隨着HTML5的誕生,WebSocket協議被提出,它實現了瀏覽器與服務器的全雙工通信,擴展了瀏覽器與服務端的通信功能,使服務端也能主動向客戶端發送數據。

  我們知道,傳統的HTTP協議是無狀態的,每次請求(request)都要由客戶端(如 瀏覽器)主動發起,服務端進行處理后返回response結果,而服務端很難主動向客戶端發送數據;這種客戶端是主動方,服務端是被動方的傳統Web模式 對於信息變化不頻繁的Web應用來說造成的麻煩較小,而對於涉及實時信息的Web應用卻帶來了很大的不便,如帶有即時通信、實時數據、訂閱推送等功能的應 用。在WebSocket規范提出之前,開發人員若要實現這些實時性較強的功能,經常會使用折衷的解決方法:輪詢(polling)和Comet技術。其實后者本質上也是一種輪詢,只不過有所改進。

  輪詢是最原始的實現實時Web應用的解決方案。輪詢技術要求客戶端以設定的時間間隔周期性地向服務端發送請求,頻繁地查詢是否有新的數據改動。明顯地,這種方法會導致過多不必要的請求,浪費流量和服務器資源。

  Comet技術又可以分為長輪詢和流技術。長輪詢改進了上述的輪詢技術,減小了無用的請求。它會為某些數據設定過期時間,當數據過期后才會向服務端發送請求;這種機制適合數據的改動不是特別頻繁的情況。流技術通常是指客戶端使用一個隱藏的窗口與服務端建立一個HTTP長連接,服務端會不斷更新連接狀態以保持HTTP長連接存活;這樣的話,服務端就可以通過這條長連接主動將數據發送給客戶端;流技術在大並發環境下,可能會考驗到服務端的性能。

  這兩種技術都是基於請求-應答模式,都不算是真正意義上的實時技術;它們的每一次請求、應答,都浪費了一定流量在相同的頭部信息上,並且開發復雜度也較大。

  伴隨着HTML5推出的WebSocket,真正實現了Web的實時通信,使B/S模式具備了C/S模式的實時通信能力。WebSocket的工作流程是這 樣的:瀏覽器通過JavaScript向服務端發出建立WebSocket連接的請求,在WebSocket連接建立成功后,客戶端和服務端就可以通過 TCP連接傳輸數據。因為WebSocket連接本質上是TCP連接,不需要每次傳輸都帶上重復的頭部數據,所以它的數據傳輸量比輪詢和Comet技術小 了很多。本文不詳細地介紹WebSocket規范,主要介紹下WebSocket在Java Web中的實現。

 

二.WebSocket示例

2.1.新建JavaWeb測試項目

 

 

 在pom.xml中添加Jar包依賴

 <dependency>
         <groupId>javax</groupId>
         <artifactId>javaee-api</artifactId>
        <version>7.0</version>
         <scope>provided</scope>
 </dependency>

客戶端(Web主頁)代碼:

  <!DOCTYPE html>
  <html>
  <head>
      <title>Java后端WebSocket的Tomcat實現</title>
<meta content='width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no' name='viewport' />
      <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  </head>
  <body>
      Welcome<br/><input id="text" type="text"/>
      <button οnclick="send()">發送消息</button>
     <hr/>
     <button οnclick="closeWebSocket()">關閉WebSocket連接</button>
     <hr/>
     <div id="message"></div>
 </body>
 
 <script type="text/javascript">
     var websocket = null;
     //判斷當前瀏覽器是否支持WebSocket
     if ('WebSocket' in window) {
        websocket = new WebSocket("ws://localhost:8080/websocket");
     }
     else {
         alert('當前瀏覽器 Not support websocket')
     }
 
     //連接發生錯誤的回調方法
     websocket.onerror = function () {
         setMessageInnerHTML("WebSocket連接發生錯誤");
     };
 
     //連接成功建立的回調方法
     websocket.onopen = function () {
         setMessageInnerHTML("WebSocket連接成功");
     }
 
     //接收到消息的回調方法
     websocket.onmessage = function (event) {
         setMessageInnerHTML(event.data);
     }
 
     //連接關閉的回調方法
     websocket.onclose = function () {
         setMessageInnerHTML("WebSocket連接關閉");
     }
 
     //監聽窗口關閉事件,當窗口關閉時,主動去關閉websocket連接,防止連接還沒斷開就關閉窗口,server端會拋異常。
     window.onbeforeunload = function () {
         closeWebSocket();
     }
 
     //將消息顯示在網頁上
     function setMessageInnerHTML(innerHTML) {
         document.getElementById('message').innerHTML += innerHTML + '<br/>';
     }
 
     //關閉WebSocket連接
     function closeWebSocket() {
         websocket.close();
     }
 
     //發送消息
     function send() {
         var message = document.getElementById('text').value;
         websocket.send(message);
     }
 </script>
 </html>

Java Web后端代碼:

 1 package me.gacl.websocket;
 2 
 3 import java.io.IOException;
 4 import java.util.concurrent.CopyOnWriteArraySet;
 5 
 6 import javax.websocket.*;
 7 import javax.websocket.server.ServerEndpoint;
 8 
 9 /**
10  * @ServerEndpoint 注解是一個類層次的注解,它的功能主要是將目前的類定義成一個websocket服務器端,
11  * 注解的值將被用於監聽用戶連接的終端訪問URL地址,客戶端可以通過這個URL來連接到WebSocket服務器端
12  */
13 @ServerEndpoint("/websocket")
14 public class WebSocketTest {
15     //靜態變量,用來記錄當前在線連接數。應該把它設計成線程安全的。
16     private static int onlineCount = 0;
17 
18     //concurrent包的線程安全Set,用來存放每個客戶端對應的MyWebSocket對象。若要實現服務端與單一客戶端通信的話,可以使用Map來存放,其中Key可以為用戶標識
19     private static CopyOnWriteArraySet<WebSocketTest> webSocketSet = new CopyOnWriteArraySet<WebSocketTest>();
20 
21     //與某個客戶端的連接會話,需要通過它來給客戶端發送數據
22     private Session session;
23 
24     /**
25      * 連接建立成功調用的方法
26      * @param session  可選的參數。session為與某個客戶端的連接會話,需要通過它來給客戶端發送數據
27      */
28     @OnOpen
29     public void onOpen(Session session){
30         this.session = session;
31         webSocketSet.add(this);     //加入set中
32         addOnlineCount();           //在線數加1
33         System.out.println("有新連接加入!當前在線人數為" + getOnlineCount());
34     }
35 
36     /**
37      * 連接關閉調用的方法
38      */
39     @OnClose
40     public void onClose(){
41         webSocketSet.remove(this);  //從set中刪除
42         subOnlineCount();           //在線數減1
43         System.out.println("有一連接關閉!當前在線人數為" + getOnlineCount());
44     }
45 
46     /**
47      * 收到客戶端消息后調用的方法
48      * @param message 客戶端發送過來的消息
49      * @param session 可選的參數
50      */
51     @OnMessage
52     public void onMessage(String message, Session session) {
53         System.out.println("來自客戶端的消息:" + message);
54         //群發消息
55         for(WebSocketTest item: webSocketSet){
56             try {
57                 item.sendMessage(message);
58             } catch (IOException e) {
59                 e.printStackTrace();
60                 continue;
61             }
62         }
63     }
64 
65     /**
66      * 發生錯誤時調用
67      * @param session
68      * @param error
69      */
70     @OnError
71     public void onError(Session session, Throwable error){
72         System.out.println("發生錯誤");
73         error.printStackTrace();
74     }
75 
76     /**
77      * 這個方法與上面幾個方法不一樣。沒有用注解,是根據自己需要添加的方法。
78      * @param message
79      * @throws IOException
80      */
81     public void sendMessage(String message) throws IOException{
82         this.session.getBasicRemote().sendText(message);
83         //this.session.getAsyncRemote().sendText(message);
84     }
85 
86     public static synchronized int getOnlineCount() {
87         return onlineCount;
88     }
89 
90     public static synchronized void addOnlineCount() {
91         WebSocketTest.onlineCount++;
92     }
93 
94     public static synchronized void subOnlineCount() {
95         WebSocketTest.onlineCount--;
96     }
97 }

1.2.運行效果

  同時打開Google瀏覽器和火狐瀏覽器進行多客戶端模擬測試,運行效果如下:

  

  該Demo在Jdk1.7+Tomcat7.0.65下環境測試過,下載demo地址  ,提取碼:rrnt​​​​​​​

 

轉自:https://blog.csdn.net/qq_38775392/article/details/88086105


免責聲明!

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



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