如何使用 H5 中 WebSocket

1. 创建websocket对象

   // 参数1：websocket的服务地址
   const socket=new WebSocket('wss://echo.websocket.org/')
   

2. 获取页面元素

   const input=document.querySelector('input')
   const button=document.querySelector('button')
   const div=document.querySelector('div')
   

3. websocket服务链接成功后触发open事件

   // 2. open：当websocket服务器链接成功时触发
   socket.addEventListener('open',()=>{
   div.innerHTML='链接服务成功了'
   })
   

4. 主动给websocket服务发送消息

   // 3. 给websocket服务发送消息
   button.addEventListener('click',()=>{
   let value=input.value
   socket.send(value)
   })
   

5. 接收websocket服务发送过来的数据

   // 4. 接收websocket服务发送过来的数据
   socket.addEventListener('message',(e)=>{
   console.log(e.data)
   div.innerHTML=e.data
   })
   

6. websocket服务器关闭触发事件

   // 5. 服务断开事件
   socket.addEventListener('close',()=>{
   console.log('服务已经关闭')
   })