摘要:簡介是的一個模塊,他提供通過進行通信的一種簡單方式,協議很復雜,但是提供了服務器和客戶端雙方的組件,所以只需要一個模塊就可以給應用程序加入對的支持。而且還能支持不同的瀏覽器。它們之間有什么區別呢區別在于的是持久性的。
環境:Node v8.2.1; Npm v5.3.0; OS Windows10
在web開發中,我們使用HTTP協議,HTTP協議是基于文本的“單向”通訊機制,當我們想要從服務端獲取數據的時候目前首選當然是Ajax,Ajax無疑是動態Web頁面的一個重大發展,他不再需要我們即使更新一點內容,也需要刷新整個頁面了,但是當我們在服務端將數據推送到客戶端的時候,Ajax就顯得力不從心了。如果我們使用Socket構建一個雙向的機制,那么服務端向客戶端推送數據也就簡單了。
1、Socket.IO簡介Socket.IO是Node.js的一個模塊,他提供通過WebSocket進行通信的一種簡單方式,WebSocket協議很復雜,但是Socket.IO提供了服務器和客戶端雙方的組件,所以只需要一個模塊就可以給應用程序加入對WebSocket的支持。而且還能支持不同的瀏覽器。
【API手冊】
server.js
const http = require("http"), io = require("socket.io"); const server = http.createServer((req, res) => { res.end(); }).listen(3000); // 交由 Socket.io 接管 const socket=io.listen(server); // 客戶端socket連接時 socket.on("connection",client=>{ console.log("web connected"); })
上面代碼中,當客戶端連接時,服務端會同時觸發兩個事件:server.onRequest 和 Socket.onConnection。它們之間有什么區別呢?區別在于 Socket 的是持久性的。
index.html
上面代碼中,我們先執行server.js,然后再瀏覽器中訪問index.html的時候控制臺會打印"web connected"
2.2 向客戶端推送數據server.js
const http = require("http"), io = require("socket.io"); const server = http.createServer((req, res) => { res.end(); }).listen(3000); const socket = io.listen(server); socket.on("connection", client => { client.send("welcome") })
上面服務端代碼,在有客戶端socket成功連接之后會向客戶端推送一個“welcome”。
index.html
2.3 廣播消息
上面是對單個客戶端的消息推送,當我們有客戶端連接的時候如果我們想對所有正在連接的客戶端發送消息的時候,也就是廣播消息。Socket.IO中提供了API可以很簡單的實現廣播
server.js
const http = require("http"), io = require("socket.io"); const server = http.createServer((req, res) => { res.end(); }).listen(3000); const socket = io.listen(server); socket.on("connection", client => { //廣播消息 client.broadcast.send("新用戶上線了"); })
【注意!!】這兒的廣播消息不會廣播自己
2.4 多個Socket連接上面的例子中都是一個頁面只有一個Socket的連接,這兒列舉一個多Socket連接的例子
server.js
const http = require("http"), io = require("socket.io"); const server = http.createServer((req, res) => { res.end(); }).listen(3000); const socket = io.listen(server); //針對特定的socket連接 socket.of("/hello").on("connection",client=>{ client.send("hello") }) socket.of("/msg").on("connection",client=>{ client.send("msg") })
index.html
上面代碼中在一個頁面中建立了兩個WebSocket連接
END
文章版權歸作者所有,未經允許請勿轉載,若此文章存在違規行為,您可以聯系管理員刪除。
轉載請注明本文地址:http://specialneedsforspecialkids.com/yun/88955.html
摘要:但是,反過來卻是不可能的服務器端發生了一個事件,服務器無法將這個事件的信息實時主動通知它的客戶端。這種做法是無奈之舉,實際上對服務器客戶端雙方都造成了大量的性能浪費。用于發送,用戶接受。 HTTP HTTP無法輕松實現實時應用: HTTP協議是無狀態的,服務器只會響應來自客戶端的請求,但是它與客戶端之間不具備持續連接。 我們可以非常輕松的捕獲瀏覽器上發生的事件(比如用戶點擊了盒子),...
摘要:異步最佳實踐避免回調地獄前端掘金本文涵蓋了處理異步操作的一些工具和技術和異步函數。 Nodejs 連接各種數據庫集合例子 - 后端 - 掘金Cassandra Module: cassandra-driver Installation ... 編寫 Node.js Rest API 的 10 個最佳實踐 - 前端 - 掘金全文共 6953 字,讀完需 8 分鐘,速讀需 2 分鐘。翻譯自...
摘要:當數據發生變化,便將數據發送給。與網絡應用中,兩個應用程序同時需要向對方發送消息的能力即全雙工通信,所利用到的技術就是,其能夠提供端對端的通信。其不僅支持,還支持許多種輪詢機制以及其他實時通信方式,并封裝了通用的接口。 WebSocket 與 Socket.IO 最近小組在做一個智慧交通的項目,其中有個 分享屏幕 的功能,即一個 client 能夠將自己當前的頁面分享到另外一個 cli...
摘要:但是需要注意的一點是協議是建立在協議基礎之上的,需要經過一次握手。所以連接的發起方仍是客戶端。是一個簡潔而靈活的應用框架提供一系列強大特性幫助你創建各種應用。這也是為什么要采用協議來實現聊天室的原因。 從開始寫到完善差不多斷斷續續差不多半個月時間,雖然還沒有打到想要的效果但還是階段性總結一下。(下一步加入打算視頻通訊功能)本文默認你已掌握 node 相關基礎知識 GitHub地址:ht...
閱讀 2928·2021-10-14 09:42
閱讀 3694·2021-08-11 11:19
閱讀 3542·2019-08-30 13:57
閱讀 3120·2019-08-30 13:49
閱讀 1534·2019-08-29 18:38
閱讀 898·2019-08-29 13:16
閱讀 1850·2019-08-26 13:25
閱讀 3230·2019-08-26 13:24