工作中websocket的应用

66 阅读1分钟

概念

WebSocket 使得客户端和服务器之间的数据交换变得更加简单,允许服务端主动向客户端推送数据。在 WebSocket API 中,浏览器和服务器只需要完成一次握手,两者之间就直接可以创建持久性的连接,并进行双向数据传输。

在 WebSocket API 中,浏览器和服务器只需要做一个握手的动作,然后,浏览器和服务器之间就形成了一条快速通道。两者之间就直接可以数据互相传送。

评价

自己感觉websocket类似于vue中的生命周期、分别为在什么状态中处理不同的回调就可以

代码


const myWebsocket = function(userID){
    // 创建一个websocket 
    var webSocket = CreateWebSocket(`ws://127.0.0.1:3000/websocket/${userID}`); 
    // 监听连接开启
    webSocket.onopen = function (event) {
        console.log("第一次建立连接后的回调",event)
        // 主动向后台发送数据 
        webSocket.send("前端向后端发送第一条数据")
    } 

    // 监听websocket通讯 
    webSocket.onmessage = function (event) { 
        // 这是服务端返回的数据 
        let res = JSON.parse(evt.data) 
        console.log(res,'服务器每次向前端发送数据时候的回调')
    } 
    // 监听连接关闭 断开时的回调
    webSocket.onclose = function (evt) { 
        console.log("Connection closed.") 
    }
}
// 在需要的时候调用 开启连接 
// 我项目中是在点击登录按钮后、带着用户的唯一标识给后台建立链接
myWebsocket(userID)