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将数据库中的TEXT类型数据动态赋值到TEXTAREA中
Apr 20 Javascript
JavaScript 节点操作 以及DOMDocument属性和方法
Dec 06 Javascript
根据邮箱的域名跳转到相应的登录页面的代码
Feb 27 Javascript
cookie中的path与domain属性详解
Dec 18 Javascript
JavaScript 表单处理实现代码
Apr 13 Javascript
在AngularJS中如何使用谷歌地图把当前位置显示出来
Jan 25 Javascript
jQuery.Uploadify插件实现带进度条的批量上传功能
Jun 08 Javascript
AngularJs expression详解及简单示例
Sep 01 Javascript
js 文字超出长度用省略号代替,鼠标悬停并以悬浮框显示实例
Dec 06 Javascript
JavaScript字符串_动力节点Java学院整理
Jun 27 Javascript
vue简单练习 桌面时钟的实现代码实例
Sep 19 Javascript
vue路由传参的基本实现方式小结【三种方式】
Feb 05 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/02/19 PHP
php批量更改数据库表前缀实现方法
2013/10/26 PHP
深入浅出php socket编程
2015/05/13 PHP
PHP简单获取网站百度搜索和搜狗搜索收录量的方法
2016/08/23 PHP
php变量与数组相互转换的方法(extract与compact)
2016/12/02 PHP
javascript模仿msgbox提示效果代码
2008/06/10 Javascript
JQuery 学习笔记 选择器之二
2009/07/23 Javascript
JavaScript DOM学习第一章 W3C DOM简介
2010/02/19 Javascript
Javascript实现简单二级下拉菜单实例
2014/06/15 Javascript
jQuery超精致图片轮播幻灯片特效代码分享
2015/09/10 Javascript
Javascript实现图片轮播效果(二)图片序列节点的控制实现
2016/02/17 Javascript
Vue.js中extend选项和delimiters选项的比较
2017/07/17 Javascript
基于Particles.js制作超炫粒子动态背景效果(仿知乎)
2017/09/13 Javascript
vue.js  父向子组件传参的实例代码
2017/10/29 Javascript
vue scroller返回页面记住滚动位置的实例代码
2018/01/29 Javascript
深入剖析Express cookie-parser中间件实现示例
2018/02/01 Javascript
利用SpringMVC过滤器解决vue跨域请求的问题
2018/02/10 Javascript
Vue利用canvas实现移动端手写板的方法
2018/05/03 Javascript
讲解vue-router之什么是嵌套路由
2018/05/28 Javascript
uni-app 组件里面获取元素宽高的实现
2019/12/27 Javascript
在项目vue中使用echarts的操作步骤
2020/09/07 Javascript
[47:04]EG vs RNG 2019国际邀请赛小组赛 BO2 第二场 8.16
2019/08/18 DOTA
Python的ORM框架SQLObject入门实例
2014/04/28 Python
Python的“二维”字典 (two-dimension dictionary)定义与实现方法
2016/04/27 Python
Python3使用requests登录人人影视网站的方法
2016/05/11 Python
使用python根据端口号关闭进程的方法
2018/11/06 Python
分享一个pycharm专业版安装的永久使用方法
2019/09/24 Python
用Python实现童年贪吃蛇小游戏功能的实例代码
2020/12/07 Python
乐天旅游台湾网站:Rakuten Travel TW
2017/06/01 全球购物
澳大利高级泳装品牌:Bondi Born
2018/05/23 全球购物
澳大利亚先进的皮肤和激光诊所购物网站:Soho Skincare
2018/10/15 全球购物
JSF如何进行表格处理及取值
2012/08/06 面试题
全陪导游词开场白
2015/05/29 职场文书
重阳节座谈会主持词
2015/07/03 职场文书
2016反腐倡廉警示教育心得体会
2016/01/13 职场文书
html5实现点击弹出图片功能
2021/07/16 HTML / CSS