國慶連假中，假日只想耍廢玩 game，不想進修QQ，但為了避免斷賽，還是加減推一些東西，等明後天再來調整吧?不過也許會懶癌發作。

HTML

訊息列表頁面，新增一個欄位用來顯示目前線上人數。

<h2>Hello : {{ username }}</h2>

Server.js

server-side 這邊可以利用 ws 提供的 size(即 wss.clients.siz) 來撈出目前的登入人數。

將人數的數字，塞入物件中，再回傳給 client-side。

  ws.on('message', function (message) {
    const bufferMessageObj = Buffer.from(message).toString();
    let formData = JSON.parse(bufferMessageObj);
    formData.num = wss.clients.size;

    wss.clients.forEach((client) => {
      if (client.readyState === WebSocket.OPEN) {
        client.send(JSON.stringify(formData));
      }
    });
  });

Client.js

client-side 此處的寫法實在不好，過於巢狀，但就先求功能出來，之後再來想怎麼改了。

data: {
    // ...
    onlineNum: '',
},

onMessage(event) {
  let obj = JSON.parse(event.data);
  this.onlineNum = obj.num;
  if (obj.event === 'login') {
    this.list.push(`Welcome : ${obj.message} enter chat!`);
  } else {
    if (obj.name !== this.name) {
      this.list.push(obj.message);
    }
  }
},