Socket.IO 事件处理
Socket.IO事件处理
Socket.IO是基于事件的。可以使用服务器端的Socket对象访问一些保留事件:connect, message, disconnect, reconnect, ping, join and leave。客户端Socket对象还为我们提供了一些保留事件: connect, connect_error, connect_timeout, reconnect等。
在hello world示例中,我们使用连接并在用户连接离开时记录断开事件。现在,我们将使用消息事件将消息从服务器传递给客户端。为此,请修改io.on('connection',
这将在客户端连接后4秒将一个称为message的事件发送到我们的客户端。Socket对象上的send函数将与消息事件关联。
function(socket)) 调用,内容如下:
var app = require('express')();
var http = require('http').Server(app);
var io = require('socket.io')(http);
app.get('/', function(req, res){
res.sendfile('index.html');
});
io.on('connection', function(socket){
console.log('A user connected');
//Send a message after a timeout of 4seconds
setTimeout(function(){
socket.send('Sent a message 4seconds after connection!');
}, 4000);
socket.on('disconnect', function () {
console.log('A user disconnected');
});
});
http.listen(3000, function(){
console.log('listening on *:3000');
});现在我们需要在我们的客户端处理此事件。因此,编辑您的index.html脚本,代码如下:
<script>
var socket = io();
socket.on('message', function(data){document.write(data)});
</script>现在我们处理客户端上的message事件。当您现在在浏览器中访问页面时,将显示如下内容:

4秒钟后,服务器发送消息事件,我们的客户端将处理它并生成以下输出:

在本例中我们只发送了一个字符串,实际上我们也可以在任何事件中发送任何类型对象。
message是由API提供的一个内置事件,但在实际应用程序中使用不多,因为我们需要能够区分不同事件。Socket.IO提供了创建自定义事件的能力,您可以使用socket.emit函数创建和触发自定义事件。例如,下面的代码会发出一个名为testerevent的事件:
var app = require('express')();
var http = require('http').Server(app);
var io = require('socket.io')(http);
app.get('/', function(req, res){
res.sendfile('index.html');
});
io.on('connection', function(socket){
console.log('A user connected');
//Send a message when
setTimeout(function(){
//Sending an object when emmiting an event
socket.emit('testerEvent', { description: 'A custom event named testerEvent!'});
}, 4000);
socket.on('disconnect', function () {
console.log('A user disconnected');
});
});
http.listen(3000, function(){
console.log('listening on localhost:3000');
});要在客户端上处理此自定义事件,我们需要一个监听事件testerevent的侦听器。代码如下:
<!DOCTYPE html>
<html>
<head><title>Hello world</title></head>
<script src="/socket.io/socket.io.js"></script>
<script>
var socket = io();
socket.on('testerEvent', function(data){document.write(data.description)});
</script>
<body>Hello world</body>
</html>当您打开浏览器并转至localhost:3000时,您将看到如下内容:
Hello world
4秒后你会发现浏览器的内容变成:
A custom event named testerEvent!
我们也可以从客户端发出事件。要从客户端发出事件,请使用socket对象上的emit函数。
<!DOCTYPE html>
<html>
<head><title>Hello world</title></head>
<script src="/socket.io/socket.io.js"></script>
<script>
var socket = io();
socket.emit('clientEvent', 'Sent an event from the client!');
</script>
<body>Hello world</body>
</html>要处理这个事件,请修改服务器端的socket对象上的on函数:
var app = require('express')();
var http = require('http').Server(app);
var io = require('socket.io')(http);
app.get('/', function(req, res){
res.sendfile('index.html');
});
io.on('connection', function(socket){
socket.on('clientEvent', function(data){
console.log(data);
});
});
http.listen(3000, function(){
console.log('listening on localhost:3000');
});在浏览器中访问localhost:3000,您将得到一个名为clientevent的自定义事件。此事件将通过服务器端的日志输出:
Sent an event from the client!