JavaScript之WebSocket技术详解(2)

上面代码的回调函数接受一个参数req,表示request请求对象。然后,在回调函数内部,建立WebSocket连接connection。接着,就要对connection的message事件指定回调函数。

wsServer.on(‘request', function(r){ connection = req.accept(‘echo-protocol', req.origin);

<span>connection</span><span>.</span><span>on</span><span>(</span><span>'message'</span><span>,</span> <span>function</span><span>(</span><span>message</span><span>)</span> <span>{</span> <span>var</span> <span>msgString</span> <span>=</span> <span>message</span><span>.</span><span>utf8Data</span><span>;</span> <span>connection</span><span>.</span><span>sendUTF</span><span>(</span><span>msgString</span><span>);</span> <span>});</span> });

最后,监听用户的disconnect事件。

connection.on('close', function(reasonCode, description) { console.log(connection.remoteAddress + ' disconnected.'); });

使用ws模块,部署一个简单的WebSocket服务器非常容易。

var WebSocketServer = require('ws').Server; var wss = new WebSocketServer({ port: 8080 }); wss.on('connection', function connection(ws) { ws.on('message', function incoming(message) { console.log('received: %s', message); }); ws.send('something'); });

Socket.io简介

Socket.io是目前最流行的WebSocket实现,包括服务器和客户端两个部分。它不仅简化了接口,使得操作更容易,而且对于那些不支持WebSocket的浏览器,会自动降为Ajax连接,最大限度地保证了兼容性。它的目标是统一通信机制,使得所有浏览器和移动设备都可以进行实时通信。

第一步,在服务器端的项目根目录下,安装socket.io模块。

$ npm install socket.io

第二步,在根目录下建立app.js,并写入以下代码(假定使用了Express框架)。

var app = require('express')(); var server = require('http').createServer(app); var io = require('socket.io').listen(server); server.listen(80); app.get('https://www.jb51.net/', function (req, res) { res.sendfile(__dirname + '/index.html'); });

上面代码表示,先建立并运行HTTP服务器。Socket.io的运行建立在HTTP服务器之上。

第三步,将Socket.io插入客户端网页。

<script src="https://www.jb51.net/socket.io/socket.io.js"></script>

然后,在客户端脚本中,建立WebSocket连接。

var socket = io.connect('http://localhost:80');

由于本例假定WebSocket主机与客户端是同一台机器,所以connect方法的参数是。接着,指定news事件(即服务器端发送news)的回调函数。

socket.on('news', function (data){ console.log(data); });

最后,用emit方法向服务器端发送信号,触发服务器端的anotherNews事件。

socket.emit('anotherNews');

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:https://www.heiqu.com/wzzfwz.html