共享线程 ​

/* SharedWorker.js */
const uuids = []
const ports = []

self.onconnect = (e) => {
  const port = e.ports[0]
  ports.push(port)

  if (e.data?.type === 'close') {
    console.log('ShareWorker: clsoe')
    const index = ports.indexOf(port)
    ports.splice(index, 1)
    return
  }

  // 获取页面标识
  const uuid = Math.random().toString(36).substring(2)
  uuids.push(uuid)
  console.log('ShareWorker: connect')
  port.postMessage({
    type: 'connect',
    uuid: uuid,
    uuids
  })

  // 监听消息
  port.onmessage = (e) => {
    const index = ports.indexOf(port)
    const uuid = uuids[index]

    // 群发消息
    broadcast({
      type: 'message',
      sender: uuid,
      message: e.data.message
    })
  }
}

// 群发消息
const broadcast = (data) => {
  console.log('uuids', uuids)
  ports.forEach((port) => {
    console.log('ShareWorker: message')
    port.postMessage(data)
  })
}

/* 连接 */
sharedWorker = new SharedWorker('./SharedWorker.js')
/* 监听 */
sharedWorker.port.onmessage = (e: any) => {
  if (e.data.type === 'connect') {
    uuid = e.data.uuid
    console.info('连接成功')
    return
  }
  console.log(e)
}
/* 发送消息 */
sharedWorker.port.postMessage({
  type: 'message',
  message: t
})