解决前端websocket数据帧接收数据大小限制(数据分帧)问题

websocket前后台出现问题解决方法:

一开始通过限制后台返回数据帧以125字节分隔分段数据返回给前台,但调试时发现只要加上其他的一些信息返回json string很容易就会超过了125字节,于是在后台修改了这个限制大小为2048,但是这时候前端就出现了无法接收的问题。

抛出错误为:WebSocket connection to 'ws://xxx.xx.xxx.xx:xx/' failed: One or more reserved bits are on: reserved1 = 1, reserved2 = 0, reserved3 = 1

粗略在网上找了一下原因,是因为字符超出125而后台对数据处理没有采取策略造成的

于是乎在后台限制数据帧返回最大为125字节,这就导致了接收的frame是这样的:


(上面返回的四条数据帧都是同一条信息)

用前端处理方法:

这里我一开始采用的是直接在前台JSON.parse函数来处理onmessage接收的数据

当数据过大后JSON.parse就会报错

于是乎我就采用了一个折中的方法:

解决前端websocket数据帧接收数据大小限制(数据分帧)问题_第1张图片


------------------------------------------------------------------

解决前端websocket数据帧接收数据大小限制(数据分帧)问题_第2张图片

思想:在监听函数一开始时先给message设置为空,设置flag为true

onmessage接收到信息后尝试去解析成json,如果失败就捕获到异常

在异常处理中,给message字符串拼接,拼接完成后再尝试去解析成json,如果解析成功则修改flag为true且将message置为空


用后台处理方法:(前端不用再分段数据帧接收一条信息)

在对返回的数据帧处理的方法中:

解决前端websocket数据帧接收数据大小限制(数据分帧)问题_第3张图片

因为返回的数据帧必须遵守socket协议,socket协议规定返回数据帧头部必须为数据大小的ascii码,所以上面的代码就不难理解了

你可能感兴趣的:(前端,websocket,php,socket)