如何利用“单例模式”配合闭包确保在单页应用中全局仅存在一个 WebSocket 长连接实例

不能直接多次 new WebSocket()，因会导致多连接并存、资源浪费、消息重复、重连混乱，且跨端不兼容；闭包单例通过 IIFE 锁定 instance 实现唯一初始化，但需配合 uni.connectSocket、状态清理、指数退避重连等手动补全逻辑。

为什么不能直接 new WebSocket() 多次调用

在单页应用里，每个页面或组件都 new WebSocket(url)，会导致多个物理连接并存。服务端看到的是多个独立 client ID，资源占用翻倍，消息广播可能重复推送给同一用户，重连逻辑也各自为政。更糟的是，uni-app、Taro 等跨端框架中，new WebSocket() 在小程序和 App 端根本不可用——它只在 H5 有效，跨端一致性直接崩塌。

闭包单例如何避免多次初始化

核心是把 instance 变量锁在 IIFE 内部，外部无法篡改，且仅首次调用 getInstance() 时才真正创建连接：

const WebSocketSingleton = (function () {  let instance = null  return {    getInstance: function (url) {      if (!instance) {        // 这里必须用平台兼容的 API，比如 uni-app 用 uni.connectSocket        instance = {          url,          socket: null,          connect() {            uni.connectSocket({ url })            uni.onSocketOpen(() => { /* 存引用 */ })            uni.onSocketMessage((e) => { /* 转发给监听者 */ })          },          send(data) { uni.sendSocketMessage({ data }) }        }      }      return instance    }  }})()

• 第二次调用 WebSocketSingleton.getInstance('wss://...') 不会新建连接，而是返回上次的 instance
• 即使传入不同 url，也不会覆盖——这反而是个坑：你得确保所有地方传的 url 一致，否则闭包里会误判为“新实例”而新建连接
• 如果需要支持多 endpoint（如不同环境），建议把 url 提到配置层，不在 getInstance 参数里传

uni-app 下必须用 uni.connectSocket，不是可选项

uni-app 的 uni.connectSocket 是跨端统一入口，但行为差异大：

• uni.connectSocket 必须在 onReady 后调用，onLoad 阶段调用在 App 端大概率失败
• URL 协议必须是 wss://，小程序强制校验，ws:// 只能用于 H5 本地调试
• 查询参数要 encodeURIComponent，例如 ?token=abc+def 不编码会导致连接中断
• 发送消息前必须等 uni.onSocketOpen 触发，否则报错 fail websocket not connected

断开重连和状态清理最容易被忽略

单例不等于永生。切后台、网络切换、小程序被回收都会触发 uni.onSocketClose，但此时 instance.socket 仍非 null，下次 send 就静默失败。

• 每次 uni.onSocketClose 或 uni.onSocketError 后，必须清空 instance.socket = null
• 重连不能用固定间隔 setTimeout，得用指数退避：第 1 次 1s，第 2 次 3s，第 3 次 9s……最多试 5 次
• App 和小程序的 onHide 生命周期里，应主动 uni.closeSocket() 并重置状态，否则切回来时连接已失效却还挂着“已连接”假象

闭包单例管住的是“实例唯一性”，但连接的活性、错误恢复、生命周期同步，全得靠手动补全——这些逻辑一旦漏掉，单例就只是个看起来整洁的空壳。