溫馨提示×

溫馨提示×

您好,登錄后才能下訂單哦!

密碼登錄×
登錄注冊×
其他方式登錄
點擊 登錄注冊 即表示同意《億速云用戶服務條款》

node中怎么優(yōu)雅使用Socket.IO模塊

發(fā)布時間:2022-11-23 09:33:26 來源:億速云 閱讀:124 作者:iii 欄目:web開發(fā)

本篇內(nèi)容介紹了“node中怎么優(yōu)雅使用Socket.IO模塊”的有關(guān)知識,在實際案例的操作過程中,不少人都會遇到這樣的困境,接下來就讓小編帶領(lǐng)大家學習一下如何處理這些情況吧!希望大家仔細閱讀,能夠?qū)W有所成!

Socket.IO的定義

Socket.IO是一個WebSocket庫,包括了客戶端的js服務器端的node.js,它的目標是構(gòu)建可以在不同瀏覽器和移動設(shè)備上使用的實時應用。

Socket.IO將WebSocket、AJAX和其它的通信方式全部封裝成了統(tǒng)一的通信接口,也就是說,我們在使用SocketIO時,不用擔心兼容問題,底層會自動選用最佳的通信方式。

Socket.IO的優(yōu)點

  • socket.io封裝了服務端和客戶端,使用起來非常簡單方便。

  • socket.io支持跨平臺,這就意味著你有了更多的選擇,可以在自己喜歡的平臺下開發(fā)實時應用。

  • socket.io可以自定義事件發(fā)送到對端,對端可以是服務器,可以是客戶端;使用emit發(fā)送,接收還是on。

  • 它會自動根據(jù)瀏覽器從WebSocket、AJAX長輪詢、Iframe流等等各種方式中選擇最佳的方式來實現(xiàn)網(wǎng)絡(luò)實時應用,非常方便和人性化,而且支持的瀏覽器最低達IE5.5。如果不支持websocket,可以自動降級為輪詢

node中安裝Socket.IO

打開終端,在終端中輸入以下代碼即可安裝Socket.IO模塊:

npm i socket.io

node中使用Socket.IO

emiton 是最重要的兩個api,分別對應 發(fā)送監(jiān)聽 事件.

我們可以非常自由的在服務端定義并發(fā)送一個事件emit,然后在客戶端監(jiān)聽 on,反過來也一樣。

發(fā)送的內(nèi)容格式也非常自由,既可以是基本數(shù)據(jù)類型 Number,String,Boolean 等,也可以是 Object,Array 類型,甚至還可以是函數(shù)。而用回調(diào)函數(shù)的方式則可以進行更便攜的交互。

emit

socket.emit(eventName[, ...args])發(fā)射(觸發(fā))一個事件

socket.emit('aaa','你好,前臺')

在這里以服務端為例子:在服務端中通過socket.emit()方法創(chuàng)立一個事件(第一個參數(shù):自定義事件)aaa,發(fā)送的信息(第二個參數(shù)) 你好,前臺.

注意: 第二個參數(shù)可以傳對象,因為在emit方法內(nèi)部帶有JSON.stringfy()方法,自動將對象轉(zhuǎn)化為字符串。

on

socket.on(eventName, callback)監(jiān)聽一個 emit 發(fā)射的事件

socket.on('aaa',(msg)=>{
	console.log(msg)
})

在這里以客戶端為例,客戶端監(jiān)聽服務端的事件aaa,隨后通過回調(diào)函數(shù)的方式打印出aaa傳過來的信息。

在express中引入使用

服務端

const server = require('http').createServer(app);
const io = require('socket.io')(server);
io.on('connection', socket => {
	console.log('恭喜你連接成功!')
	socket.on("message",(msg)=>{
		console.log(msg)  //你好 后臺
		//注意 : 這里的 io.emit() 是默認轉(zhuǎn)發(fā)給全部客戶端信息,所有客戶端都可以收到
		io.emit("allMsg","廣播 : 歡迎來到聊天室")
	})
});
server.listen(3000);

server當作參數(shù)傳入,目的在于說明io掛載的服務依舊是基于http的。
這里的代碼表示,只要連接成功,就會打印連接成功的信息!

客戶端

<script src="/socket.io/socket.io.js"></script>
<script>
  const socket = io();  //默認連接服務端啟動的本地端口地址
  socket.emit("message","你好 后臺")
  // 監(jiān)聽服務端的廣播事件,接收廣播的消息
  socket.on("allMsg",(msg)=>{
		console.log(msg)  //廣播 : 歡迎來到聊天室
  })
</script>

在客戶端需要單獨引用socket.io.js文件,因為socket.io不是瀏覽器內(nèi)置模塊,需要單獨引用,js文件內(nèi)部代碼 ==> socket.io.js內(nèi)部代碼,將這里的代碼復制到自己創(chuàng)建的js文件中,然后在客戶端中引用。
只要在客戶端中出現(xiàn)const socket = io(),瀏覽器將會直接默認連接到客戶端啟動的本地服務地址。

“node中怎么優(yōu)雅使用Socket.IO模塊”的內(nèi)容就介紹到這里了,感謝大家的閱讀。如果想了解更多行業(yè)相關(guān)的知識可以關(guān)注億速云網(wǎng)站,小編將為大家輸出更多高質(zhì)量的實用文章!

向AI問一下細節(jié)

免責聲明:本站發(fā)布的內(nèi)容(圖片、視頻和文字)以原創(chuàng)、轉(zhuǎn)載和分享為主,文章觀點不代表本網(wǎng)站立場,如果涉及侵權(quán)請聯(lián)系站長郵箱:is@yisu.com進行舉報,并提供相關(guān)證據(jù),一經(jīng)查實,將立刻刪除涉嫌侵權(quán)內(nèi)容。

AI