打开多个tab页面ws失效的问题，如何解决

我的项目是vue3+vite，如果也是和我一样的项目可以参考一下方式解决

先按照下面的方式创建好SharedWorker

在public文件夹下面创建一个worker.js文件写入一下内容

//worker.js
const portList = []
onconnect = function (e) {
  //创建成功会调用一次
  const port = e.ports[0]
  portList.push(port)//存储端口
  port.postMessage('创建成功')//给页面发送信息
  port.onmessage = (e) => {
  //接受页面传递的信息。
  //这里可以理解为是一个总台，页面A给总台发信息，总台就可以通过postMessage()给页面B、页面C等页面发送信息。
  }
}

注意：页面的控制台是无法查看onconnect函数里面的log，需要在浏览器地址栏输入chrome://inspect/#workers ;

在页面中的使用方式

//页面
const myWorker = new SharedWorker('/worker.js')
myWorker.port.onmessage = (e) => {
  console.log(e.data)//页面收到信息
}

在worker.js中加入ws

//worker.js
onconnect = function (e) {
  //省略代码
  initWebSocket()
  //省略代码
}

let ws = null;

const initWebSocket = () =>{
  if(!ws){
    ws = new WebSocket('ws地址')
  }
  ws.onopen = (event) => {
    console.log('创建ws成功')
  }
  ws.onmessage = (event) => {
    const msg = JSON.parse(event.data)
    for (let i = 0; i < portList.length; i++) {
      const port = portList[i]
      port.postMessage(msg)//ws收到通知，向页面进行广播
    }
  }
  ws.onclose = () => {
    console.log('ws连接关闭')
  }
  ws.onerror = function () {
    console.log('ws连接错误')
  }
}

以上如果存在代码问题，麻烦各位大佬多多指点