每天看一片代码系列(二):WebSocket-Node
简介
我们都知道,websocket主要是通过在浏览器和服务端建立长连接,继而实现二者的相互数据通信。不同于HTTP的轮询,它不会有大量无效的HTTP消息交换,从而节省了花销。websocket其实就是双通道的TCP连接。
很明显地,整个工作分为两个步骤,即创建连接和发送数据。那么连接是怎么建立的呢?其实只需要在浏览器和服务器端做一个握手的动作就可以了。而这个握手其实还是一个HTTP请求,只是接下来的工作就和HTTP没关系了。
这个HandShake的请求消息大致为:
GET /chat HTTP/1.1
Host: example.com:8000
Upgrade: websocket
Connection: Upgrade
Sec-WebSocket-Key: dGhlIHNhbXBsZSBub25jZQ==
Sec-WebSocket-Version: 13
而响应的消息大致为:
HTTP/1.1 101 Switching Protocols
Upgrade: websocket
Connection: Upgrade
Sec-WebSocket-Accept: s3pPLMBiTxaQ9kYGzzhZRbK+xOo=
HTTP里面的upgrade头部代表要从HTTP协议切换到另一个协议,或者是更换一个不同版本的HTTP。而Sec-WebSocket-Key和Sec-WebSocket-Accept是用来进行验证的字段。后者是前者经过一系列操作计算出来的,用来给客户端判断响应和请求是否匹配。
使用WebSocket-Node
首先我们体验一下“websocket-node"这个库的用法。
其实用这个库就是为了创建一个websocket-server,在app.js中,我们创建即可。
var port = 3001; var websocketServer = require(‘websocket‘).server; var http = require(‘http‘); // 创建httpServer var httpServer = http.createServer(); httpServer.listen(port, function () { console.log(new Date() + " Http Server is listening on " + port); }); //创建WebSocketServer var wsServer = new websocketServer({ httpServer: httpServer }); wsServer.on(‘request‘, function (request) { console.log(new Date() + " connection from origin: " + request.origin + ‘ .‘); //建立连接 var connection = request.accept(‘example‘, request.origin); //向客户端发送消息 connection.sendUTF("Connection from " + request.origin); connection.on(‘close‘, function () { console.log(connection.remoteAddress + " disconnected."); }) //收消息 connection.on(‘message‘, function (message) { try{ connection.sendUTF("Server accpected: " + message.utf8Data); }catch(e){ } }) })
在浏览器中,就和这个库没什么关系了,直接用浏览器支持的API创建Websocket客户端,收发消息即可。
var wsServer = "ws://localhost:3001"; var ws = new WebSocket(wsServer, ‘example‘); ws.onopen = function (e) { var msg = "hello Server!"; ws.send(msg) && print(msg); } ws.onclose = function (e) { var msg = "closed connection"; print(msg); } ws.onmessage = function (e) { var msg = "received : " + e.data; print(msg); }
源码解析
源码有多个文件,我们只关注WebSocketServer.js,地址
首先,在传入的配置中必须要绑定一个httpServer用于握手。当客户端建立连接时,首先会进行握手,会触发server的upgrade事件,从而进入到服务端的处理函数中去。在这个函数中,会创建一个wsRequest对象,并将它作为request事件的参数发送出去。接下来根据客户端的Accept情况来进入到handleRequestAccepted,接下来connect事件会被触发。
var upgradeHandler = this._handlers.upgrade; this.config.httpServer.forEach(function(httpServer) { httpServer.on(‘upgrade‘, upgradeHandler); }); handleUpgrade: var wsRequest = new WebSocketRequest(socket, request, this.config); try { wsRequest.readHandshake(); } wsRequest.once(‘requestAccepted‘, this._handlers.requestAccepted); wsRequest.once(‘requestResolved‘, this._handlers.requestResolved); if (!this.config.autoAcceptConnections && utils.eventEmitterListenerCount(this, ‘request‘) > 0) { this.emit(‘request‘, wsRequest); } handleRequestAccepted: this.connections.push(connection); this.emit(‘connect‘, connection);
另外,WebsocketServer继承了EventEmitter,所以具有事件处理的能力:
util.inherits(WebSocketServer, EventEmitter);
郑重声明:本站内容如果来自互联网及其他传播媒体,其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享,并不代表本站赞同其观点和对其真实性负责,也不构成任何其他建议。