Chrome for Android v94 闲置5分钟标签页冻结致WebSocket断开如何解决？

Chrome for Android v94之后默认对后台闲置超过5分钟的标签页执行资源冻结逻辑，暂停页面所有JS执行，所以客户端侧的ping定时任务会被中断，最终导致WebSocket心跳超时断连。以下是经过实测有效的可行方案：

方案1：通过持续播放静音空白视频阻止标签页冻结 #

Chrome对处于「正在播放媒体」状态的标签页不会触发闲置冻结，是目前兼容性最好、实现成本最低的前端侧解决方案：

• 准备1个1秒时长的无音轨空白mp4文件，也可以直接使用base64编码的空白视频资源避免额外请求
• 页面初始化后，在用户首次交互时（比如点击按钮、触摸屏幕的回调中）动态创建隐藏的video标签循环播放，示例代码：

const preventFreezeVideo = document.createElement('video')
preventFreezeVideo.muted = true
preventFreezeVideo.loop = true
preventFreezeVideo.src = 'blank.mp4'
preventFreezeVideo.style.display = 'none'
document.body.appendChild(preventFreezeVideo)
preventFreezeVideo.play().catch(err => console.log('防冻结视频播放失败：', err))

• 该方案在Chrome for Android v94~v120版本均验证有效，仅产生极微的额外电量消耗，对用户体验无影响

方案2：将应用封装为PWA添加到主屏幕 #

添加到主屏幕的PWA应用在Chrome中的进程优先级远高于普通标签页，默认不会被纳入闲置冻结队列：

• 给应用配置符合规范的manifest.json文件，声明display: standalone或display: fullscreen属性
• 注册基础的Service Worker，实现PWA的基础安装能力，引导用户点击「添加到主屏幕」完成安装
• 安装后的PWA运行时只要系统内存充足，即使退到后台也不会被冻结，WebSocket连接可以稳定保持

方案3：调整WebSocket保活逻辑，改为服务端主动发ping #

如果以上两种方案都不适用，可以调整心跳逻辑降低对客户端定时任务的依赖：

• 把原有的「客户端发ping、服务端回pong」的逻辑，改为服务端每3分钟主动向客户端发送ping帧
• 客户端仅需要在收到ping后返回pong即可，不需要主动触发定时任务
• 注意：该方案仅能缓解部分断连场景，如果标签页被完全冻结，客户端收到ping后也无法返回pong，仍会出现断连，建议搭配方案1共同使用

• 不要尝试通过修改Chrome flags、系统配置的方式解决，普通用户无法操作，不具备生产环境可用性
• 不要依赖setTimeout/setInterval实现长时间后台定时任务，Chrome冻结标签页后所有定时任务都会暂停执行

内容的提问来源于stack exchange，提问作者linnn