websocket
基于websocket小demo的理解
先講解一下什么叫網(wǎng)絡(luò)編程?
- 網(wǎng)絡(luò)編程其實(shí)是對于信息的一個(gè)發(fā)送和接收
- 發(fā)送端:將信息按照一定的協(xié)議組裝成一個(gè)數(shù)據(jù)包
- 接受端:把收到的數(shù)據(jù)包進(jìn)行解析渠概,提取出其中的信息
- Socket:兩個(gè)在網(wǎng)絡(luò)上的程序通過一個(gè)雙向的通信連接初厚,實(shí)現(xiàn)數(shù)據(jù)的交換况芒,這個(gè)鏈接的每個(gè)端口都可以稱為一個(gè)Socket
- Socket的本質(zhì):Socket是一個(gè)編程接口(API)负乡,TCP/IP協(xié)議需要向開發(fā)者提供做網(wǎng)絡(luò)開發(fā)用的接口描孟,這就是Socket接口,它是對TCP/IP協(xié)議網(wǎng)絡(luò)通信的封裝晨炕。
下面是我自己寫的一個(gè)對于websocket的一個(gè)demo
第一步:導(dǎo)入對應(yīng)需要的jar包
<dependency>
<groupId>javax</groupId>
<artifactId>javaee-api</artifactId>
<version>7.0</version>
<scope>provided</scope>
</dependency>
第二步:html頁面的代碼
<!DOCTYPE html>
<%@ page language="java" contentType="text/html; charset=utf-8" pageEncoding="utf-8"%>
<html>
<head>
<title>Java后端WebSocket的Tomcat實(shí)現(xiàn)</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 onclick="send()">發(fā)送消息</button>
<hr/>
<button onclick="closeWebSocket()">關(guān)閉WebSocket連接</button>
<hr/>
<div id="message"></div>
</body>
<script type="text/javascript">
var websocket = null;
//判斷當(dāng)前瀏覽器是否支持WebSocket
if ('WebSocket' in window) {
websocket = new WebSocket("ws://localhost:8080/websocket/websocket");
}else {
alert('當(dāng)前瀏覽器 Not support websocket')
}
//連接發(fā)生錯(cuò)誤的回調(diào)方法
websocket.onerror = function () {
setMessageInnerHTML("WebSocket連接發(fā)生錯(cuò)誤");
};
//連接成功建立的回調(diào)方法
websocket.onopen = function () {
setMessageInnerHTML("WebSocket連接成功");
}
//接收到消息的回調(diào)方法
websocket.onmessage = function (event) {
setMessageInnerHTML(event.data);
}
//連接關(guān)閉的回調(diào)方法
websocket.onclose = function () {
setMessageInnerHTML("WebSocket連接關(guān)閉");
}
//監(jiān)聽窗口關(guān)閉事件,當(dāng)窗口關(guān)閉時(shí)毫炉,主動(dòng)去關(guān)閉websocket連接瓮栗,防止連接還沒斷開就關(guān)閉窗口,server端會(huì)拋異常。
window.onbeforeunload = function () {
closeWebSocket();
}
//將消息顯示在網(wǎng)頁上
function setMessageInnerHTML(innerHTML) {
document.getElementById('message').innerHTML += innerHTML + '<br/>';
}
//關(guān)閉WebSocket連接
function closeWebSocket() {
websocket.close();
}
//發(fā)送消息
function send() {
var message = document.getElementById('text').value;
websocket.send(message);
}
</script>
</html>
第三步:后臺(tái)接口
package demo;
import java.io.IOException;
import java.util.concurrent.CopyOnWriteArraySet;
import javax.websocket.*;
import javax.websocket.server.ServerEndpoint;
/**
* @ServerEndpoint 注解是一個(gè)類層次的注解费奸,它的功能主要是將目前的類定義成一個(gè)websocket服務(wù)器端,
* 注解的值將被用于監(jiān)聽用戶連接的終端訪問URL地址,客戶端可以通過這個(gè)URL來連接到WebSocket服務(wù)器端
*/
@ServerEndpoint("/websocket")
public class WebSocketTest {
//靜態(tài)變量弥激,用來記錄當(dāng)前在線連接數(shù)。應(yīng)該把它設(shè)計(jì)成線程安全的愿阐。
private static int onlineCount = 0;
//concurrent包的線程安全Set微服,用來存放每個(gè)客戶端對應(yīng)的MyWebSocket對象。若要實(shí)現(xiàn)服務(wù)端與單一客戶端通信的話缨历,可以使用Map來存放以蕴,其中Key可以為用戶標(biāo)識
private static CopyOnWriteArraySet<WebSocketTest> webSocketSet = new CopyOnWriteArraySet<WebSocketTest>();
//與某個(gè)客戶端的連接會(huì)話,需要通過它來給客戶端發(fā)送數(shù)據(jù)
private Session session;
/**
* 連接建立成功調(diào)用的方法
* @param session 可選的參數(shù)辛孵。session為與某個(gè)客戶端的連接會(huì)話丛肮,需要通過它來給客戶端發(fā)送數(shù)據(jù)
*/
@OnOpen
public void onOpen(Session session){
this.session = session;
webSocketSet.add(this); //加入set中
addOnlineCount(); //在線數(shù)加1
System.out.println("有新連接加入!當(dāng)前在線人數(shù)為" + getOnlineCount());
}
/**
* 連接關(guān)閉調(diào)用的方法
*/
@OnClose
public void onClose(){
webSocketSet.remove(this); //從set中刪除
subOnlineCount(); //在線數(shù)減1
System.out.println("有一連接關(guān)閉魄缚!當(dāng)前在線人數(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ā)生錯(cuò)誤時(shí)調(diào)用
* @param session
* @param error
*/
@OnError
public void onError(Session session, Throwable error){
System.out.println("發(fā)生錯(cuò)誤");
error.printStackTrace();
}
/**
* 這個(gè)方法與上面幾個(gè)方法不一樣宝与。沒有用注解,是根據(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--;
}
}
項(xiàng)目結(jié)構(gòu)圖如下
websocket.png
啟動(dòng)項(xiàng)目在不同瀏覽器中打開項(xiàng)目就可以實(shí)現(xiàn)簡單的socket的通訊了