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 相关文章推荐
用apply让javascript函数仅执行一次的代码
Jun 27 Javascript
jQuery EasyUI API 中文文档 - ValidateBox验证框
Oct 06 Javascript
JavaScript中的apply和call函数详解
Jul 20 Javascript
js拆分字符串并将分割的数据放到数组中的方法
May 06 Javascript
js实现仿京东2级菜单效果(带延时功能)
Aug 27 Javascript
微信小程序 地图定位简单实例
Oct 14 Javascript
Vuex模块化实现待办事项的状态管理
Mar 15 Javascript
vue单页面打包文件大?首次加载慢?nginx带你飞,从7.5M到1.3M蜕变过程(推荐)
Jan 16 Javascript
angular2实现统一的http请求头方法
Aug 13 Javascript
layui禁用侧边导航栏点击事件的解决方法
Sep 25 Javascript
js实现详情页放大镜效果
Oct 28 Javascript
何时使用Map来代替普通的JS对象
Apr 29 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
php获取数组中重复数据的两种方法
2013/06/28 PHP
ThinkPHP CURD方法之table方法详解
2014/06/18 PHP
20个2014年最优秀的PHP框架回顾
2014/10/22 PHP
php图像验证码生成代码
2017/06/08 PHP
jquery实现简单合拢与展开网页面板的方法
2015/09/01 Javascript
使用JQuery实现Ctrl+Enter提交表单的方法
2015/10/22 Javascript
js获取Html元素的实际宽度高度的方法
2016/05/19 Javascript
用JavaScript和jQuery实现瀑布流
2017/03/19 Javascript
正则表达式基本语法及表单验证操作详解【基于JS】
2017/04/07 Javascript
node.js中TCP Socket多进程间的消息推送示例详解
2018/07/10 Javascript
对layui中表单元素的使用详解
2018/08/15 Javascript
如何去除富文本中的html标签及vue、react、微信小程序中的过滤器
2018/11/21 Javascript
jQuery实现动态添加和删除input框实例代码
2019/03/26 jQuery
微信小程序组件传值图示过程详解
2019/07/31 Javascript
electron踩坑之remote of undefined的解决
2020/10/06 Javascript
python多线程socket编程之多客户端接入
2017/09/12 Python
Django REST framework内置路由用法
2019/07/26 Python
python爬虫开发之urllib模块详细使用方法与实例全解
2020/03/09 Python
利用Python实现斐波那契数列的方法实例
2020/07/26 Python
Lombok插件安装(IDEA)及配置jar包使用详解
2020/11/04 Python
CSS3中的content属性使用示例
2015/07/20 HTML / CSS
HTML5 canvas实现雪花飘落特效
2016/03/08 HTML / CSS
瑞士最大的图书贸易公司:Orell Füssli
2019/12/28 全球购物
财务会计专业毕业生自荐信
2013/10/19 职场文书
安全生产先进个人总结
2015/02/15 职场文书
2015年爱牙日活动总结
2015/03/23 职场文书
幼儿园大班开学寄语(2015秋季)
2015/05/27 职场文书
小王子读书笔记
2015/06/29 职场文书
2015中学政教处工作总结
2015/07/22 职场文书
八年级作文之感恩
2019/11/22 职场文书
Django显示可视化图表的实践
2021/05/10 Python
提取视频中的音频 Python只需要三行代码!
2021/05/10 Python
mysql数据库入门第一步之创建表
2021/05/14 MySQL
关于Mybatis中SQL节点的深入解析
2022/03/19 Java/Android
Python OpenCV实现图像模板匹配详解
2022/04/07 Python
Python 统计序列中元素的出现频度
2022/04/26 Python