Taro项目使用WebSocket构建一个在线聊天室

Taro提供了一些websocket相关的接口

https://taro-docs.jd.com/taro/docs/apis/network/webSocket/connectSocket

1、聊天室的效果

二、实现思路

1、Taro.connectSocket创建连接

2、onMessage监听服务器返回的数据

3、创建一个全局存储消息的数组 let arr = []

当Input字段捕获用户输入时，在按下发送按钮时，请将该值存入arr数组中，并设置一个标识位flag来区分消息来源。其中,a personal message标记为true（表示来自个人），a server response标记为false（表示来自服务器）。

5、使用sendSocketMessage发送消息

Taro.sendSocketMessage({

data: Inputvalue

})

6、在render方法中遍历消息数组并进行展示处理操作。通过flag字段的设置来区分不同类型的的消息信息，并根据样式规则确定消息布局位置

三、具体实现

1、建立连接

 //全局变量