【socket.io研究】2.小试牛刀
1.建立个项目,也就是文件夹,这里使用testsocket
2.创建文件package.json,用于描述项目:
{
"name":"testsocket",
"version":"0.0.1",
"description":"my first nodejs app",
"dependencies":{
"express":"~4.10.2",,
"socket.io":"~1.2.0"
}
}
3.创建index.js
var app = require('express')();
//Express初始化变量app,作为方法应用于http服务
var http = require('http').Server(app);
var io = require('socket.io')(http);
//定义一个路由方法'/'用作我们访问网站首页的返回结果
app.get('/', function(req, res){
res.sendFile(__dirname + '/index.html');
console.log('new link:', req);
});
io.on('connection', function(socket){
socket.on('chat message', function(msg){
io.emit('chat message', msg);
console.log('message: ' + msg);
});
});
//监听服务器3000端口
http.listen(3000, function(){
console.log('listening on *:3000');
});
4.创建index.html
<!doctype html>
<html>
<head>
<title>Socket.IO chat</title>
<style>
* { margin: 0; padding: 0; box-sizing: border-box; }
body { font: 13px Helvetica, Arial; }
form { background: #000; padding: 3px; position: fixed; bottom: 0; width: 100%; }
form input { border: 0; padding: 10px; width: 90%; margin-right: .5%; }
form button { width: 9%; background: rgb(130, 224, 255); border: none; padding: 10px; }
#messages { list-style-type: none; margin: 0; padding: 0; }
#messages li { padding: 5px 10px; }
#messages li:nth-child(odd) { background: #eee; }
</style>
</head>
<body>
<ul id="messages"></ul>
<form action="">
<input id="m" autocomplete="off" /><button>Send</button>
</form>
<script src="https://cdn.socket.io/socket.io-1.2.0.js"></script>
<script src="http://code.jquery.com/jquery-1.11.1.js"></script>
<script>
var myid = Math.floor(Math.random() * 100) + 1;
var socket = io('/'); $('form').submit(function(){
socket.emit('chat message', myid + ' says: ' + $('#m').val());
$('#m').val('');
return false;
}); socket.on('chat message', function(msg){
$('#messages').append($('<li>').text(msg));
}); </script>
</body>
</html>
5.执行
安装:
npm install –save express
npm install –save socket.io
node index.js
浏览器中访问127.0.0.1:3000
6.先实现这些功能再说其他的东西吧
demo下载地址:http://files.cnblogs.com/files/renyuzhuo/testsocket.zip
【socket.io研究】2.小试牛刀的更多相关文章
- 【socket.io研究】3.手机网页间聊天核心问题
前面我们已经说了服务器相关的一些内容,且又根据官网给出的一个例子写了一个可以聊天的小程序,但是这还远远不够呀,这只能算是应用前的准备工作.接下来,一起来考虑完善一个小的聊天程序吧. 首先,修改服务器的 ...
- 【socket.io研究】1.官网的一些相关说明,概述
socket.io是什么? 官网的解释是一个实时的,基于事件的通讯框架,可以再各个平台上运行,关注于效率和速度. 在javascript,ios,android,java中都实现了,可以很好的实现实时 ...
- 【socket.io研究】0.前提准备
WebSocket出现之前,web实时推送,一般采用轮询和Comet技术(可细分为长轮询机制和流技术两种),需要大量http请求,服务器受不了.HTML5定义了WebSocket协议,基于TCP协议, ...
- 在web浏览器上显示室内温度(nodeJs+arduino+socket.io)
上次的nodejs操作arduino入门篇中实现了如何连接arduino.这次我们来实现通过arduino测量室内温度并在浏览器上显示出来. [所需材料] 硬件:LM35温度传感器,arduino u ...
- 使用Node.js+Socket.IO搭建WebSocket实时应用
Web领域的实时推送技术,也被称作Realtime技术.这种技术要达到的目的是让用户不需要刷新浏览器就可以获得实时更新.它有着广泛的应用场景,比如在线聊天室.在线客服系统.评论系统.WebIM等. W ...
- socket.io简单入门(一.实现简单的图表推送)
引子:随着nodejs蓬勃发展,虽然主要业务系统因为架构健壮性不会选择nodejs座位应用服务器.但是大量的内部系统却可以使用nodejs试水,大量的前端开发人员转入全堆开发也是一个因素. 研究本例主 ...
- (转)使用Node.js+Socket.IO搭建WebSocket实时应用
Web领域的实时推送技术,也被称作Realtime技术.这种技术要达到的目的是让用户不需要刷新浏览器就可以获得实时更新.它有着广泛的应用场景,比如在线聊天室.在线客服系统.评论系统.WebIM等. W ...
- node.js + socket.io实现聊天室一
前段时间,公司打算在社区做一个聊天室.决定让我来做.本小白第一次做聊天类功能,当时还想着通过ajax请求来实现.经过经理提示,说试试当前流行的node.js 和socket.io来做.于是就上网学习研 ...
- Node.js 和Socket.IO 实现chat WEBIM
socket官方: http://socket.io/ 需求:实现WEB IM功能,数据从服务器PUSH 不是PULL websocket是基于HTML5的新特性,不兼容IE6,7,8 .. ...
随机推荐
- Mysql中存储方式的区别
MySQL的表属性有:MyISAM 和 InnoDB 2种存储方式: MyISAM 不支持事务回滚 InnoDB 支持事务回滚 可以用 show create table tablename 命令看表 ...
- centos 安装php
1.yum安装 yum install php php-fpm php-common php-gd php-mcrypt php-pear php-pecl-memcache php-mhash ph ...
- SQL Server 中的SET XACT_ABORT各种用法及显示结果
源地址:http://www.cnblogs.com/rob0121/articles/2320932.html 点击进入 默认行为:默认为SET XACT_ABORT OFF,没有事务行为. S ...
- JS滚动条下拉事件
<script type="text/javascript"> window.onscroll = function(){ var t = document.docum ...
- 文成小盆友python-num12 Redis发布与订阅补充,python操作rabbitMQ
本篇主要内容: redis发布与订阅补充 python操作rabbitMQ 一,redis 发布与订阅补充 如下一个简单的监控模型,通过这个模式所有的收听者都能收听到一份数据. 用代码来实现一个red ...
- django初探
如果是自己建站耍的话,还是用Php方便,毕竟Php服务器便宜又到处都是. 但是python毕竟是一个新鲜的东西,特别是django,以前一直东python的语法,而且是我最早学习的语言之一,但是一直停 ...
- C#中out的一种用法
1.当希望方法返回多个值时,声明out 方法很有用. 这样使方法可以有选择地返回值. using System; using System.Collections.Generic; using Sys ...
- cat查看proc下文件帮助
cat boot_mode 查看cpu版本 cat cmdline cat cpuinfo 查看cup详细信息 cat devices cat diskstats cat dma-mappings c ...
- C#数据类型汇总
通用类型系统 C#中,变量是值还是引用仅取决于数据类型 所有的数据类型都是对象.因为它们具有自己ide方法和属性 int int_value = 101; //调用*int_value*的比较方法与整 ...
- 找出指定目录下,大于指定大小的文件(LINUX SHELL)
当前目录下: find ./ -size +2048k |xargs du -b|awk '{print $1/1024/1024 "M" $2}'|sort -n ...... ...