WebSocket 入門

PsChina發表於2019-03-27
Web

WebSocket 提供了瀏覽器服務端雙工通訊的可能，改善了輪詢帶來的伺服器壓力和效能損耗，減少了http頭資訊重複低效的問題

WebSocket 物件

WebSocket 是一個建構函式是瀏覽器提供的原生 api

通過 new 關鍵字新建 socket 例項，接受一個 socket 伺服器地址。

 var socket = new WebSocket('ws://192.168.0.221:9999/websocket')    
複製程式碼

onopen 例項方法

onopen 方法會在和伺服器三次握手成功後觸發 代表成功建立連結

    socket.onopen = function(res){
        console.log('連結成功'，res️)
    }
複製程式碼

send 例項方法

send 方法用於向伺服器傳送訊息，需要在連結成功建立的條件下使用：

    var socket = new WebSocket('ws://192.168.0.221:9999/websocket')
    socket.onopen = function(res){
        socket.send(JSON.stringify({
        "event":"REGISTER_ONLINE", // 向伺服器傳送註冊事件的訊息
        "data":{}
        }))
    }
複製程式碼

onmessage 例項方法

onmessage 方法用於接受伺服器推送過來的訊息

    socket.onmessage = function(res){
        console.log('接收到服務端訊息：',res)
    }
複製程式碼

onerror 例項方法

當服務發生異常時客戶端會收到 error 事件通常可以在 onerror 事件內嘗試重啟 websocket

    socket.onerror = function(res){
        console.log('onerror')
        // Restart your websocket
    }
複製程式碼

onclose 例項方法

當連結關閉後會觸發 onclose 回撥 通常用於關閉其他相關服務

    socket.onclose = function(){
        console.log('onclose')
        // websoket 終止了關閉其他相關的函式和服務
    }
複製程式碼

（完）

還有一個對 websokit 的封裝庫 socket.io 不過目前我還沒用過

相關文章