Java后端Tomcat實現(xiàn)WebSocket實例教程

更新時間：2016年05月09日 10:18:45 作者：孤傲蒼狼

WebSocket protocol 是HTML5一種新的協(xié)議。它實現(xiàn)了瀏覽器與服務器全雙工通信(full-duplex)。一開始的握手需要借助HTTP請求完成握手。本文給大家介紹Java后端Tomcat實現(xiàn)WebSocket實例教程，感興趣的朋友一起學習吧

一.WebSocket簡單介紹

WebSocket protocol 是HTML5一種新的協(xié)議。它實現(xiàn)了瀏覽器與服務器全雙工通信(full-duplex)。一開始的握手需要借助HTTP請求完成握手。

　　隨著互聯(lián)網(wǎng)的發(fā)展，傳統(tǒng)的HTTP協(xié)議已經(jīng)很難滿足Web應用日益復雜的需求了。近年來，隨著HTML5的誕生，WebSocket協(xié)議被提出，它實現(xiàn)了瀏覽器與服務器的全雙工通信，擴展了瀏覽器與服務端的通信功能，使服務端也能主動向客戶端發(fā)送數(shù)據(jù)。

WebSocket背景

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

在JavaEE7中也實現(xiàn)了WebSocket協(xié)議。

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

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

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

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

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

　　JavaEE 7中出了JSR-356:Java API for WebSocket規(guī)范。不少Web容器，如Tomcat,Nginx,Jetty等都支持WebSocket。Tomcat從7.0.27開始支持 WebSocket，從7.0.47開始支持JSR-356，下面的Demo代碼也是需要部署在Tomcat7.0.47以上的版本才能運行。

二.WebSocket示例

2.1.新建JavaWeb測試項目

　　在pom.xml中添加Jar包依賴

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

　　客戶端（Web主頁）代碼：

<%@ page language="java" pageEncoding="UTF-" %>
<!DOCTYPE html>
<html>
<head>
<title>Java后端WebSocket的Tomcat實現(xiàn)</title>
</head>
<body>
Welcome<br/><input id="text" type="text"/>
<button onclick="send()">發(fā)送消息</button>
<hr/>
<button onclick="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:/websocket");
}
else {
alert('當前瀏覽器 Not support websocket')
}
//連接發(fā)生錯誤的回調(diào)方法
websocket.onerror = function () {
setMessageInnerHTML("WebSocket連接發(fā)生錯誤");
};
//連接成功建立的回調(diào)方法
websocket.onopen = function () {
setMessageInnerHTML("WebSocket連接成功");
}
//接收到消息的回調(diào)方法
websocket.onmessage = function (event) {
setMessageInnerHTML(event.data);
}
//連接關閉的回調(diào)方法
websocket.onclose = function () {
setMessageInnerHTML("WebSocket連接關閉");
}
//監(jiān)聽窗口關閉事件，當窗口關閉時，主動去關閉websocket連接，防止連接還沒斷開就關閉窗口，server端會拋異常。
window.onbeforeunload = function () {
closeWebSocket();
}
//將消息顯示在網(wǎng)頁上
function setMessageInnerHTML(innerHTML) {
document.getElementById('message').innerHTML += innerHTML + '<br/>';
}
//關閉WebSocket連接
function closeWebSocket() {
websocket.close();
}
//發(fā)送消息
function send() {
var message = document.getElementById('text').value;
websocket.send(message);
}
</script>
</html>

　　Java Web后端代碼

package me.gacl.websocket;
import java.io.IOException;
import java.util.concurrent.CopyOnWriteArraySet;
import javax.websocket.*;
import javax.websocket.server.ServerEndpoint;
/**
* @ServerEndpoint 注解是一個類層次的注解，它的功能主要是將目前的類定義成一個websocket服務器端,
* 注解的值將被用于監(jiān)聽用戶連接的終端訪問URL地址,客戶端可以通過這個URL來連接到WebSocket服務器端
*/
@ServerEndpoint("/websocket")
public class WebSocketTest {
//靜態(tài)變量，用來記錄當前在線連接數(shù)。應該把它設計成線程安全的。
private static int onlineCount = ;
//concurrent包的線程安全Set，用來存放每個客戶端對應的MyWebSocket對象。若要實現(xiàn)服務端與單一客戶端通信的話，可以使用Map來存放，其中Key可以為用戶標識
private static CopyOnWriteArraySet<WebSocketTest> webSocketSet = new CopyOnWriteArraySet<WebSocketTest>();
//與某個客戶端的連接會話，需要通過它來給客戶端發(fā)送數(shù)據(jù)
private Session session;
/**
* 連接建立成功調(diào)用的方法
* @param session 可選的參數(shù)。session為與某個客戶端的連接會話，需要通過它來給客戶端發(fā)送數(shù)據(jù)
*/
@OnOpen
public void onOpen(Session session){
this.session = session;
webSocketSet.add(this); //加入set中
addOnlineCount(); //在線數(shù)加
System.out.println("有新連接加入！當前在線人數(shù)為" + getOnlineCount());
}
/**
* 連接關閉調(diào)用的方法
*/
@OnClose
public void onClose(){
webSocketSet.remove(this); //從set中刪除
subOnlineCount(); //在線數(shù)減
System.out.println("有一連接關閉！當前在線人數(shù)為" + getOnlineCount());
}
/**
* 收到客戶端消息后調(diào)用的方法
* @param message 客戶端發(fā)送過來的消息
* @param session 可選的參數(shù)
*/
@OnMessage
public void onMessage(String message, Session session) {
System.out.println("來自客戶端的消息:" + message);
//群發(fā)消息
for(WebSocketTest item: webSocketSet){
try {
item.sendMessage(message);
} catch (IOException e) {
e.printStackTrace();
continue;
}
}
}
/**
* 發(fā)生錯誤時調(diào)用
* @param session
* @param error
*/
@OnError
public void onError(Session session, Throwable error){
System.out.println("發(fā)生錯誤");
error.printStackTrace();
}
/**
* 這個方法與上面幾個方法不一樣。沒有用注解，是根據(jù)自己需要添加的方法。
* @param message
* @throws IOException
*/
public void sendMessage(String message) throws IOException{
this.session.getBasicRemote().sendText(message);
//this.session.getAsyncRemote().sendText(message);
}
public static synchronized int getOnlineCount() {
return onlineCount;
}
public static synchronized void addOnlineCount() {
WebSocketTest.onlineCount++;
}
public static synchronized void subOnlineCount() {
WebSocketTest.onlineCount--;
}
}

1.2.運行效果

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