ts封装websocket，支持失败重连、心跳、事件订阅

木灵鱼儿 2023-11-22 11:26 1462 阅读40分钟

前言

一直很想体验下websocket，苦于一直没有机会，乘着这次优化，封装了一个原生的websocket处理类，本来是想用Socket.io的，但是它只能和它配套的server端使用，对于一些非封装的服务端，没法直接使用，于是只能自己封装了。

功能：

为什么需要重新初始化，因为我们的spa项目中，用户退出登录需要断开socket连接，用户登录后又需要重新连接，所以重新初始化承接的是切换用户重连的功能。

事件订阅是由于socket传递消息全靠原生的onmessage事件，在通过这个事件的event对象里面的一些属性去区分具体事件，所以我们需要一个事件分发机制，用于通知对应事件。

再者，有些事件是长期的，订阅一次后可能没法重新订阅，比如app.vue中的处理，所以我设计的事件订阅会一直持有所有订阅，除非你手动off移除，这样的话，哪怕重新初始化连接socket，相对于的事件通知也不会丢失。

此处内容已隐藏回复后方可阅读。