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.小试牛刀的更多相关文章

  1. 【socket.io研究】3.手机网页间聊天核心问题

    前面我们已经说了服务器相关的一些内容,且又根据官网给出的一个例子写了一个可以聊天的小程序,但是这还远远不够呀,这只能算是应用前的准备工作.接下来,一起来考虑完善一个小的聊天程序吧. 首先,修改服务器的 ...

  2. 【socket.io研究】1.官网的一些相关说明，概述

    socket.io是什么? 官网的解释是一个实时的,基于事件的通讯框架,可以再各个平台上运行,关注于效率和速度. 在javascript,ios,android,java中都实现了,可以很好的实现实时 ...

  3. 【socket.io研究】0.前提准备

    WebSocket出现之前,web实时推送,一般采用轮询和Comet技术(可细分为长轮询机制和流技术两种),需要大量http请求,服务器受不了.HTML5定义了WebSocket协议,基于TCP协议, ...

  4. 在web浏览器上显示室内温度（nodeJs+arduino+socket.io）

    上次的nodejs操作arduino入门篇中实现了如何连接arduino.这次我们来实现通过arduino测量室内温度并在浏览器上显示出来. [所需材料] 硬件:LM35温度传感器,arduino u ...

  5. 使用Node.js+Socket.IO搭建WebSocket实时应用

    Web领域的实时推送技术,也被称作Realtime技术.这种技术要达到的目的是让用户不需要刷新浏览器就可以获得实时更新.它有着广泛的应用场景,比如在线聊天室.在线客服系统.评论系统.WebIM等. W ...

  6. socket.io简单入门(一.实现简单的图表推送）

    引子:随着nodejs蓬勃发展,虽然主要业务系统因为架构健壮性不会选择nodejs座位应用服务器.但是大量的内部系统却可以使用nodejs试水,大量的前端开发人员转入全堆开发也是一个因素. 研究本例主 ...

  7. （转）使用Node.js+Socket.IO搭建WebSocket实时应用

    Web领域的实时推送技术,也被称作Realtime技术.这种技术要达到的目的是让用户不需要刷新浏览器就可以获得实时更新.它有着广泛的应用场景,比如在线聊天室.在线客服系统.评论系统.WebIM等. W ...

  8. node.js + socket.io实现聊天室一

    前段时间,公司打算在社区做一个聊天室.决定让我来做.本小白第一次做聊天类功能,当时还想着通过ajax请求来实现.经过经理提示,说试试当前流行的node.js 和socket.io来做.于是就上网学习研 ...

  9. Node.js 和Socket.IO 实现chat WEBIM

    socket官方:   http://socket.io/  需求:实现WEB IM功能,数据从服务器PUSH  不是PULL  websocket是基于HTML5的新特性,不兼容IE6,7,8 .. ...

随机推荐

  1. PHP+mysql统计排名第几位

    正在开发积分系统!其中有一项数据是显示用户积分排名?一下子想不到太好的办法! 最简的情况是统一某一字段的积分数据排名?比如积分字段,里面存的整数! 如何排名?或者说如何获得他在排序中的序列位次呢? s ...

  2. Visual Studio调试之断点基础篇

    Visual Studio调试之断点基础篇 我曾经问过很多人,你一般是怎么调试你的程序的? F9, F5, F11, F…… 有很多书和文章都是介绍怎么使用Visual Studio编写WinForm ...

  3. yarn资源调度（网络搜集）

    本文转自:http://www.itweet.cn/2015/07/24/yarn-resources-manager-allocation/ Hadoop YARN同时支持内存和CPU两种资源的调度 ...

  4. Chrome下的语音控制框架MyVoix.js使用篇（四）

    在上一篇博文中,我为大家介绍了myvoix.js中的smart learning模块,以及何如使用该功能.(myvoix.js的源码地址会在每一篇文章末尾放出) 文本将拓展 Chrome下的语音控制框 ...

  5. CSS5.4 安装问题集

    由于手痒,将5.2 卸载了,装了5.4 出现如下错误:install failed to install com.ti.ccstudio.debugserver.win32 corrctly. ... ...

  6. the smallest positive number

    2520 is the smallest number that can be divided by each of the numbers from 1 to 10 without any rema ...

  7. Gridview将某列内容和标题隐藏起来

    protected void gvInfo_RowDataBound(object sender, GridViewRowEventArgs e) { if (e.Row.RowType == Dat ...

  8. Keil C51对同一端口的连续读取方法

    C语言是当前举世公认的高效简洁而又非常贴近硬件的编程语言之一.将C语言向单片机MCS-51上的移植始于2O世纪8O年代的中后期,经过近1O年的发展,C语言克服了产生代码过长.运行速度较慢的缺点,并且由 ...

  9. elasticsearch 重启后,需要的操作

    如果elasticsearch 集群挂了,请勿开启Logstash 同步数据,需等待elasticsearch集群恢复后,在继续写入

  10. SQL-Duplicate Emails

    思路: 两种思路,可以给当成两个表也可以给当成一张表来做 group by就是按照某个属性给表分个组,然后having语句的含义是“对于每一个group”怎么怎么样 补充知识:count(column ...