spring boot websocketダウンロード-SpringBoot spring boot websocketソースコードのダウンロード

spring boot websocket

AI ソースコード

Alpha

ダウンロード

スプリングブートとウェブソケットを使用してリアルタイムチャットアプリケーションを構築する

WebSocketとは何ですか？

WebSocketはコンピューター通信プロトコルであり、単一のTCP接続にわたって全二重通信チャネルを提供します。 WebSocketはHTTPとは異なります。このプロトコルにより、Webブラウザー（または他のクライアントアプリケーション）と、HTTPポーリングなどの半分二重の代替品よりもオーバーヘッドが低いWebサーバーとの相互作用が可能になり、サーバーからのリアルタイムデータ転送が促進されます。

クライアントとサーバーの間にWebSocket接続が確立されると、どちらも当事者によって接続が閉じるまで情報を交換できます。

これは、低遅延の高い周波数で動作するチャットのような通信サービスを構築する際に、HTTPプロトコルよりもWebSocketが優先される主な再配置です。

ストンプとは何ですか？

以前はTTMPとして知られていたシンプルな（またはストリーミング）テキスト指向のメッセージプロトコル（STOMP）は、メッセージ指向のミドルウェア（MOM）を使用するために設計されたシンプルなテキストベースのプロトコルです。ストンプクライアントがプロトコルをサポートするメッセージブローカーと通信できるようにする相互運用可能なワイヤー形式を提供します。

Websocketは単なる通信プロトコルであるため、特定のユーザーにメッセージを送信する方法がわかりません。 Stompは基本的に、これらの機能に役立つメッセージングプロトコルです。

アプリケーションのセットアップ

当社のアプリケーションには、Spring initializrを使用して設定できる次の構成があります。

Javaバージョン：11
タイプ：Maven Project
依存関係：WebSocket
スプリングブートバージョン：2.4.2

プロジェクト構造

WebSocketの構成

WebSocket EndpointとMessage Brokerの構成は非常に簡単です。

 @Configuration
@EnableWebSocketMessageBroker
public class WebSocketConfig implements WebSocketMessageBrokerConfigurer {

    @Override
    public void registerStompEndpoints(StompEndpointRegistry registry) {
        registry.addEndpoint("/websocket").withSockJS();
    }

    @Override
    public void configureMessageBroker(MessageBrokerRegistry registry) {
        registry.enableSimpleBroker("/topic");
        registry.setApplicationDestinationPrefixes("/app");
    }
}

@EnableWebsocketMessageBrokerアノテーションは、WebSocketサーバーを有効にするために使用されます。
WebSocketMessageBrokerConFigurerインターフェイスは、WebSocket接続を構成するためのいくつかの方法の実装を提供するために使用されます。
RegisterStompendPointsメソッドは、クライアントがサーバーに接続するために使用するWebSocketエンドポイントを登録するために使用されます。
ConfigureMessageBrokerメソッドは、メッセージブローカーを構成するために使用されます。メッセージブローカーは、あるクライアントから別のクライアントにメッセージをルーティングするために使用されます。

Sockjsは、Websocketをサポートしていないブラウザーのフォールバックオプションを有効にするためにも使用されています。

チャットモデルの作成

チャットモデルは、アプリケーションのクライアント側とサーバー側の間で交換されるメッセージペイロードです。

 public class ChatMessage {
    private String content;
    private String sender;
    private MessageType type;

    public enum MessageType {
        *CHAT*, *LEAVE*, *JOIN
    *}

    public String getContent() {
        return content;
    }

    public void setContent(String content) {
        this.content = content;
    }

    public String getSender() {
        return sender;
    }

    public void setSender(String sender) {
        this.sender = sender;
    }

    public MessageType getType() {
        return type;
    }

    public void setType(MessageType type) {
        this.type = type;
    }
}

チャットコントローラーの作成

当社のコントローラーは、チャットアプリケーションに存在するすべてのメッセージメソッドを処理する責任があり、基本的に1つのクライアントからメッセージを受信し、他のクライアントにブロードキャストします。

 @Controller
public class ChatController {

    @MessageMapping("/chat.register")
    @SendTo("/topic/public")
    public ChatMessage register(@Payload ChatMessage chatMessage, SimpMessageHeaderAccessor headerAccessor) {
        headerAccessor.getSessionAttributes().put("username", chatMessage.getSender());
        return chatMessage;
    }

    @MessageMapping("/chat.send")
    @SendTo("/topic/public")
    public ChatMessage sendMessage(@Payload ChatMessage chatMessage) {
        return chatMessage;
    }
}

宛先ポイントとして /アプリを使用することは、すべてのメッセージが@messagemappingで注釈されたこれらの処理方法にルーティングされることを示すWebsocket Configurationファイルのためです。

フロントエンドUIの作成

UIは、HTMLとCSSを使用して構築されたシンプルなカードボックスで、いくつかのJS関数を実行してメッセージを送信および受信します。

index.htmlは、ブラウザでJSを実行できない人にフォールバックオプションを有効にするための基本構造a s ock.jsを含むHTMLファイルと、メッセージブローカーとして機能するストンプライブラリを含むHTMLファイルです。
Main.CSSは、HTMLをスタイルするCSSファイルです。
Main.jsは、WebSocketエンドポイントを接続してメッセージを送信および受信するJavaScriptファイルです。また、画面上のメッセージを表示およびフォーマットします。