溫馨提示×
您好，登錄后才能下訂單哦！
點(diǎn)擊 登錄注冊(cè) 即表示同意《億速云用戶服務(wù)條款》
您好，登錄后才能下訂單哦！
這篇“Java應(yīng)用層協(xié)議WebSocket如何實(shí)現(xiàn)消息推送”文章的知識(shí)點(diǎn)大部分人都不太理解，所以小編給大家總結(jié)了以下內(nèi)容，內(nèi)容詳細(xì)，步驟清晰，具有一定的借鑒價(jià)值，希望大家閱讀完這篇文章能有所收獲，下面我們一起來看看這篇“Java應(yīng)用層協(xié)議WebSocket如何實(shí)現(xiàn)消息推送”文章吧。
大部分的web開發(fā)者，開發(fā)的業(yè)務(wù)都是基于Http協(xié)議的：前端請(qǐng)求后端接口，攜帶參數(shù)，后端執(zhí)行業(yè)務(wù)代碼，再返回結(jié)果給前端。作者參與開發(fā)的項(xiàng)目，有一個(gè)報(bào)警推送的功能，服務(wù)端實(shí)時(shí)推送報(bào)警信息給瀏覽器端；還有像抖音里面，如果有人關(guān)注、回復(fù)你的評(píng)論時(shí)，抖音就會(huì)推送相關(guān)消息給你了，你就會(huì)收到一條消息。
有些同學(xué)會(huì)說了，基于Http協(xié)議也能實(shí)現(xiàn)?。呵岸硕〞r(shí)訪問后端（每隔3s或者幾秒），后端返回消息數(shù)據(jù)，前端拿到后彈出消息。這種方式太low了，而且每個(gè)瀏覽器都這樣，使用系統(tǒng)的人一多，服務(wù)器的壓力就太大了些。那到底用什么技術(shù)手段實(shí)現(xiàn)呢？我們的主角就登場(chǎng)了。
WebSocket是在單個(gè)TCP連接上進(jìn)行全雙工通信的應(yīng)用層協(xié)議(Http協(xié)議也是應(yīng)用層)，瀏覽器端和服務(wù)端都可主動(dòng)發(fā)送數(shù)據(jù)給另一端。這樣是不是比Http協(xié)議更適合消息推送這種場(chǎng)景。
建一個(gè)SpringBoot項(xiàng)目，Html放在src\main\resources\static下：
<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org">
<head>
<!-- 解決中文亂碼-->
<meta charset="UTF-8"/>
<title></title>
<script type="text/javascript" src="./js/jquery.min.js"></script>
</head>
<body>
<input id="input1" type="text" /><br/>
<input type="button" value="瀏覽器發(fā)送服務(wù)端" onclick="btnClick()" />
<input type="button" value="服務(wù)端發(fā)送瀏覽器" onclick="btnClick1()" />
<input type="button" value="重新打開連接" onclick="btnClick2()" />
<br/>
<textarea id="textArea" ></textarea>
<script>
var ws;
webSocketInit();
function webSocketInit() {
ws =new WebSocket('ws://localhost:8080/bootdemo/webSocket/10086');
// 獲取連接狀態(tài)
console.log('ws連接狀態(tài)[初始]：' + ws.readyState);
//監(jiān)聽是否連接成功
ws.onopen = function () {
console.log('ws連接狀態(tài)[成功]：' + ws.readyState);
};
// 接聽服務(wù)器發(fā)回的信息并處理展示
ws.onmessage = function (obj) {
console.log('接收到來自服務(wù)器的消息：');
var txt = $("#textArea").val();
$("#textArea").val(txt + "\n" + obj.data);
$("#textArea").scrollTop($("#textArea")[0].scrollHeight);
//完成通信后關(guān)閉WebSocket連接
// ws.close();
};
// 監(jiān)聽連接關(guān)閉事件
ws.onclose = function () {
// 監(jiān)聽整個(gè)過程中websocket的狀態(tài)
console.log('ws連接狀態(tài)[關(guān)閉]：' + ws.readyState);
};
// 監(jiān)聽并處理error事件
ws.onerror = function (error) {
console.log(error);
};
}
function btnClick() {
console.log("瀏覽器端發(fā)送消息：");
//連接成功則發(fā)送一個(gè)數(shù)據(jù)
ws.send($("#input1").val());
}
function btnClick1() {
$.ajax({
url: 'http://localhost:8080/bootdemo/pushWebSocket/publish?' +
'userId=10086&message=' + $("#input1").val(),
type: 'GET',
success: function (data) {
// console.log(data);
}
});
}
function btnClick2() {
webSocketInit();
}
</script>
</body>
</html>先引入依賴：
<dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-thymeleaf</artifactId> </dependency> <dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-websocket</artifactId> </dependency> <dependency> <groupId>org.projectlombok</groupId> <artifactId>lombok</artifactId> <scope>provided</scope> </dependency>
bean上添加@ServerEndpoint，作為WebSocket的服務(wù)端。
import lombok.extern.slf4j.Slf4j;
import org.springframework.stereotype.Component;
import javax.websocket.OnMessage;
import javax.websocket.OnOpen;
import javax.websocket.Session;
import javax.websocket.server.PathParam;
import javax.websocket.server.ServerEndpoint;
import java.util.HashMap;
import java.util.Map;
import java.util.concurrent.CopyOnWriteArraySet;
@Component
@Slf4j
@ServerEndpoint("/webSocket/{userId}")
public class WebSocketServer {
//與某個(gè)客戶端的連接會(huì)話，需要通過它來給客戶端發(fā)送數(shù)據(jù)
private Session session;
private static final CopyOnWriteArraySet<WebSocketServer> webSockets =
new CopyOnWriteArraySet<>();
// 用來存在線連接數(shù)
private static final Map<String, Session> sessionPool =
new HashMap<String, Session>();
/**
* 連接成功調(diào)用的方法
*/
@OnOpen
public void onOpen(Session session, @PathParam(value = "userId")
String userId) {
try {
this.session = session;
webSockets.add(this);
sessionPool.put(userId, session);
}
catch (Exception e) {
}
}
/**
* 收到客戶端消息后調(diào)用的方法
*/
@OnMessage
public void onMessage(String message) {
log.info("websocket消息: 收到客戶端消息:" + message);
}
public void sendOneMessage(String userId, String message) {
Session session = sessionPool.get(userId);
if (session != null && session.isOpen()) {
try {
log.info("服務(wù)端推送消息：" + message);
session.getAsyncRemote().sendText(message);
}
catch (Exception e) {
e.printStackTrace();
}
}
}
}進(jìn)行注冊(cè)：
@Configuration
public class WebSocketConfigOne {
/**
* 這個(gè)bean會(huì)自動(dòng)注冊(cè)使用了@ServerEndpoint注解聲明的對(duì)象
* 沒有的話會(huì)報(bào)404
*
* @return
*/
@Bean
public ServerEndpointExporter serverEndpointExporter() {
return new ServerEndpointExporter();
}
}推送消息的控制器：
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.ResponseBody;
import java.util.HashMap;
import java.util.Map;
@Controller
@RequestMapping("/pushWebSocket")
public class WebSocketController {
@Autowired
private WebSocketServer webSocketServer;
@GetMapping("/publish")
@ResponseBody
public Map publish(String userId, String message) {
webSocketServer.sendOneMessage(userId, message);
HashMap<String, Object> map = new HashMap<>();
map.put("code", 200);
return map;
}
}還有我的配置文件application.properties：
# web port
server.port=8080
server.servlet.context-path=/bootdemo
運(yùn)行啟動(dòng)類后，訪問html(localhost:8080/bootdemo/index.html)如下：
有的同學(xué)一思索，點(diǎn)擊圖中的第2個(gè)按鈕"服務(wù)端發(fā)送瀏覽器"，你這好像也是前端先請(qǐng)求，再推送的消息；我們的WebSocketController#publish方法，在真實(shí)的場(chǎng)景下，可以在后端的定時(shí)任務(wù)中、消息中間件的消費(fèi)者端調(diào)用，不用前端先發(fā)送請(qǐng)求。
當(dāng)然SpringBoot有專門構(gòu)建WebSocket服務(wù)端的方式。
核心配置類：
import lombok.extern.slf4j.Slf4j;
import org.springframework.context.annotation.Configuration;
import org.springframework.http.server.ServerHttpRequest;
import org.springframework.http.server.ServerHttpResponse;
import org.springframework.http.server.ServletServerHttpRequest;
import org.springframework.web.servlet.HandlerMapping;
import org.springframework.web.socket.WebSocketHandler;
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.server.HandshakeInterceptor;
import javax.servlet.http.HttpServletRequest;
import java.util.Map;
@Configuration
@EnableWebSocket
@Slf4j
public class WebSocketConfig1 implements WebSocketConfigurer {
@Override
public void registerWebSocketHandlers(WebSocketHandlerRegistry
registry) {
registry.addHandler(new MyWebSocketHandler(), "/webSocket/{userId}")//設(shè)置連接路徑和處理
.setAllowedOrigins("*")
.addInterceptors(new MyWebSocketInterceptor());//設(shè)置攔截器
}
class MyWebSocketInterceptor implements HandshakeInterceptor {
//前置攔截一般用來注冊(cè)用戶信息，綁定 WebSocketSession
@Override
public boolean beforeHandshake(ServerHttpRequest request,
ServerHttpResponse response, WebSocketHandler wsHandler,
Map<String, Object> attributes) throws Exception {
log.info("前置攔截~~");
if (!(request instanceof ServletServerHttpRequest)) {
return true;
}
HttpServletRequest servletRequest =
((ServletServerHttpRequest)request).getServletRequest();
Map map = (Map)servletRequest.getAttribute(HandlerMapping.
URI_TEMPLATE_VARIABLES_ATTRIBUTE);
String userId = (String)map.get("userId");
attributes.put("userId", userId);
return true;
}
@Override
public void afterHandshake(ServerHttpRequest request,
ServerHttpResponse response, WebSocketHandler wsHandler,
Exception exception) {
log.info("后置攔截~~");
}
}
}核心處理器：
import lombok.extern.slf4j.Slf4j;
import org.springframework.stereotype.Component;
import org.springframework.web.socket.*;
import java.util.Map;
import java.util.concurrent.ConcurrentHashMap;
@Slf4j
@Component
public class MyWebSocketHandler implements WebSocketHandler {
private static final Map<String, WebSocketSession> SESSIONS =
new ConcurrentHashMap<>();
/**
* 建立新的socket連接后回調(diào)的方法
*/
@Override
public void afterConnectionEstablished(WebSocketSession session)
throws Exception {
String userId = (String) session.getAttributes().get("userId");
SESSIONS.put(userId, session);
}
/**
* 接收到瀏覽器端的消息后回調(diào)的方法
*/
@Override
public void handleMessage(WebSocketSession session,
WebSocketMessage<?> message) throws Exception {
String msg = message.getPayload().toString();
log.info("收到客戶端消息：" + msg);
}
/**
* 連接出錯(cuò)時(shí)回調(diào)的方法
*/
@Override
public void handleTransportError(WebSocketSession session,
Throwable exception) throws Exception {
log.info("連接出錯(cuò)");
if (session.isOpen()) {
session.close();
}
}
/**
* 連接關(guān)閉時(shí)回調(diào)的方法
*/
@Override
public void afterConnectionClosed(WebSocketSession session,
CloseStatus closeStatus) throws Exception {
log.info("連接關(guān)閉：status:" + closeStatus);
}
/**
* 是否處理部分消息，返回false就行
*/
@Override
public boolean supportsPartialMessages() {
return false;
}
/**
* 推送消息給瀏覽器端
*/
public void sendMessage(String userId, String message) {
WebSocketSession webSocketSession = SESSIONS.get(userId);
if (webSocketSession == null || !webSocketSession.isOpen()) {
return;
}
try {
webSocketSession.sendMessage(new TextMessage(message));
}
catch (Exception ex) {
log.error("推送消息異常：" + ex);
}
}
}控制器也改造下：
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.ResponseBody;
import java.util.HashMap;
import java.util.Map;
@Controller
@RequestMapping("/pushWebSocket")
public class WebSocketController {
@Autowired
private MyWebSocketHandler handler;
@GetMapping("/publish")
@ResponseBody
public Map publish(String userId, String message) {
handler.sendMessage(userId, message);
HashMap<String, Object> map = new HashMap<>();
map.put("code", 200);
return map;
}
}前端部分不用做修改，和之前一樣的代碼。
以上就是關(guān)于“Java應(yīng)用層協(xié)議WebSocket如何實(shí)現(xiàn)消息推送”這篇文章的內(nèi)容，相信大家都有了一定的了解，希望小編分享的內(nèi)容對(duì)大家有幫助，若想了解更多相關(guān)的知識(shí)內(nèi)容，請(qǐng)關(guān)注億速云行業(yè)資訊頻道。
免責(zé)聲明：本站發(fā)布的內(nèi)容（圖片、視頻和文字）以原創(chuàng)、轉(zhuǎn)載和分享為主，文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng)，如果涉及侵權(quán)請(qǐng)聯(lián)系站長(zhǎng)郵箱：is@yisu.com進(jìn)行舉報(bào)，并提供相關(guān)證據(jù)，一經(jīng)查實(shí)，將立刻刪除涉嫌侵權(quán)內(nèi)容。
億速云公眾號(hào)
手機(jī)網(wǎng)站二維碼