websocket 建立聊天接口

1、 websocket简介

WebSocket 协议在2008年诞生，2011年成为国际标准。所有浏览器都已经支持了。

它的最大特点就是，服务器可以主动向客户端推送信息，客户端也可以主动向服务器发送信息，是真正的双向平等对话，属于服务器推送技术的一种。

典型的websocket应用场景：

• 即时通讯…客服
• 聊天室 广播
• 点餐

2、socket技术

1. 客户端：发socket请求

   1. 可以用原生的
   2. 可以使用包 socket.io

2. 服务器端: 提供socket服务

   1. socket.io

   

3. 代码实现 和 socket.io的API

使用的是基于 WebSocket 协议的 socket.io 接口。我们可以使用专门的 socket.io 客户端库，就能轻松建立起连接并进行互相通信。

3.1 安装包

npm i socket.io-client

3.2 与服务器建立链接

import io from 'socket.io-client'

// 和服务器建立了链接
const client = io('地址', {
    query: {
        token: 用户token
    },
    transports: ['websocket']
})

3.2 服务器进行通讯

// connect， disconnect 是固定的名字
client.on('connect', () => {})  // 当和服务器建立连接成功，这个事件就会触发
client.on('disconnect', () => {})    // 和服务器断开链接，就会触发disconnect


// message是事件名，这个可以由后端去修改
client.on('message', () => {})  // 接收到服务器的消息，这个事件就会触发
// 主动给服务器发送消息
client.emit('message', 值)


// 主动关闭和服务器的链接
client.close()