Echtzeitaktualisierung einer langen Verbindung auf der Vue+WebSocket-Seite

<Vorlage>
    <div>
    </div>
</Vorlage>

<Skript>
    Standard exportieren {
        Daten() {
            zurückkehren {
                Websock: null,
            }
        },
    erstellt(){
           //Öffnen Sie eine lange Verbindung, wenn die Seite gerade aufgerufen wird this.initWebSocket()
       },
    zerstört: Funktion() {
    //Schließen Sie die lange Verbindung, wenn die Seite zerstört wird. this.websocketclose();
    },
    Methoden: { 
      initWebSocket(){ //Weosocket initialisieren 
　
              const wsuri = process.env.WS_API + "/websocket/threadsocket"; //ws-Adresse this.websock = neuer WebSocket(wsuri); 
        dies.websocket.onopen = dies.websocketonopen;

        dies.websocket.onerror = dies.websocketonerror;

        dies.websock.onmessage = dies.websocketonmessage; 
        dies.websock.onclose = dies.websocketclose;
    }, 

      websocketonopen() {
        console.log("WebSocket-Verbindung erfolgreich");
      },
      websocketonerror(e) { //Fehler console.log("WebSocket-Verbindungsfehler");
      },
      websocketonmessage(e){ //Datenempfang const redata = JSON.parse(e.data);
         //Hinweis: Bei langen Verbindungen übertragen wir ein Datenelement pro Sekunde direkt in den Hintergrund. 
          //Wenn Sie jedoch auf eine Liste klicken, wird eine Kennung an das Backend gesendet und das Backend gibt basierend auf dieser Kennung die entsprechenden Daten zurück.
      // Zu diesem Zeitpunkt können Daten nur von einem Ausgang gesendet werden, sodass im Hintergrund ein Schlüssel hinzugefügt wird. Wenn der Schlüssel beispielsweise 1 ist, werden die Daten alle 1 Sekunde gepusht, und wenn er 2 ist, werden die Daten nach dem Senden der Markierung gepusht, zur Unterscheidung console.log(redata.value); 
      }, 

      websocketsend(agentData){//Daten werden gesendet this.websock.send(agentData); 
      }, 

     websocketclose(e){ //Schließen console.log("Verbindung geschlossen (" + e.code + ")"); 
     },
   }, 
  }
 </Skript>