student-client/src/features/OnlineExam/Examing/ws.js

import store from "@/store";
import { Message } from "iview";

let ws;
let shouldReconnect = true;
let heartbeatId = null;
const RECONNECT_INTERVAL = 3000;
const HEARTBEAT_INTERVAL = 50 * 1000;

export function openWS({ examRecordDataId }) {
  console.log("in openWS", examRecordDataId);
  console.log("in openWS", store);
  ws = new WebSocket(
    "ws://192.168.10.39:8010" +
      `/audioAnswerWebSocket/${examRecordDataId}/${store.state.user.key}/${
        store.state.user.token
      }`
  );

  ws.onopen = event => {
    console.log("open ws", event);

    ws.onmessage = processWSMessage;

    ws.onclose = () => {
      console.log("ws close by server");
      clearInterval(heartbeatId);
      if (shouldReconnect) {
        console.log("close -> reconnect");
        setTimeout(() => {
          // tryWSReconnect();
          openWS({ examRecordDataId });
        }, RECONNECT_INTERVAL);
      } else {
        shouldReconnect = true; // reset shouldReconnect
      }
    };

    heartbeat();
  };
}

// function tryWSReconnect() {
//   // socket.close();
//   openWS();
// }

function heartbeat() {
  heartbeatId = setInterval(() => {
    ws.send(
      JSON.stringify({
        eventType: "HEARTBEAT"
      })
    );
  }, HEARTBEAT_INTERVAL);
}

export function closeWsWithoutReconnect() {
  shouldReconnect = false;
  ws.close();
}

export function getQRCode(questionId) {
  if (ws.readyState === ws.OPEN) {
    ws.send(
      JSON.stringify({
        eventType: "GET_QR_CODE",
        questionId
      })
    );
    return true;
  } else {
    return false;
  }
}

function processWSMessage(event) {
  console.log("get ws msg: ", event);
  const res = JSON.parse(event.data);
  if (res.eventType !== "HEARTBEAT" && !res.isSuccess) {
    Message.error({
      content: res.errorMessage,
      duration: 10,
      closable: true
    });
    return;
  }
  switch (res.eventType) {
    case "HEARTBEAT":
      console.log("ws heartbeat response from server");
      break;
    case "GET_QR_CODE":
      console.log("get qrcode", res);
      store.commit("examingHomeModule/setQuestionQrCode", {
        qrCode: res.data.qrCode,
        questionId: res.data.questionId
      });
      break;
    case "SCAN_QR_CODE":
      console.log("wx scanned qrcode", res);
      store.commit("examingHomeModule/setQuestionQrCodeScanned", {
        questionId: res.data.questionId
      });
      break;
    case "GET_AUDIO_ANSWER":
      console.log("get audio url", res);
      store.commit("examingHomeModule/setQuestionAudioFileUrl", {
        questionId: res.data.questionId,
        audioFileUrl: res.data.audioFileUrl
      });
      break;
    case "SYSTEM_ERROR":
      console.log("ws get error", res);
      break;
  }
}