webSocket

建立连接
@Configuration
@EnableWebSocketMessageBroker
public class WebSocketConfig implements WebSocketMessageBrokerConfigurer {

    @Override
    public void registerStompEndpoints(StompEndpointRegistry registry) {
        registry.addEndpoint("/wypWebSocket").withSockJS();//连接url
    }

    @Override
    public void configureMessageBroker(MessageBrokerRegistry registry) {
        registry.enableSimpleBroker("/topic/");//广播的方式
        registry.setApplicationDestinationPrefixes("/wyp");//前缀
    }
}

前端：
var stompClient = null;
    //建立连接
    $(function () {
        connect();
    })
    function connect() {
        var socket = new SockJS('/wypWebSocket');//和WebSocketConfig 的registerStompEndpoints 方法对应 用于连接后台
        stompClient = Stomp.over(socket);
        stompClient.connect({}, function (frame) {
            console.log('Connected: ' + frame);
            stompClient.subscribe('/topic/message', function (data) { //订阅   /topic/message  发送请求在这个路由下就会接收到信息
                let dat = JSON.parse(data.body);
                console.log(dat);
                alert(JSON.stringify(dat));
                showGreeting(dat);
                //showGreeting(data);
            });
        });
    }

    function showGreeting(content) {
        content.forEach(item =>{
            $("#dd").html(item.name);
        })

       /*
       当出现转换异常时： 例如 "（代表""）用下面的方法转换  在html中自动会转成好的格式
       或者替换
       $("#inp").html(content)

        $("#dd").html(JSON.parse($("#inp").html()).name)

        let jsonString = JSON.stringify(content);

        let jso = jsonString.replace(new RegExp(""","gm"),"\"");

        alert(JSON.parse(jso.substr(1,jso.length-2)).name);*/

    }
    function sendName() {
        stompClient.send("/wyp/chat", {}, JSON.stringify({"name": $("#name").val()}));
    }

后台：
@RestController
public class WebSocket {

    @Autowired
    SimpMessagingTemplate template;

    /*
    * 跳转页面
    * */
    @GetMapping("socket")
    public ModelAndView getSocket(){
        ModelAndView modelAndView = new ModelAndView("socket");
        return modelAndView;
    }

    /*
    * 当请求这个方法时，会将数据发送到前端 和前端的"/topic/message"进行绑定
    * */
    @GetMapping("/serverSend")
    public void serverSendMsg(User user){
        User u1 = new User();
        User u2 = new User();
        u1.setName("王雅");
        u2.setName("王ping");
        List<User> list = new ArrayList<>();
        list.add(u1);
        list.add(u2);
        template.convertAndSend("/topic/message",JSON.toJSON(list));
    }

/**
 * 前端连接后端   前端发送请求到这里
 * */
    @MessageMapping("/chat") //前端请求
    @SendTo("/topic/message") // 转达到前端接收
    public void chat(String name) {
        System.out.println(name);
        User u2 = new User();

        u2.setName("王雅");
        List<User> list = new ArrayList<>();
        list.add(u2);
        template.convertAndSend("/topic/message", JSON.toJSON(list));
    }
}