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

1 篇文章 0 订阅
1 篇文章 0 订阅

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就会报错

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



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


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

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

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


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

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


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

WebSocket是一种全双工通信协议,它在建立连接时使用HTTP/HTTPS协议,但在连接建立后,数据传输不再遵循HTTP/HTTPS协议。WebSocket协议的底层原理是通过在客户端和服务端之间建立一个套接字连接,使得客户端和服务端可以通过这个套接字连接进行实时的双向数据传输。在建立连接时,客户端和服务端会进行一次握手,握手成功后,客户端和服务端就可以通过这个套接字连接进行实时的双向数据传输。 具体来说,WebSocket协议的建立过程如下: 1. 客户端向服务端发送一个HTTP/HTTPS请求,请求中包含了一些特殊的头部信息,表明客户端希望建立一个WebSocket连接。 2. 服务端接收到请求后,会进行一些验证,验证通过后,服务端会向客户端发送一个HTTP/HTTPS响应,响应中也包含了一些特殊的头部信息,表明服务端同意建立WebSocket连接。 3. 客户端接收到响应后,会进行一些验证,验证通过后,客户端和服务端之间就建立了一个套接字连接,客户端和服务端就可以通过这个套接字连接进行实时的双向数据传输。 在数据传输过程中,WebSocket协议采用了一种类似于TCP的机制,即采用了帧的概念,将数据分割成多个帧进行传输。每个帧都包含了一些特殊的头部信息,用于标识这个帧的类型、长度等信息。客户端和服务端都可以发送帧,发送帧的方式也类似于TCP,即采用了流的方式进行发送。
评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值