【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 .. ...
随机推荐
- Y - Design T-Shirt(第二季水)
Description Soon after he decided to design a T-shirt for our Algorithm Board on Free-City BBS, XKA ...
- Java解析和生成XML
1.Jaxb处理java对象和xml之间转换常用的annotation有: @XmlType @XmlElement @XmlRootElement @XmlAttribute @XmlAccesso ...
- css background-position:x% y%
规则1: background-position:xpx ypx; 为正值时:背景图片的左上顶点朝右下移动直至距离div的左上顶点为xpx ypx: 规则2: background-position: ...
- Ubuntu下搭建本地WordPress站点
想在本地搭建WordPress博客站点作测试用?本教程一步一步教您在Linux上搭建一个LAMP(Linux, Apache, MySQL, PHP)服务器并部署WordPress博客. 请注意在复制 ...
- 6 个轻量级并且灵活的 PHP CMS 系统
Anchor CMS Just like its introduction says, Anchor has a very simple UI. The installation takes lite ...
- C#7.0
C#7.0中有哪些新特性? 以下将是 C# 7.0 中所有计划的语言特性的描述.随着 Visual Studio “15” Preview 4 版本的发布,这些特性中的大部分将活跃起来.现在是时候来展 ...
- 基于verilog的FPGA编程经验总结(XILINX ISE工具)
1.用ISE仿真的时候.所用变量一定要初始化. ISE默认初始量为"XXXXX", 而Quarters是默认为"00000"的, 其实实际上, 下到FPGA里后 ...
- JBOSS尝鲜
环境搭建:1. jdk-6u16-windows-i586.exe2. jboss-5.1.0.GA-jdk6.zip JDK安装: 安装过程很简单,应该都知道怎么安装软件....安装完JDK后,需要 ...
- SQLiteDatabase里面的简单操作数据库的方法
1.使用insert方法插入记录SQLiteDatabase的insert方法的签名为long insert(String table,String nullColumnHack,ContentVal ...
- 神舟飞船上的计算机使用什么操作系统,为什么是自研发不是 Linux?
中国航天用的SpaceOS主要内容是仿造美国风河系统公司的VxWorks653(653是产品名,并非版本号). 先解释为什么用这个系统不用Linux: 航天器的内存和CPU都非常弱,弱到什么程度呢:天 ...