Nodejs+Socket.io实现通讯实例代码


Posted in NodeJs onFebruary 13, 2017

目录结构

D:.
 │ package.json
 │ server.js
 │
 └─public
 index.html
 socket.io.js

需要的条件

  • socket.io.js 供前端界面初始化io
  • socket.io 供NodeJs端提供socket方法

socket.io.js存在于socket.io-client

socket.io存在于socket.io

演示的功能

  • 客户端发送消息给服务端
  • 后端触发事件告知客户端
  • 客户端离开触发服务端事件

服务端

server.js

var express = require('express'); 
var app = express();

var server = require('http').createServer(app);
var io = require('socket.io')(server);

app.use('/', express.static(__dirname + '/public')); 

server.listen(80);

//socket部分
io.on('connection', function(socket) {
  //接收并处理客户端的hi事件
  socket.on('hi', function(data) {
    console.log(data);

    //触发客户端事件c_hi
    socket.emit('c_hi','hello too!')
  })

  //断开事件
  socket.on('disconnect', function(data) {
    console.log('断开',data)
    socket.emit('c_leave','离开');
    //socket.broadcast用于向整个网络广播(除自己之外)
    //socket.broadcast.emit('c_leave','某某人离开了')
  })

});
  • connection用来处理socket链接事件
  • disconnect处理连接断开事件
  • 后端接受前端事件通过socket.on(EventName,function(date){})
  • 后端触发前端事件通过socket.emit(EventName,msg)

这个后端演示了,前端发送消息给后端,触发hi事件,hi事件通过回调在触发客户端定义的c_hi事件告知前端。

客户端

index.html

<!DOCTYPE html>
<html>

<head>
  <title>socket</title>
</head>

<body>


<button id="sendBtn">发送消息</button>

<button id="leaveBtn">离开</button>

</body>
<script type="text/javascript" src="./socket.io.js"></script>
<script type="text/javascript">
  var socket=io.connect('localhost:80'),//与服务器进行连接
    send=document.getElementById('sendBtn'),
    leave=document.getElementById('leaveBtn');

  send.onclick=function(){
    socket.emit('hi', 'hello!');
  }

  leave.onclick=function(){
    window.location.href="about:blank" rel="external nofollow" ;
    window.close()
    socket.emit('leave', 'leave');
  }

  //接收来自服务端的信息事件c_hi
  socket.on('c_hi',function(msg){
    alert(msg)
  })

  // socket.on('c_leave',function(msg){
  //   alert(msg)
  // })

</script>

</html>

Nodejs+Socket.io实现通讯实例代码

  • 发送消息按钮用来给服务端发送信息,触发服务端定义的hi事件。
  • 离开页面按钮用来离开页面,也就是socket会自动断开。触发服务端定义的disconnect。

源码下载:Socket_3water.rar

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

NodeJs 相关文章推荐
利用NodeJS的子进程(child_process)调用系统命令的方法分享
Jun 05 NodeJs
利用NodeJS和PhantomJS抓取网站页面信息以及网站截图
Nov 18 NodeJs
nodejs实现黑名单中间件设计
Jun 17 NodeJs
用nodejs搭建websocket服务器
Jan 23 NodeJs
nodejs个人博客开发第三步 载入页面
Apr 12 NodeJs
Nodejs中Express 常用中间件 body-parser 实现解析
May 22 NodeJs
Nodejs+angularjs结合multiparty实现多图片上传的示例代码
Sep 29 NodeJs
Nodejs处理异常操作示例
Dec 25 NodeJs
nodejs微信开发之授权登录+获取用户信息
Mar 17 NodeJs
nodejs中实现用户注册路由功能
May 20 NodeJs
nodejs提示:cross-device link not permitted, rename错误的解决方法
Jun 10 NodeJs
Node.js实现爬取网站图片的示例代码
Apr 04 NodeJs
Nodejs高扩展性的模板引擎 functmpl简介
Feb 13 #NodeJs
Nodejs 发送Post请求功能(发短信验证码例子)
Feb 09 #NodeJs
Nodejs实现短信验证码功能
Feb 09 #NodeJs
Express与NodeJs创建服务器的两种方法
Feb 06 #NodeJs
使用nodejs下载风景壁纸
Feb 05 #NodeJs
nodeJs链接Mysql做增删改查的简单操作
Feb 04 #NodeJs
nodejs基础应用
Feb 03 #NodeJs
You might like
PHP删除目录及目录下所有文件的方法详解
2013/06/06 PHP
thinkphp中session和cookie无效的解决方法
2014/12/19 PHP
PHP下用Swoole实现Actor并发模型的方法
2019/06/12 PHP
javascript Zifa FormValid 0.1表单验证 代码打包下载
2007/06/08 Javascript
JavaScript 创建对象
2009/07/17 Javascript
JavaScript入门之事件、cookie、定时等
2011/10/21 Javascript
用JavaScript修改CSS属性的代码
2013/05/06 Javascript
Javascript合并表格中具有相同内容单元格示例
2013/08/11 Javascript
浏览器环境下JavaScript脚本加载与执行探析之defer与async特性
2016/01/14 Javascript
JQuery手速测试小游戏实现思路详解
2016/09/20 Javascript
vue 组件高级用法实例详解
2018/04/11 Javascript
JS实现的透明度渐变动画效果示例
2018/04/28 Javascript
JS实现求字符串中出现最多次数的字符和次数示例
2019/07/05 Javascript
关于vue项目中搜索节流的实现代码
2019/09/17 Javascript
js常用方法、检查是否有特殊字符串、倒序截取字符串操作完整示例
2020/01/26 Javascript
在Vue中实现随hash改变响应菜单高亮
2020/03/09 Javascript
vue.js实现双击放大预览功能
2020/06/23 Javascript
Vue 组件注册全解析
2020/12/17 Vue.js
Python操作MySQL数据库的方法
2018/06/20 Python
浅谈flask源码之请求过程
2018/07/26 Python
matplotlib给子图添加图例的方法
2018/08/03 Python
Django代码性能优化与Pycharm Profile使用详解
2018/08/26 Python
Python使用psutil获取进程信息的例子
2019/12/17 Python
html5播放视频且动态截图实现步骤与代码(支持safari其他未测试)
2013/01/06 HTML / CSS
微信小程序“圣诞帽”的实现思路详解
2017/12/28 HTML / CSS
ZINVO手表官网:男士和女士手表
2019/03/10 全球购物
世界上最大的艺术社区:SAA
2020/12/30 全球购物
结婚邀请函范文
2014/01/14 职场文书
大专毕业自我鉴定
2014/02/04 职场文书
英语三分钟演讲稿
2014/08/19 职场文书
“四风”问题对照检查材料思想汇报
2014/09/16 职场文书
迎新晚会主持词开场白
2015/05/28 职场文书
小学大队干部竞选稿
2015/11/20 职场文书
如何使用flask将模型部署为服务
2021/05/13 Python
正确使用MySQL INSERT INTO语句
2021/05/26 MySQL
Android 中的类文件和类加载器详情
2022/06/05 Java/Android