Maison >interface Web >js tutoriel >Une brève analyse de la façon d'utiliser le module Socket.IO avec élégance dans le nœud
Comment utiliser le module Socket.IO dans
node ? L'article suivant vous présentera comment utiliser le module Socket.IO avec élégance dans node.js. J'espère qu'il vous sera utile !
Socket.IO est une bibliothèque WebSocket
, comprenant js côté client
et côté serveur node .js
, qui vise à créer des applications en temps réel pouvant être utilisées sur différents navigateurs et appareils mobiles. [Recommandations de didacticiel associées : WebSocket库
,包括了客户端的js
和服务器端的node.js
,它的目标是构建可以在不同浏览器和移动设备上使用的实时应用。【相关教程推荐:nodejs视频教程】
Socket.IO将WebSocket、AJAX和其它的通信方式
全部封装成了统一的通信接口
,也就是说,我们在使用SocketIO时,不用担心兼容问题,底层会自动选用最佳的通信方式
。
socket.io封装了服务端和客户端,使用起来非常简单方便。
socket.io支持跨平台,这就意味着你有了更多的选择,可以在自己喜欢的平台下开发实时应用。
socket.io可以自定义事件发送到对端,对端可以是服务器,可以是客户端;使用emit发送,接收还是on
。
它会自动根据浏览器从WebSocket、AJAX长轮询、Iframe流等等各种方式中选择最佳的方式来实现网络实时应用,非常方便和人性化,而且支持的浏览器最低达IE5.5。如果不支持websocket,可以自动降级为轮询
打开终端,在终端中输入以下代码即可安装Socket.IO模块:
npm i socket.io
emit
和 on
是最重要的两个api,分别对应 发送
和 监听
事件.
我们可以非常自由的在服务端
定义并发送一个事件emit
,然后在客户端
监听 on
,反过来也一样。
发送的内容格式
也非常自由,既可以是基本数据类型 Number,String,Boolean 等,也可以是 Object,Array 类型,甚至还可以是函数
。而用回调函数的方式则可以进行更便携的交互。
socket.emit(eventName[, ...args])
:发射(触发)一个事件
socket.emit('aaa','你好,前台')
在这里以
服务端
为例子:在服务端中通过socket.emit()
方法创立一个事件(第一个参数:自定义事件
)aaa
,发送的信息(第二个参数
)你好,前台
.
注意: 第二个参数可以传
对象
,因为在emit方法内部
带有JSON.stringfy()
方法,自动将对象转化为字符串。
socket.on(eventName, callback)
:监听一个 emit 发射的事件
socket.on('aaa',(msg)=>{ console.log(msg) })
在这里以
客户端
为例,客户端监听服务端的事件aaa
,随后通过回调函数的方式打印出aaa
传过来的信息。
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() 是默认转发给全部客户端信息,所有客户端都可以收到 io.emit("allMsg","广播 : 欢迎来到聊天室") }) }); server.listen(3000);
将
server
当作参数传入,目的在于说明io
挂载的服务依旧是基于http
的。
这里的代码表示,只要连接成功,就会打印连接成功的信息!
<script src="/socket.io/socket.io.js"></script> <script> const socket = io(); //默认连接服务端启动的本地端口地址 socket.emit("message","你好 后台") // 监听服务端的广播事件,接收广播的消息 socket.on("allMsg",(msg)=>{ console.log(msg) //广播 : 欢迎来到聊天室 }) </script>
在客户端需要单独引用
]🎜🎜Socket.IO encapsulesocket.io.js
文件,因为socket.io不是浏览器内置模块,需要单独引用,js文件内部代码 ==> socket.io.js内部代码,将这里的代码复制到自己创建的js文件中,然后在客户端中引用。
只要在客户端中出现const socket = io()
Tutoriel vidéo NodejsWebSocket, AJAX et d'autres méthodes de communication
dans uneinterface de communication unifiée
, c'est-à-dire, lorsque nous utilisez SocketIO, nousn'avons pas à nous soucier des problèmes de compatibilité, la couche inférieure choisira automatiquement la meilleure méthode de communication
. 🎜
🎜🎜🎜Avantages de Socket.IO🎜🎜🎜🎜🎜Installer Socket.IO dans node🎜🎜🎜Ouvrir le terminal, Entrez le code suivant dans le terminal pour installer le module Socket.IO :🎜rrreee
- 🎜socket.io encapsule le serveur et le le client est très simple et pratique à utiliser. 🎜
- 🎜socket.io prend en charge multiplateforme, ce qui signifie que vous avez plus de choix pour développer des applications en temps réel sur votre plateforme préférée. 🎜
- 🎜socket.io peut personnaliser les événements à envoyer au homologue, qui peut être un serveur ou un client ;
utilisez émettre pour envoyer, recevoir ou activer
. 🎜- 🎜Il choisira automatiquement la meilleure façon d'implémenter des applications réseau en temps réel basées sur le navigateur WebSocket, l'interrogation longue AJAX, le streaming Iframe, etc. Il est très pratique et convivial, et prend en charge Le navigateur minimum requis est IE5.5. Si Websocket n'est pas pris en charge, il peut être automatiquement rétrogradé vers
Polling
🎜
🎜🎜🎜Utilisez Socket.IO dans node🎜🎜🎜emit code> et <code>on
sont les deux API les plus importantes, correspondant respectivement aux événementssending
etlistening
🎜🎜On peut être très libre sur le <. code>serverDéfinissez etenvoyez un événement émis
, puis écoutezon
sur leclient
, et vice versa. 🎜🎜Leformat de contenu
envoyé est également très gratuit.peut être des types de données de base tels que Nombre, Chaîne, Booléen, etc., ou il peut être de type Objet, Tableau ou même une fonction.
. L'utilisation de fonctions de rappel permet une interaction plus portable. 🎜🎜🎜🎜emit🎜🎜🎜socket.emit(eventName[, ...args]):<code>Émettre (déclencher) un événement
🎜rrreee🎜Ici, prenonsserver
comme exemple : dans le serveur, passezsocket.emit( )
crée un événement (Premier paramètre : événement personnalisé
)aaa
, envoie des informations (Deuxième paramètre
)Bonjour, réception
.🎜🎜🎜Remarque : 🎜 Le deuxième paramètre peut être passé en tant que🎜🎜🎜on🎜🎜🎜objet
, car à l'intérieur de laméthode d'émission
Avec le MéthodeJSON.stringfy()
, elle convertit automatiquement les objets en chaînes. 🎜socket.on(eventName, callback) span> code> : <code>Écouter les événements émis par un émetteur
🎜rrreee🎜Ici, nous prenons leclient
comme exemple Le client écoute les événements sur le serveuraaa</code.> </blockquote>, puis imprimez les informations transmises par aaa
via la fonction de rappel. 🎜
🎜Passezserver
en paramètre pour montrer que le service monté pario
est toujours Il l'est basé surhttp
.
Le code ici indique que tant que la connexion est réussie, le message de réussite de la connexion sera imprimé ! 🎜
🎜Besoin de référencersocket.io.js
séparément sur le fichier code client>, car socket.io n'est pas un module intégré du navigateur et doit être référencé séparément, le code interne du fichier js ==> code interne de socket.io. js 🎜, copiez le code ici dans le fichier js que vous avez créé, puis référencez-le dans le client.
Tant queconst socket = io()
apparaît dans le client, le navigateur se connectera directement à l'adresse de service local démarrée par le client par défaut. 🎜
socket.io Ce module tiers est relativement plus pratique et efficace lors de l'écriture de code dans le module ws
模块中通过switch
分支来进行对不同的聊天类型
进行不同的方法呈现,而在socket.io
模块中仅仅通过自定义事件
就可以解决这个问题,并且socket.io可以在服务器断开后,当你再次进入客户端后可以自动连接,整体的表现优于ws
.
Pour plus de connaissances sur les nœuds, veuillez visiter : tutoriel Nodejs !
Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!