O SockJS front-end do WebSocket obtém o conteúdo de texto de informações inscritas

1. Introduzir dependências do SockJS

1. Vue introduz dependências

import SockJS from  'sockjs-client';
import Stomp from 'stompjs';

2. Maven introduz dependências

• pom.xmlDependência de adição de arquivo

<dependency>
    <groupId>org.webjars</groupId>
    <artifactId>sockjs-client</artifactId>
    <version>1.0.2</version>
</dependency>
<dependency>
    <groupId>org.webjars</groupId>
    <artifactId>stomp-websocket</artifactId>
    <version>2.3.3</version>
</dependency>

• Introduzir os js do pacote jar no arquivo html

<script src="/webjars/sockjs-client/1.0.2/sockjs.min.js"></script>
<script src="/webjars/stomp-websocket/2.3.3/stomp.min.js"></script>

Nota : Use o maven para introduzir o springboot do projeto dependente

2. Crie uma conexão, assine a mensagem

var socket = new SockJS('/wsdemo');
stompClient = Stomp.over(socket);
// 创建连接
stompClient.connect({}, function (frame) {
    //订阅消息
    stompClient.subscribe('/topic/message', function (data) {
        initOnLine(data.body)
    });
);

3. Receba notícias sobre assinaturas

 //订阅消息
stompClient.subscribe('/topic/message', (msg) => {
    // 输出返回的信息
    console.log(msg);
    // 输出返回的消息的文本内容
    console.log(meg.body);
});

Fonte de referência

O vue usa o SockJS para implementar a comunicação webSocket