什么叫websocket：我的理解就是一個特殊的后端接口，只不過這個后端接口不是通過前端點擊什么然后去請求后端接口數據。而是進入一個界面以后就一直與這個接口相連接了。只不過沒有數據傳輸過來。只有當后端通過這個接口傳輸數據時，前端才能夠接受：

代碼如下：

事先引入需求模塊

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

          /* 建立stomp連接，監聽報警消息 */
    createStomp() {
      const socket = new SockJS(ScheduleApi['CHECK_SOCKJS_URL']);
      // socket.onopen = function(e) { console.log('open'); }
      // socket.onmessage = function(e) { console.log(e.data); }
      // return
      // 經過stomp.over之后，會重寫onopen之類的方法
      const client = Stomp.over(socket);
      // 屏蔽stomp的debug信息
      client.debug = function(str) {
        // console.log('%c'+str, 'color: BlueViolet');
      };

      this.stompClient = client;
      client.connect({}, _ => {
        client.subscribe(ScheduleApi['CHECK_STOMP_TOPIC'], msg => {
          // console.log('Stomp', msg);
          let { body:jsonData } = msg;
          let data;
          try {
            data = JSON.parse(jsonData);
         
          } catch(e) {
            console.log('%c報警stomp，json格式不對', 'color: BlueViolet');
            return;
          }
        });
      });
    },
    /* 銷毀stomp連接 */
    destroyStomp() {
      this.stompClient && this.stompClient.disconnect();
    },

總結

以上是生活随笔為你收集整理的前端必学技巧sockjs的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。