18、利用 WebSockets 构建多人画图猜谜游戏

利用 WebSockets 构建多人画图猜谜游戏

1. 多用户画板与数据对象定义

在构建多人画图猜谜游戏之前，我们先构建了一个多用户画板。这个画板类似于最初尝试的那种，不过这次我们在构建聊天室的基础上进行了扩展，通过发送复杂的数据对象作为消息来实现更多功能。

为了让服务器和客户端能正确通信，我们需要定义一个双方都能理解的数据对象。这个数据对象包含以下几个属性：
| 属性名 | 需要该属性的原因 |
| ---- | ---- |
| dataType | 这是一个重要属性，帮助我们了解整个数据的类型，数据可以是聊天消息或者绘图线段数据 |
| sender | 如果数据是聊天消息，客户端需要知道是谁发送了该消息 |
| message | 当数据类型是聊天消息时，我们需要将消息内容本身包含在数据对象中 |
| startX | 当数据类型是绘图线段时，包含线段起点的 x 坐标 |
| startY | 当数据类型是绘图线段时，包含线段起点的 y 坐标 |
| endX | 当数据类型是绘图线段时，包含线段终点的 x 坐标 |
| endY | 当数据类型是绘图线段时，包含线段终点的 y 坐标 |

此外，在客户端和服务器端都定义了以下常量，用于 dataType 属性：

// Contants
LINE_SEGMENT : 0,
CHAT_MESSAGE : 1,

有了这些常量，我们可以使用更具可读性的代码来比较 dataT