Spring boot開発-第9編統合websocket

1、websocketの概要
1.1、WebSocketとは何ですか.
WebSocketはネットワーク通信プロトコルです.RFC 6455は、その通信規格を定義する.
WebSocketは、HTML 5が提供し始めた単一のTCP接続上でフルデュプレクス通信を行うプロトコルである.
1.2、なぜWebSocketが必要なのか.
HTTPプロトコルは、無状態、無接続、一方向のアプリケーション層プロトコルである.リクエスト/レスポンスモデルを採用しています.通信要求はクライアントからのみ開始され,サービス側は要求に対して応答処理を行う.
この通信モデルには、HTTPプロトコルでは、サーバがクライアントに積極的にメッセージを送信することができないという弊害がある.
このような一方向要求の特徴は,サーバが連続的に状態が変化すると,クライアントが知るのは非常に面倒であることに決まっている.ほとんどのWebアプリケーションでは、頻繁な非同期JavaScriptとXML(AJAX)リクエストによって長いポーリングが実現されます.ポーリングの効率が低く、リソースが非常に浪費されます(接続を停止しないか、HTTP接続を常に開く必要があるため).
WebSocketはこのように発明された.WebSocket接続を使用すると、クライアントとサーバの間でフルデュプレクス通信が可能になり、どちらも確立された接続によってデータを他端にプッシュできます.WebSocketは1回の接続を確立するだけで、接続状態を維持することができます.これは、ポーリング方式による接続の継続的な確立に比べて、明らかに効率が大幅に向上します.
2、構築工事
2.1.pomにwebsocketの依存を追加する

    org.springframework.boot
    spring-boot-starter-websocket

2.2、要求メッセージエンティティの作成

package com.vesus.springbootwebsocket.model;

/**
 * @Description:
 * @Author: vesus
 * @CreateDate: 2018/5/28   5:46
 * @Version: 1.0
 */
public class RequestMessage {

    /***
     *     
     */
    private String message ;

    public String getMessage() {
        return message;
    }

    public void setMessage(String message) {
        this.message = message;
    }
}

2.3.レスポンスメッセージエンティティの作成

package com.vesus.springbootwebsocket.model;

/**
 * @Description:
 * @Author: vesus
 * @CreateDate: 2018/5/28   5:47
 * @Version: 1.0
 */
public class ResponseMessage {

    /**
     *     
     */
    private String message ;

    public String getMessage() {
        return message;
    }

    public void setMessage(String message) {
        this.message = message;
    }
}

2.4.Message Agentの構成

package com.vesus.springbootwebsocket.config;

import org.springframework.context.annotation.Configuration;
import org.springframework.messaging.simp.config.MessageBrokerRegistry;
import org.springframework.web.socket.config.annotation.EnableWebSocketMessageBroker;
import org.springframework.web.socket.config.annotation.StompEndpointRegistry;
import org.springframework.web.socket.config.annotation.WebSocketMessageBrokerConfigurer;

/**
 * @Description:
 * @Author: vesus
 * @CreateDate: 2018/5/29   10:41
 * @Version: 1.0
 */
@Configuration
@EnableWebSocketMessageBroker
public class WebSocketConfig implements WebSocketMessageBrokerConfigurer {
    /***
     *    Stomp   
     * addEndpoint：  STOMP     。  WebSocket SockJS        
     * withSockJS：  SockJS  
     * @param registry
     */
    public void registerStompEndpoints(StompEndpointRegistry registry) {
        registry.addEndpoint("/api/v1/socket")
                .setAllowedOrigins("*")//        
                .withSockJS() ;
    }

    /**
     *       
     *   Broker，                         broker
     */
    public void configureMessageBroker(MessageBrokerRegistry registry) {
        registry.enableSimpleBroker("/api/v1/socket/send");//      
        registry.setApplicationDestinationPrefixes("/api/v1/socket/req");//      
        registry.setUserDestinationPrefix("/user");//      
    }

}

2.5、コントローラ

package com.vesus.springbootwebsocket.controller;

import com.vesus.springbootwebsocket.model.RequestMessage;
import com.vesus.springbootwebsocket.model.ResponseMessage;
import org.springframework.messaging.handler.annotation.MessageMapping;
import org.springframework.messaging.handler.annotation.SendTo;
import org.springframework.messaging.simp.SimpMessagingTemplate;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;

import javax.annotation.Resource;

/**
 * @Description:
 * @Author: vesus
 * @CreateDate: 2018/5/29   1:48
 * @Version: 1.0
 */
@Controller
public class WebSocketController {

    @Resource
    private SimpMessagingTemplate messagingTemplate ;

    @RequestMapping("/index")
    public String index(){
        return "index";
    }

    @MessageMapping("/welcome")
    public ResponseMessage toTopic(RequestMessage msg) throws Exception
    {
        System.out.println("======================"+msg.getMessage());
        this.messagingTemplate.convertAndSend("/api/v1/socket/send",msg.getMessage());
        return new ResponseMessage("    webScoket："+msg.getMessage());
    }

    @MessageMapping("/message")
    public ResponseMessage toUser(RequestMessage msg ) {
        System.out.println(msg.getMessage());
        this.messagingTemplate.convertAndSendToUser("123","/message",msg.getMessage());
        return new ResponseMessage("    webScoket："+msg.getMessage());
    }
}

2.6、フロントエンドhtml

    
    
    
    


  
    


        ：

      

    



    var stompClient = null;
    //            
    function setConnected(connected)
    {
        $("#connect").attr("disabled",connected);
        $("#disconnect").attr("disabled",!connected);
        if(!connected) {
            $("#inputDiv").hide();
        }else{
            $("#inputDiv").show();
        }
        $("#reponse").html("");
    }
    //  
    function connect()
    {
        var socket = new SockJS("/api/v1/socket");
        stompClient = Stomp.over(socket);
        stompClient.connect({},function (frame) {
            setConnected(true);
            console.log("connected : "+frame);
            stompClient.subscribe("/api/v1/socket/send",function (response) {
                showResponse(JSON.parse(response.body));
            })
        })
    }
    //    
    function disconnect(){
        if(stompClient!=null)
        {
            stompClient.disconnect();
        }
        setConnected(false);
        console.log("disconnected!");
    }
    //       
    function sendName(){
        var name = $("#name").val();
        stompClient.send("/api/v1/socket/req/message",{},JSON.stringify({'message':name}));
    }
    //  socket      
    function showResponse(message)
    {
        $("#response").html(message);
    }

ソース:https://gitee.com/vesus198/springboot-demo/tree/master/springboot-websocket