场景介绍

WebSocket通信常用于实时性要求高的场景，例如在线聊天、游戏。本示例主要为开发者提供一个完整的WebSocket客户端和服务端案例，便于开发者快速入门HarmonyOS WebSocket客户端开发；其中客户端通过ArkTS实现，服务端通过NodeJS实现。

效果预览

• 客户端发送展示：

  

• 服务端接收消息Hello WebSocket。

实现思路

WebSocket客户端连接初始化，主要包括监听事件open、close、error；然后调用connect接口连接WebSocket服务端。

public async initConnect(): Promise<void> {
  // 关闭已有连接（避免重复创建）
  this.closeConnect();

  // 创建WebSocket实例
  this.ws = webSocket.createWebSocket();
  if (!this.ws) {
    console.error('WebSocket实例创建失败');
    this.startReconnect();
    return;
  }

  class OutValue {
    status: number = 0
    message: string = ""
  }

  // 监听连接是否正常
  this.ws.on('open', (err: BusinessError, value: Object) => {
    if (err != undefined) {
      console.error(`"connect failed; err code: ${err.code}, err message: ${err.message}`)
    } else {
      console.info(`on open, status: ${JSON.stringify(value)}`);
    }
  });

  // 监听服务端消息
  this.ws.on('message', (err: BusinessError<void>, value: string | ArrayBuffer) => {
    console.info(`收到服务端消息：`, value);
    this.handleServerMessage(value);
  });

  //  监听连接关闭
  this.ws.on('close', (err: BusinessError, value: webSocket.CloseResult) => {
    console.info(`on close, code is  ${value.code} reason is ${value.reason}`)
    // 除正常关闭外，触发重连
    if (value.code !== 1000) {
      this.startReconnect();
    }
    this.clearHeartbeatTimer();
  });


  // 监听连接错误
  this.ws.on('error', (err: BusinessError) => {
    console.error(`WebSocket 错误：${err.message}`, err.code);
    this.closeConnect();
  });

  this.ws.connect(this.wsUrl, (err: BusinessError, value: boolean) => {
    if (!err) {
      console.info(`已连接到 WebSocket 服务端：${this.wsUrl}`);
      this.startHeartbeat()
    } else {
      console.error(`WebSocket connect fail. Code: ${err.code}, message: ${err.message}`)
      this.startReconnect();
      return;
    }
  });
}

说明

项目启动说明：

1. 服务端（PC）和客户端（手机）需保证在同一个局域网中，可以通过手机连接PC的热点。
2. 安装NodeJS环境。
3. 初始化NodeJS项目：进入WebSocketServer\WebSocketClient2\server目录下，打开cmd，执行命令npm init -y。
4. 执行命令node index.js启动服务端。

约束与限制

• 本示例支持API Version 20 Release及以上版本。
• 本示例支持HarmonyOS 6.0.0 Release SDK及以上版本。
• 本示例需要使用DevEco Studio 6.0.0 Release及以上版本进行编译运行。

权限说明

获取数据网络信息：ohos.permission.INTERNET。

工程目录

1. ├──entry/src/main/ets // 代码区
2. │ ├──entryability
3. │ │ └──EntryAbility.ets
4. │ ├──entrybackupablility
5. │ │ └──EntryBackupAbility.ets
6. │ └──pages
7. │ │ └──Index.ets // 主页面
8. │ └──utils
9. │ └──WsClient.ets // WebSocket客户端实现
10. └──entry/server // 服务端NodeJS实现

参考文档

客户端完整示例

代码下载

WebSocket客户端连接服务端完整案例示例代码

原文链接：https://developer.huawei.com/consumer/cn/doc/architecture-guides/web_socket_client2-0000002550213863