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. PLSQL developer连接不上64位Oracle的解决方法

    PLSQL developer连接不上64位Oracle的解决方法 64位下装Oracle 11g 64位,PLSQL Developer使用出现问题. 问题描述: 登录对话框中,数据库下拉框为空: ...

  2. 安装SQL Server 那些事儿

    SQL版本: Microsoft SQL Server2008 R2 RTM - Express with Advanced Services 错误描述: System.Configuration.C ...

  3. javascript DOM对象转jquery对象

    首先,假设一种情形:要在HTML文件中为一个select对象添加一个函数,这个函数的名字叫dynamic_change(this),当select的option被改变的时候调用onchange事件来处 ...

  4. Pyhton 操作MySQL数据库

         MySQL数据库的接口程序下载地址:https://sourceforge.net/projects/mysql-python/ 操作数据库的大致步骤如下: 1:首先先创建一个数据库的连接对 ...

  5. javaWeb实现使用邮箱邮件找回密码功能

    JSP+Jmail+JavaBean 发邮件(转)2010-08-23 18:052007年04月14日 14:32/* * SendMail.java * * Created on 2007年3月3 ...

  6. 64位系统ADB

    应该把ADB文件放在C:\Windows\SysWOW64目录下面,而不是System32下.

  7. 关于机器学习－EM算法新解

    我希望自己能通俗地把它理解或者说明白,但是,EM这个问题感觉真的不太好用通俗的语言去说明白,因为它很简单,又很复杂.简单在于它的思想,简单在于其仅包含了两个步骤就能完成强大的功能,复杂在于它的数学推理 ...

  8. 普通的101键盘在Mac上的键位对应

    为了方便,搞了一个普通的101有线全键盘 + Magic TrackPad配Macbook.        然后发现了一个小问题,按键对应似乎不像我想的那么完美,F1~F12和Macbook不对应,于 ...

  9. DELPHI7如何调用带参数的JAVA WebService

    对方提供的WebService地址是http://192.168.1.6:8080/test/pic?XH=XX用DELPHI如何调呢 ------解决方案--------------------通过 ...

  10. HDU4432 Sum of Divisors

    涉及知识点: 1. 进制转换. 2. 找因子时注意可以降低复杂度. Sum of divisors Time Limit: 2000/1000 MS (Java/Others)    Memory L ...