Cocos Creator 中如何添加一个 WebSocket 组件。

在 Cocos Creator 中添加 WebSocket 组件的方法如下：

1. 在场景编辑器中选择要添加 WebSocket 组件的节点。
2. 在 属性检查器 中点击 添加组件 按钮，然后选择 WebSocket 组件。
3. 在 WebSocket 组件的属性面板中设置 WebSocket 的地址和端口等相关信息。
4. 在代码中使用 WebSocket 组件的 API 进行数据的发送和接收。

下面是一个示例代码，展示如何使用 WebSocket 组件：

cc.Class({
    extends: cc.Component,

    properties: {
        url: "ws://echo.websocket.org", // WebSocket 连接地址
    },

    onLoad () {
        this.websocket = new WebSocket(this.url);
        this.websocket.onopen = this.onOpen.bind(this);
        this.websocket.onmessage = this.onMessage.bind(this);
        this.websocket.onerror = this.onError.bind(this);
        this.websocket.onclose = this.onClose.bind(this);
    },

    onOpen (event) {
        cc.log("WebSocket 连接成功！");
    },

    onMessage (event) {
        cc.log("收到 WebSocket 数据：" + event.data);
    },

    onError (event) {
        cc.log("WebSocket 发生错误！");
    },

    onClose (event) {
        cc.log("WebSocket 连接关闭！");
    },

    sendMessage (message) {
        if (this.websocket.readyState === WebSocket.OPEN) {
            this.websocket.send(message);
        } else {
            cc.log("WebSocket 连接未打开！");
        }
    },

    onDestroy () {
        this.websocket.close();
    },
});

在上述代码中，我们在组件的 onLoad 方法中创建了一个 WebSocket 对象，并设置了其相关的事件回调函数。然后，在 sendMessage 方法中我们可以发送数据到服务器，而在事件回调函数中则可以处理从服务器接收到的数据。最后，在组件销毁时我们需要关闭 WebSocket 连接。