node中socket.io的事件使用详解


Posted in Javascript onDecember 15, 2014

socket.io类库不但可以相互发送消息,而且还可以通过socket端口对象的emit方法互相发送事件.

emit在之前的事件上说过现在一句话带过:emit是用来手动触发事件的.

socket.emit(event,data,function(data1,data2......){

});

在使用emit方法发送事件时,可以再另一端使用socket端口对象的on方法会once方法监听.

socket.on(event,function(data,fn){

});

socket.once(event,function(data,fn){

})

上面的回调函数中的参数data:对方发送的事件中携带的数据,

fn:对方在发送事件时指定的callback回调函数.

案例1:当服务器和客户端连接后,向客户端发送一个news事件,事件中携带一个对象,该对象的hello属性值为"你好".在接收到客户端发送my other event事件时,在控制台中输出"服务器端就收到数据"+客户端发送事件中携带的数据.

服务器端代码,server.js

 var http=require("http");

 var sio=require("socket.io");

 var fs=require("fs");

 var server=http.createServer(function (req,res) {

     res.writeHead(200,{"Content-type":"text/html"});

     res.end(fs.readFileSync("./index.html"));

 });

 server.listen(1337);

 var socket=sio.listen(server);

 socket.on("connection", function (socket) {

     socket.emit("news",{hello:"你好"});

     socket.on("my other event", function (data) {

         console.log("服务器端接受到信息%j",data);

     });

 });

客户端index.html代码:

 <!DOCTYPE html>

 <html>

 <head lang="en">

     <meta charset="UTF-8">

     <title></title>

     <script src="/socket.io/socket.io.js"></script>

     <script>

         var socket=io.connect();

         socket.on("news", function (data) {

             console.log(data.hello);

             socket.emit("my other event",{my:"data"});

         });        

     </script>

 </head>

 <body>

 

 </body>

运行结果:、
 

node中socket.io的事件使用详解
可以发现一点:执行总是在监听端,而不是手动执行端.

案例2:在手动触发对方事件时,指定回调函数.

当客户端和服务端连接后,向客户端发送setName事件,事件携带"张三",触发事件时,指定一个回调函数,该回调函数向控制台输出2个参数值.

 var http=require("http");

 var sio=require("socket.io");

 var fs=require("fs");

 var server=http.createServer(function (req,res) {

     res.writeHead(200,{"Content-type":"text/html"});

     res.end(fs.readFileSync("./index.html"));

 });

 server.listen(1337);

 var socket=sio.listen(server);

 socket.on("connection", function (socket) {

     socket.emit("setName","张三", function (data1,data2) {

         console.log(data1);

         console.log(data2);

     });

 });
 <!DOCTYPE html>

 <html>

 <head lang="en">

     <meta charset="UTF-8">

     <title></title>

     <script src="/socket.io/socket.io.js"></script>

     <script>

         var socket=io.connect();

         socket.on("setName", function (name,fn) {

            console.log(name);

             fn("李四","王五");

         });      

     </script>

 </head>

 <body>

 

 </body>

 </html>

执行结果:

node中socket.io的事件使用详解

回调函数实在触发端执行的.

Javascript 相关文章推荐
javascript代码运行不出来执行错误的可能情况整理
Oct 18 Javascript
js实现checkbox全选和反选示例
May 01 Javascript
JavaScript中this关键词的使用技巧、工作原理以及注意事项
May 20 Javascript
JavaScript声明变量时为什么要加var关键字
Sep 29 Javascript
JS基于FileSystemObject创建一个指定路径的TXT文本文件
Aug 05 Javascript
基于jQuery实现咖啡订单管理简单应用
Feb 10 Javascript
JS+html5制作简单音乐播放器
Sep 13 Javascript
详解vue-cli中的ESlint配置文件eslintrc.js
Sep 25 Javascript
Vue.directive使用注意(小结)
Aug 31 Javascript
Vue表单输入绑定的示例代码
Nov 01 Javascript
详解VUE调用本地json的使用方法
May 15 Javascript
layui 数据表格 根据值(1=业务,2=机构)显示中文名称示例
Oct 26 Javascript
node.js中使用socket.io的方法
Dec 15 #Javascript
Lua表达式和控制结构学习笔记
Dec 15 #Javascript
如何在node的express中使用socket.io
Dec 15 #Javascript
node.js中使用socket.io制作命名空间
Dec 15 #Javascript
node.js中的fs.fstatSync方法使用说明
Dec 15 #Javascript
node.js中的fs.fstat方法使用说明
Dec 15 #Javascript
node.js中的fs.readFileSync方法使用说明
Dec 15 #Javascript
You might like
判“新”函数:得到今天与明天的秒数
2006/10/09 PHP
小偷PHP+Html+缓存
2006/12/20 PHP
PHP面向接口编程 耦合设计模式 简单范例
2011/03/23 PHP
深入解析PHP的引用计数机制
2013/06/14 PHP
php实现执行某一操作时弹出确认、取消对话框
2013/12/30 PHP
php中cookie实现二级域名可访问操作的方法
2014/11/11 PHP
php array_key_exists() 与 isset() 的区别
2016/10/24 PHP
php桥接模式应用案例分析
2019/10/23 PHP
网页javascript精华代码集
2007/01/24 Javascript
JsRender for index循环索引用法详解
2014/10/31 Javascript
JavaScript中数组的合并以及排序实现示例
2015/10/24 Javascript
基于JQuery及AJAX实现名人名言随机生成器
2017/02/10 Javascript
微信小程序开发之改变data中数组或对象的某一属性值
2018/07/05 Javascript
node.js到底要不要加分号浅析
2018/07/11 Javascript
vue.js 实现评价五角星组件的实例代码
2018/08/13 Javascript
React 父子组件通信的实现方法
2019/12/05 Javascript
JS中的模糊查询功能
2019/12/08 Javascript
vue页面引入three.js实现3d动画场景操作
2020/08/10 Javascript
[00:12]DAC SOLO赛卫冕冠军 VG.Paparazi灬展现SOLO技巧
2018/04/06 DOTA
[43:33]EG vs Spirit Supermajor 败者组 BO3 第一场 6.4
2018/06/05 DOTA
Python实现分割文件及合并文件的方法
2015/07/10 Python
python的numpy模块安装不成功简单解决方法总结
2017/12/23 Python
python3.5 tkinter实现页面跳转
2018/01/30 Python
python实现树形打印目录结构
2018/03/29 Python
Python之list对应元素求和的方法
2018/06/28 Python
Python爬虫动态ip代理防止被封的方法
2019/07/07 Python
Python @property使用方法解析
2019/09/17 Python
PyTorch的SoftMax交叉熵损失和梯度用法
2020/01/15 Python
h5移动端调用支付宝、微信支付的实现
2020/06/08 HTML / CSS
关于.NET, HTML的五个问题
2012/08/29 面试题
高校十八大报告感想
2014/01/27 职场文书
浪漫婚礼主持词
2014/03/14 职场文书
年终考核实施方案
2014/05/26 职场文书
现场施工员岗位职责
2015/04/11 职场文书
2015最新婚礼主持词
2015/06/30 职场文书
css filter和getUserMedia的联合使用
2022/02/24 HTML / CSS