springboot整合websocket實現客戶端與服務端通訊

定義

 WebSocket是經過單個TCP鏈接提供全雙工（雙向通訊）通訊信道的計算機通訊協議。此WebSocket API可在用戶的瀏覽器和服務器之間進行雙向通訊。用戶能夠向服務器發送消息並接收事件驅動的響應，而無需輪詢服務器。 它能夠讓多個用戶鏈接到同一個實時服務器，並經過API進行通訊並當即得到響應。

案例介紹

  後端在接收到用戶新下的訂單後，通知到後臺系統

服務端代碼

pom.xml

<dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-websocket<artifactId>
</dependency>

websocket配置類

import org.springframework.context.annotation.Bean;
import org.springframework.context.annotation.Configuration;
import org.springframework.web.socket.server.standard.ServerEndpointExporter;

/**
 * websocket配置
 * @author : wang zns
 * @date : 2019-05-06
 */
@Configuration
public class WebSocketConfig {

    @Bean
    public ServerEndpointExporter serverEndpointExporter() {
        return new ServerEndpointExporter();
    }

}

websocket核心業務類

import lombok.extern.slf4j.Slf4j;
import org.springframework.stereotype.Component;

import javax.websocket.OnClose;
import javax.websocket.OnMessage;
import javax.websocket.OnOpen;
import javax.websocket.Session;
import javax.websocket.server.ServerEndpoint;
import java.io.IOException;
import java.util.concurrent.CopyOnWriteArraySet;
import java.util.concurrent.atomic.LongAdder;

/**
 * websocket服務端核心類
 * @author : wang zns
 * @date : 2019-05-06
 */
@ServerEndpoint("/websocket")
@Component
@Slf4j
public class WebSocketService {

    /**
     * 記錄當前websocket的鏈接數（保證線程安全）
     */
    private static LongAdder connectAccount = new LongAdder();

    /**
     *存放每一個客戶端對應的websocketServer對象(需保證線程安全)
     */
    private static CopyOnWriteArraySet<WebSocketService> webSocketSet = new CopyOnWriteArraySet<>();
    /**
     * 與客戶端的鏈接對象
     */
    private Session session;

    /**
     * 鏈接成功調用的方法
     * @param session
     */
    @OnOpen
    public void onOpen(Session session) {
        this.session = session;
        webSocketSet.add(this);
        connectAccount.increment();
        log.info("有新的鏈接接入，當前鏈接數爲{}", connectAccount);
    }

    /**
     * 鏈接關閉時調用
     */
    @OnClose
    public void onClose() {
        webSocketSet.remove(this);
        connectAccount.decrement();
        log.info("有鏈接關閉，當前鏈接數爲{}", connectAccount);
    }

    /**
     * 收到客戶端消息時調用
     * @param message
     */
    @OnMessage
    public void onMessage(String message) {
        log.info("收到客戶端發來的消息,message -> {}", message);
    }

    /**
     * 服務端向客戶端發送消息
     * @param message
     */
    public void sendMessage(String message) {
        for (WebSocketService webSocketService : webSocketSet) {
            try {
                log.info("【websocket消息】 廣播消息, message={}", message);
                webSocketService.session.getBasicRemote().sendText(message);
            } catch (IOException e) {
                log.info("向客戶端發送消息失敗, {}", e.getMessage());
            }
        }
    }

}

客戶端代碼

在此案例中，咱們的客戶端爲瀏覽器,因此直接經過js進行鏈接

<script>
    var websocket;
    if ('WebSocket' in window) {
        websocket = new WebSocket('ws://127.0.0.1:9988/sell/websocket');
    } else {
        alert("你的瀏覽器暫不支持websocket,請更換其餘瀏覽器再試");
    }

    websocket.onopen = function (event) {
        console.log("創建鏈接");
    };
    websocket.onclose = function (event) {
        console.log("關閉鏈接");
    };
    websocket.onmessage = function (event) {
        console.log("收到消息," + event.data);
        // 彈窗提示與播放提示音樂
        setTimeout(function () {
            document.getElementById('notice').play();
        },1000);
        $("#orderModal").modal('show');
    };
    websocket.onerror = function (event) {
        console.log("websocket異常");
    };
    /**
     * readyState狀態以下:
     * CONNECTING：值爲0，表示正在鏈接；
       OPEN：值爲1，表示鏈接成功，能夠通訊了；
       CLOSING：值爲2，表示鏈接正在關閉；
       CLOSED：值爲3，表示鏈接已經關閉，或者打開鏈接失敗。
     */

    // 向服務端發送消息(必須爲open狀態時可發送)
    if (websocket.readyState === 1) {
        websocket.send("服務端你好");
    }

</script>

效果演示

服務端

客戶端

寫在最後

  websocket的做用遠不止這些，本文只是一種較爲常見的用法; 在最後附上參考的blog -> Spring Boot整合websocket實現羣聊，點對點聊天