Javscript实现WebSocket客户端

本章我们将给我们的 ECHO 服务实现一个客户端。你要明确的是，很多语言都能写 WebSocket 客户端，包括 Rust 在内。但基于我们当前的环境，我们使用 JavaScript（TypeScript） 配合 React（Next.js）来实现。

原生API

现代浏览器提供了对 WebSocket 的原生支持，一下是常用的API。

• new WebSocket()：实例化一个 WebSocket 对象
• send()：向服务端发送消息
• close()：关闭连接
• message事件：接收到新消息时触发
• open事件：连接成功时触发
• close事件：关闭连接后触发
• error事件：发生错误时触发

有两种方法，设置监听函数：

  ws.addEventListener('message', (ev)=> {
      console.log(ev);
  });

• 使用 on事件名 = 监听函数，比如：

ws.onmessage = (ev)=>{
    console.log(ev);
};

代码比较简单，这里对几个需要注意的地方进行讲解，其它部分请自行阅读。