直播间弹幕数据获取

参考：斗鱼开放平台 Websocket：双向通讯协议，一段客户端和服务器建立连接客户端可以给服务器发消息，服务器也可以给客户端发消息。这个链接是长连接，一定时间内不会断开。斗鱼弹幕服务器约定45s断开。 防止两端断开，需要定时发送心跳包消息。（每隔45s） http：单项通讯协议，只能客户端向服务器发送消息，服务器响应完数据就断开连接。是短连接，下次需要数据重新建立连接。

获取弹幕数据

创建websocket对象 连接弹幕接口，获取弹幕 Const ws= new Websocket(“wss://xxxx.xxx.com”) websocket类型的数据接口都是ws、wss监听open方法，便是连接成功 ws.onopen=（）=>{ ws.send( ) //先向服务器发送登录请求。send内部发送的是二进制数据，如果需要的话，封装一个转化为二进制的方法 ws.send( ) // 登录成功后，再发送进入弹幕频道的消息给服务器 setInterval（（）=>{ws.send(toBuffer(‘type@=joingroup/rid=${}/gid@=1/\0’)}，45000）//每隔45s发送心跳消息 }监听onmessage方法，接收服务器的数据 ws.onmessage=（）=>{}onclose 监听客户端服务器断开连接onerror 监听服务器异常 注意：在页面卸载的时候销毁定时器，关闭与弹幕服务器的连接，clearInterval()，ws.close() 发送的是二进制信息，获取到的也是二进制信息（弹幕信息是文本显示，可以提取文本）

展示弹幕数据

根据弹幕的类型，判断是用户进入消息、弹幕消息、礼物消息 从获取到的弹幕消息中截取type值，使用条件语句判断类型对弹幕消息进行整理，比如用户进入直播间消息对象{type：uenter，nn：‘用户昵称’}，弹幕消息{type：chatmsg，nn：‘用户名称’，txt：‘消息内容’} const type=text.match(/type@=.?//)[0]（表示从type@=开始，提取任意字符串.?，直到/结束）将不断获取到的新数据。Push到一个数组中。数据提取完成后就可以进行渲染，根据条件渲染，设置弹幕样式给弹幕盒子设置一个固定的高度，溢出设置为滚动overflow-y：scroll 注意：当弹幕超过盒子高度的时候，设置自动滚动到底部