原創:
銳洋智能 博客文 鏈接: 點擊打開鏈接
一.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中的實現。
JavaEE 7中出了JSR-356:Java API for WebSocket規範。不少Web容器,如Tomcat,Nginx,Jetty等都支持WebSocket。Tomcat從7.0.27開始支持 WebSocket,從7.0.47開始支持JSR-356,下面的Demo代碼也是需要部署在Tomcat7.0.47以上的版本才能運行。
二.WebSocket示例
2.1.Tomcat實現websocket方法
新建JavaWeb測試項目
在pom.xml中添加Jar包依賴
<dependency>
<groupId>javax</groupId>
<artifactId>javaee-api</artifactId>
<version>7.0</version>
<scope>provided</scope>
</dependency>
2.2.spring整合websocket方法
spring整合,此方式基於spring mvc框架
WebSocketConfig.java
這個類是配置類,所以需要在spring mvc配置文件中加入對這個類的掃描,第一個addHandler是對正常連接的配置,第二個是如果瀏覽器不支持websocket,使用socketjs模擬websocket的連接。
package com.websocket;
import org.springframework.context.annotation.Bean;
import org.springframework.context.annotation.Configuration;
import org.springframework.web.socket.config.annotation.EnableWebSocket;
import org.springframework.web.socket.config.annotation.WebSocketConfigurer;
import org.springframework.web.socket.config.annotation.WebSocketHandlerRegistry;
import org.springframework.web.socket.handler.TextWebSocketHandler;
@Configuration
@EnableWebSocket
public class WebSocketConfig implements WebSocketConfigurer {
@Override
public void registerWebSocketHandlers(WebSocketHandlerRegistry registry) {
registry.addHandler(chatMessageHandler(),"/webSocketServer").addInterceptors(new ChatHandshakeInterceptor());
registry.addHandler(chatMessageHandler(), "/sockjs/webSocketServer").addInterceptors(new ChatHandshakeInterceptor()).withSockJS();
}
@Bean
public TextWebSocketHandler chatMessageHandler(){
return new ChatMessageHandler();
}
}
ChatHandshakeInterceptor.java
這個類的作用就是在連接成功前和成功後增加一些額外的功能,Constants.java類是一個工具類,兩個常量。
package com.websocket;
import java.util.Map;
import org.apache.shiro.SecurityUtils;
import org.springframework.http.server.ServerHttpRequest;
import org.springframework.http.server.ServerHttpResponse;
import org.springframework.web.socket.WebSocketHandler;
import org.springframework.web.socket.server.support.HttpSessionHandshakeInterceptor;
public class ChatHandshakeInterceptor extends HttpSessionHandshakeInterceptor {
@Override
public boolean beforeHandshake(ServerHttpRequest request, ServerHttpResponse response, WebSocketHandler wsHandler,
Map<String, Object> attributes) throws Exception {
System.out.println("Before Handshake");
/*
* if (request instanceof ServletServerHttpRequest) {
* ServletServerHttpRequest servletRequest = (ServletServerHttpRequest)
* request; HttpSession session =
* servletRequest.getServletRequest().getSession(false); if (session !=
* null) { //使用userName區分WebSocketHandler,以便定向發送消息 String userName =
* (String) session.getAttribute(Constants.SESSION_USERNAME); if
* (userName==null) { userName="default-system"; }
* attributes.put(Constants.WEBSOCKET_USERNAME,userName);
*
* } }
*/
//使用userName區分WebSocketHandler,以便定向發送消息(使用shiro獲取session,或是使用上面的方式)
String userName = (String) SecurityUtils.getSubject().getSession().getAttribute(Constants.SESSION_USERNAME);
if (userName == null) {
userName = "default-system";
}
attributes.put(Constants.WEBSOCKET_USERNAME, userName);
return super.beforeHandshake(request, response, wsHandler, attributes);
}
@Override
public void afterHandshake(ServerHttpRequest request, ServerHttpResponse response, WebSocketHandler wsHandler,
Exception ex) {
System.out.println("After Handshake");
super.afterHandshake(request, response, wsHandler, ex);
}
}
ChatMessageHandler.java
這個類是對消息的一些處理,比如是發給一個人,還是發給所有人,並且前端連接時觸發的一些動作
package com.websocket;
import java.io.IOException;
import java.util.ArrayList;
import org.apache.log4j.Logger;
import org.springframework.web.socket.CloseStatus;
import org.springframework.web.socket.TextMessage;
import org.springframework.web.socket.WebSocketSession;
import org.springframework.web.socket.handler.TextWebSocketHandler;
public class ChatMessageHandler extends TextWebSocketHandler {
private static final ArrayList<WebSocketSession> users;// 這個會出現性能問題,最好用Map來存儲,key用userid
private static Logger logger = Logger.getLogger(ChatMessageHandler.class);
static {
users = new ArrayList<WebSocketSession>();
}
/**
* 連接成功時候,會觸發UI上onopen方法
*/
@Override
public void afterConnectionEstablished(WebSocketSession session) throws Exception {
System.out.println("connect to the websocket success......");
users.add(session);
// 這塊會實現自己業務,比如,當用戶登錄後,會把離線消息推送給用戶
// TextMessage returnMessage = new TextMessage("你將收到的離線");
// session.sendMessage(returnMessage);
}
/**
* 在UI在用js調用websocket.send()時候,會調用該方法
*/
@Override
protected void handleTextMessage(WebSocketSession session, TextMessage message) throws Exception {
sendMessageToUsers(message);
//super.handleTextMessage(session, message);
}
/**
* 給某個用戶發送消息
*
* @param userName
* @param message
*/
public void sendMessageToUser(String userName, TextMessage message) {
for (WebSocketSession user : users) {
if (user.getAttributes().get(Constants.WEBSOCKET_USERNAME).equals(userName)) {
try {
if (user.isOpen()) {
user.sendMessage(message);
}
} catch (IOException e) {
e.printStackTrace();
}
break;
}
}
}
/**
* 給所有在線用戶發送消息
*
* @param message
*/
public void sendMessageToUsers(TextMessage message) {
for (WebSocketSession user : users) {
try {
if (user.isOpen()) {
user.sendMessage(message);
}
} catch (IOException e) {
e.printStackTrace();
}
}
}
@Override
public void handleTransportError(WebSocketSession session, Throwable exception) throws Exception {
if (session.isOpen()) {
session.close();
}
logger.debug("websocket connection closed......");
users.remove(session);
}
@Override
public void afterConnectionClosed(WebSocketSession session, CloseStatus closeStatus) throws Exception {
logger.debug("websocket connection closed......");
users.remove(session);
}
@Override
public boolean supportsPartialMessages() {
return false;
}
}
spring-mvc.xml
正常的配置文件,同時需要增加對WebSocketConfig.java類的掃描,並且增加
xmlns:websocket="http://www.springframework.org/schema/websocket"
http://www.springframework.org/schema/websocket
<a target="_blank" href="http://www.springframework.org/schema/websocket/spring-websocket-4.1.xsd">http://www.springframework.org/schema/websocket/spring-websocket-4.1.xsd</a>
客戶端
<script type="text/javascript"
src="http://localhost:8080/Bank/js/sockjs-0.3.min.js"></script>
<script>
var websocket;
if ('WebSocket' in window) {
websocket = new WebSocket("ws://" + document.location.host + "/Bank/webSocketServer");
} else if ('MozWebSocket' in window) {
websocket = new MozWebSocket("ws://" + document.location.host + "/Bank/webSocketServer");
} else {
websocket = new SockJS("http://" + document.location.host + "/Bank/sockjs/webSocketServer");
}
websocket.onopen = function(evnt) {};
websocket.onmessage = function(evnt) {
$("#test").html("(<font color='red'>" + evnt.data + "</font>)")
};
websocket.onerror = function(evnt) {};
websocket.onclose = function(evnt) {}
$('#btn').on('click', function() {
if (websocket.readyState == websocket.OPEN) {
var msg = $('#id').val();
//調用後臺handleTextMessage方法
websocket.send(msg);
} else {
alert("連接失敗!");
}
});
</script>
注意導入socketjs時要使用地址全稱,並且連接使用的是http而不是websocket的ws
聲明: 整理本文僅供參考,若有疑問可以同時參考原文。