Bootstrap

JS: 使用new worker 创建线程来处理倒时计

需求: 3分钟内收不到消息就默认超时,收到数据就重新计时

// timeOutWorker.js

// 最大时间:(180s即3min)
const MaxCount =  3 * 60;

// 间隔时间(5s)
const TimeGap = 5;

// 间隔定时器
let intervalTimer = null;

// 当前计时
let currentCount = null;

/**
 * 清除定时器
 *
 */
const clearTimerFn = () => {
  clearInterval(intervalTimer);
  intervalTimer = null;
  currentCount = null;
}
/**
 * 监听主线程发来的消息
 * action.type: start-开始计时,stop-停止记时
 * @param e
 */
self.onmessage = e => {
  const { action } = e.data;
  if (action ==='start') {
    // 每次收到消息,更新当前值为最大值;
    currentCount = MaxCount;
    if (!intervalTimer) {
      // 设置定时器: 每隔TimeGap 秒,当前值减TimeGap ,当前值小于0时,说明已经过了3分钟
      intervalTimer = setInterval(() => {
        currentCount -= TimeGap;
        if (currentCount <= 0) {
          // 3mim内收不到消息,默认掉线,发送"close",并且清除定时器
          self.postMessage({ type: 'close'});
          clearTimerFn();
        }
      }, TimeGap * 1000);
    }
  } else {
    clearTimerFn();
  }
};

// 主线程

import timeOutWorkerRaw from './timeOutWorker.js?raw';

const blob = new Blob([timeOutWorkerRaw], { type: 'application/javascript' });
const workUrl = window.URL.createObjectURL(blob );
const TimeOutWorker = new Worker(workUrl );

// 监听来自 Worker 的消息
TimeOutWorker.onmessage = function (event: MessageEvent) {
 // 接收到来自子线程的消息close
  if (event.data.type === 'close') {}
};
//  开始方法
function startFn() {
// 给子线程发送消息
  TimeOutWorker.postMessage({ 'start'});
}
//  结束方法
function stopFn() {
// 给子线程发送消息
  TimeOutWorker.postMessage({ 'stop'});
}

;