Vue+WebSocket ページでの長時間接続のリアルタイム更新

<テンプレート>
    <div>
    </div>
</テンプレート>

<スクリプト>
    エクスポートデフォルト{
        データ（） {
            戻る {
                ウェブソック: null、
            }
        },
    作成された(){
           //ページに入ったときに長い接続を開く this.initWebSocket()
       },
    破棄: 関数() {
    //ページが破棄されたら長い接続を閉じます this.websocketclose();
    },
    メソッド: { 
      initWebSocket(){ //wesocketを初期化する 
　
              const wsuri = process.env.WS_API + "/websocket/threadsocket"; //ws アドレス this.websock = new WebSocket(wsuri); 
        this.websocket.onopen = this.websocketonopen;

        this.websocket.onerror = this.websocketonerror;

        this.websocketonmessage は、次のメッセージを返します。 
        this.websocket.onclose は this.websocketclose です。
    }, 

      ウェブソケットオープン() {
        console.log("WebSocket接続が成功しました");
      },
      websocketonerror(e) { //エラー console.log("WebSocket接続エラー");
      },
      websocketonmessage(e){ //データ受信 const redata = JSON.parse(e.data);
         //注: 長時間の接続の場合、バックグラウンドで 1 秒あたり 1 つのデータを直接プッシュします。 
          //ただし、リストをクリックすると、識別子がバックエンドに送信され、バックエンドはこの識別子に基づいて対応するデータを返します。
      //このとき、データは1つの出口からしか送出できないので、バックグラウンドにキーを追加します。例えば、キーが1のときは1秒ごとにデータをプッシュし、2のときはマークを送信してからデータをプッシュするなど、区別します。 console.log(redata.value); 
      }, 

      websocketsend(agentData){//データ送信 this.websock.send(agentData); 
      }, 

     websocketclose(e){ //閉じる console.log("接続が閉じられました (" + e.code + ")"); 
     },
   }, 
  }
 </スクリプト>