Web前端-WebSocket

之前做前端大部分请求都是普通的HTTP请求，并没有接触过WebSocket，最近在做一个日志展示，需要实时输出，所以就用到了WebSocket，这里主要记录一下前端，也就是客户端的操作。

// 打开一个WebSocket连接
let ws = new WebSocket('ws://192.168.201.182:9001/pods/stdout/tails')

// 当打开连接时的操作
ws.onopen = () => {
  // 由于业务需求，要在打开时发送参数请求
  ws.send('something')
}

// 当关闭连接时的操作
// 注意：这里的关闭是指服务端关闭
this.ws.onclose = () => {
  // do something
}

// 收到数据时的操作
this.ws.onmessage = (msg) => {
  // do something
}

// 收到错误时的操作
this.ws.onerror = (e) => {
  // do something
}

上面注册的ws连接，有两个基础方法：

ws.send()：主动发送请求给后台，参数是一个字符串，格式自己定义。
ws.close()：发送一个请求，告知后台要关闭连接，当收到响应时会出发ws.onclose()，此时这个WebSocket连接就已经关闭了。

同时ws有一个常用的基础方法ws.readyState，表示当前socket的连接状态：

0 - 表示连接尚未建立。
1 - 表示连接已建立，可以进行通信。
2 - 表示连接正在进行关闭（即前端触发ws.close()但还未收到响应）。
3 - 表示连接已经关闭或者连接不能打开。

END