Socket.io+Nodejs通讯实例
具体源码:Socket
目录结构
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";
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>

- 发送消息按钮用来给服务端发送信息,触发服务端定义的hi事件。
- 离开页面按钮用来离开页面,也就是socket会自动断开。触发服务端定义的disconnect。
Socket.io+Nodejs通讯实例的更多相关文章
- 利用socket.io+nodejs打造简单聊天室
代码地址如下:http://www.demodashi.com/demo/11579.html 界面展示: 首先展示demo的结果界面,只是简单消息的发送和接收,包括发送文字和发送图片. ws说明: ...
- nodejs+socket.io即时聊天实例
在这之前你应该先安装好 Node.js,安装过程不再讲解 首先在你的电脑上创建一个新目录,姑且命名为 chat,然后在该目录创建两个文件,分别是 app.js 和 index.html. app.js ...
- angular + socket.io+nodejs
一.服务器端: 基本和nodejs工程相同 https://www.cnblogs.com/xuanmanstein/p/10509445.html 安装socket.io npm i --save ...
- 使用socket.io打造公共聊天室
最近的计算机网络课上老师开始讲socket,tcp相关的知识,当时脑袋里就蹦出一个想法,那就是打造一个聊天室.实现方式也挺多的,常见的可以用C++或者Java进行socket编程来构建这么一个聊天室. ...
- 基于react+react-router+redux+socket.io+koa开发一个聊天室
最近练手开发了一个项目,是一个聊天室应用.项目虽不大,但是使用到了react, react-router, redux, socket.io,后端开发使用了koa,算是一个比较综合性的案例,很多概念和 ...
- socket.io,远程控制你的幻灯片
原文:http://www.cnblogs.com/xiezhengcai/p/3964455.html 中秋休息了几天,今天又开始捣鼓socket.io了.今天的任务是通过socket.io控制你的 ...
- socket.io,环境搭建 & Hello world
原文:http://www.cnblogs.com/xiezhengcai/p/3955827.html socket.io 一个与服务器实时通信的工具,它与原生的webSocket相比,具有更可靠. ...
- node.js和socket.io纯js实现的即时通讯实例分享
在这个例子中,其实node.js并没有真正起到服务器的作用,因为我们这里可以直接运行client.html文件,而不用输入url请求,当 然,要想输入url请求页面内容还需要加入请求静态文件的代码.这 ...
- NodeJs多进程和socket.io通讯-DEMO
一.开启多进程 const os = require('os'); const cp = require('child_process'); const forkList = {}; const fo ...
随机推荐
- mustache.js使用基本(三)
作者:zccst 本节要点是子模块(partials)和分隔符(delimiter)等 1,子模块(partials) /* {{>partials}}以>开始表示子模块,如{{> ...
- keil mdk中如何确保某一段程序不被优化掉(转)
源:keil mdk中如何确保某一段程序不被优化掉 使用mdk编程,假如有一个有用的函数你定义了但是没有显式的调用,mdk在默认方式下,将会把这个函数从整个程序总删除掉,以节省ROM. 比如,你在RO ...
- ARM-LINUX学习笔记-1
安装完linux之后记得系统更新,更新使用apt命令,如下(记得使用之前使用sudo -i 指令切换到root用户模式) apt-get update 更新系统软件源,相当于查找更新 apt-get ...
- echarts 系列一
由于近期项目需要做地图方便的可视化图标,经过比较最终选定echarts. echarts在可视化视图方面非常强大,可以满足大多数开发需求. 采用标签式引入js文件,引用的js 文件位置 echarts ...
- MySQL远程登陆错误
远程连接 mySql数据库会提示10061.1045错误或 2003-Can’t connect to MySQL on ’192.168.1.2’(10061),这个原因是因为MySQL不准许远程连 ...
- <转>SQL的执行顺序
SQL 不同于与其他编程语言的最明显特征是处理代码的顺序.在大数编程语言中,代码按编码顺序被处理,但是在SQL语言中,第一个被处理的子句是FROM子句,尽管SELECT语句第一个出现,但是几乎总是最后 ...
- 【转】国外程序员收集整理的PHP资源大全
ziadoz在 Github发起维护的一个PHP资源列表,内容包括:库.框架.模板.安全.代码分析.日志.第三方库.配置工具.Web 工具.书籍.电子书.经典博文等等.伯乐在线对该资源列表进行了翻译, ...
- UILabel常用属性小结
标签常用的属性: (1)frame属性:设置标签的位置与大小. frame = CGRectMake(CGFloat x, CGFloat y, CGFloat width, CGFloat heig ...
- log4j的用法
1.导入 2.在src下新建log4j.properties,内容如下 log4j.rootLogger=DEBUG, A1 ,R log4j.appender.A1=org.apache.log4j ...
- Linux内核探索之路——关于方法
转载自:http://blog.chinaunix.net/uid-20608849-id-3014502.html Linux内核实践之路 -给那些想从Linux内核找点乐趣的人 一个不能回避的 ...