webSocket

什麼是webSocket?

WebSocket 是 HTML5 開始提供的一種在單個 TCP 連接上進行全雙工通訊的協議。

WebSocket 使得客戶端和服務器之間的數據交換變得更加簡單,允許服務端主動向客戶端推送數據。在 WebSocket API 中,瀏覽器和服務器只需要完成一次握手,兩者之間就直接可以創建持久性的連接,並進行雙向數據傳輸。

webSocket的原理圖?

                                 

webSocket的基本使用

 客戶端:

    //建立連接 
    const ws = new webScoket('ws://localhost:9999')
    //監聽關閉
    ws.onclose = ()=>{
        console.log(客戶端關閉連接")
    }
    
    //發送數據
    btn.onclick = function(){
        ws.send(msg.value)
    }

    //接收服務器返回的數據
    ws.onmessage = (remsg) =>{
        console.log(remsg.data)
    }

    服務端 - node.js - app.js

       //引入依賴
      const ws = require('nodejs-websocket');

      //建立連接
      const wserver = ws.createServer(websocket=>{

         // 錯誤處理
         websocket.on('err',err=> {
             if(err) throw err
         })

          // 關閉連接
         websocket.on('close',()=> {
             console.log("服務器連接已經關閉")
         })

          // 錯誤處理
         websocket.on('err',err=> {
             if(err) throw err
         })

         接收客戶端發送數據
         websocket.on('text',msg=>{
             console.log(msg)

             //返回給客戶端
             websocket.sendText()
         })
      })


      wserver.listen(9999)

      console.log('服務器建立連接成功')

//發送信息
socket.emit('自定義事件',發送數據)

//接收信息
socket.on('自定義事件',(data)=>{
//data - 接收到的數據
})

//廣播數據
io.sockets.emit('自定義事件',廣播數據)

發佈了56 篇原創文章 · 獲贊 12 · 訪問量 4279
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章