用socket.io实现WebSocket的一个简单例子

biyeah

浏览: 202866 次
来自: ...

最近访客更多访客>>

xmgcoffee

wangxinxiang

ChangHongJian

cpongo1

博主相关

博客

微博

相册

留言

关于我

文章分类

社区版块

存档分类

博客分类：

nodejs

websocket javascript

用socket.io实现WebSocket的一个简单例子

客户端代码：

<html>
<head>
    <title></title>
    <script src="../js/socket.io.client.js"></script>
    <script type="text/javascript">
        function doit() {
            var socket = io.connect('http://localhost');
            socket.on('news', function (data) {//接收到服务器发送过来的名为'new'的数据
                console.log(data.hello);//data为应服务器发送过来的数据。
                socket.emit('my new event', { my:'new data' });//向服务器发送数据，实现双向数据传输
            });
            socket.on('other', function (data) {//接收另一个名为'other'数据，
                console.log(data.hello);
                socket.emit('event1', { my:'other data' });
            });
        }
    </script>
</head>
<body>
<button id='btn' onclick="doit()">click me</button>
</body>
</html>

在chrome，Crtl+Shift+j打开终端，可看到输出结果。
socket.io.client.js可以https://github.com/LearnBoost/socket.io-client下载到本地，在<script src="..">指向本机的js库。

服务器用nodejs实现
代码

var http= require('http'), io= require('socket.io'), express= require('express');
var app = express.createServer(), io = io.listen(app);

app.listen(80);

io.sockets.on('connection', function (socket) {
  socket.emit('news', { hello: 'world' });//监听，一旦客户端连接上，即发送数据，第一个参数'new'为数据名，第二个参数既为数据
  socket.on('my other event', function (data) {//捕获客户端发送名为'my other event'的数据
    console.log(data.my);
  });

  socket.emit('other', { hello: 'other world' });//发送另一个数据
  socket.on('evnet1', function (data) {//捕获另外一个数据
    console.log(data.my);
  });
});

测试结果，客户端可正常显示

引用

world
other world

服务器端显示结果：

引用

C:\java\Nodejs>node server2.js
   info - socket.io started
   debug - client authorized
   info - handshake authorized 15551970622100878177
   debug - setting request GET /socket.io/1/websocket/15551970622100878177
   debug - set heartbeat interval for client 15551970622100878177
   debug - client authorized for
   debug - websocket writing 1::
   debug - websocket writing 5:::{"name":"news","args":[{"hello":"world"}]}
   debug - websocket writing 5:::{"name":"other","args":[{"hello":"other world"}
]}
   debug - emitting heartbeat for client 15551970622100878177
   debug - websocket writing 2::
   debug - set heartbeat timeout for client 15551970622100878177
   debug - got heartbeat packet
   debug - cleared heartbeat timeout for client 15551970622100878177
   debug - set heartbeat interval for client 15551970622100878177
^C

分享到：

nowjs和nodejs实现服务器端与客户端实时数 ... | ruby与javascript面向对象编程的比较

2011-12-07 10:47
浏览 40008
评论(3)
分类:Web前端
查看更多

3 楼赤道螞蟻 2014-07-22

如果是數據庫有定時任務，定時更新表的數據。表中數據變化時，主動發消息給web頁面，該怎麼做呢？？

2 楼 cwalet 2013-05-10

在世界的中心呼喚愛写道

提示找不到 express

npm install express
另外，有些IO API已经deprecated，改成：

var http= require('http'), io= require('socket.io');
var app = http.createServer(), io = io.listen(app);
app.listen(81);

这样就可以不必引用express

1 楼在世界的中心呼喚愛 2013-01-22

提示找不到 express

发表评论

您还没有登录,请您登录后再发表评论

最近访客更多访客>>

博主相关

文章分类

社区版块

存档分类

最新评论