WebSocket-Resources / websocket refactor

This commit provides the javascript complement to
[WebSocket-Resources](https://github.com/WhisperSystems/WebSocket-Resources),
allowing us to use a bi-directional request-response framework over
websockets.

See websocket-resources.js and websocket-resources_test.js
for usage details.

Along the way I also factored the websocket keepalive and reconnect
logic into its own file/wrapper object.
This commit is contained in:
lilia 2014-11-27 22:03:42 -08:00
parent ccbe837ca2
commit ee0d7edc0b
9 changed files with 324 additions and 91 deletions

View file

@ -21,6 +21,8 @@
<script type="text/javascript" src="js/protobufs.js"></script>
<script type="text/javascript" src="js/curve25519_compiled.js"></script>
<script type="text/javascript" src="js/nativeclient.js"></script>
<script type="text/javascript" src="js/websocket.js"></script>
<script type="text/javascript" src="js/websocket-resources.js"></script>
<script type="text/javascript" src="js/helpers.js"></script>
<script type="text/javascript" src="js/storage.js"></script>
<script type="text/javascript" src="js/storage/devices.js"></script>

View file

@ -131,6 +131,8 @@
<script type="text/javascript" src="js/protobufs.js"></script>
<script type="text/javascript" src="js/curve25519_compiled.js"></script>
<script type="text/javascript" src="js/nativeclient.js"></script>
<script type="text/javascript" src="js/websocket.js"></script>
<script type="text/javascript" src="js/websocket-resources.js"></script>
<script type="text/javascript" src="js/helpers.js"></script>
<script type="text/javascript" src="js/storage.js"></script>
<script type="text/javascript" src="js/storage/devices.js"></script>

View file

@ -303,91 +303,16 @@ window.textsecure.api = function () {
var getWebsocket = function(url, auth, reconnectTimeout) {
var URL = URL_BASE.replace(/^http/g, 'ws') + url + '/?';
var params = '';
if (auth) {
var user = textsecure.storage.getUnencrypted("number_id");
var password = textsecure.storage.getEncrypted("password");
var params = $.param({
login: '+' + getString(user).substring(1),
password: getString(password)
login: '+' + user.substring(1),
password: password
});
} else
var params = $.param({});
var keepAliveTimer;
var reconnectSemaphore = 0;
var socketWrapper = { onmessage: function() {}, ondisconnect: function() {}, onconnect: function() {} };
var connect = function() {
clearTimeout(keepAliveTimer);
reconnectSemaphore++;
if (reconnectSemaphore <= 0)
return;
if (socket) { socket.close(); }
var socket = new WebSocket(URL+params);
function resetKeepAliveTimer() {
clearTimeout(keepAliveTimer);
keepAliveTimer = setTimeout(function() {
socket.send(JSON.stringify({type: 1, id: 0}));
resetKeepAliveTimer();
}, 50000);
};
socket.onerror = function(socketEvent) {
console.log('Server is down :(');
reconnectSemaphore--;
setTimeout(function() { connect(); }, reconnectTimeout);
socketWrapper.ondisconnect();
};
socket.onclose = function(socketEvent) {
console.log('Server closed :(');
reconnectSemaphore--;
setTimeout(function() { connect(); }, reconnectTimeout);
socketWrapper.ondisconnect();
};
socket.onopen = function(socketEvent) {
console.log('Connected to server!');
socketWrapper.onconnect();
resetKeepAliveTimer();
};
//TODO: wrap onmessage so that we reconnect on missing pong
socket.onmessage = function(response) {
var blob = response.data;
var reader = new FileReader();
reader.addEventListener("loadend", function() {
// reader.result contains the contents of blob as a typed array
try {
var message = textsecure.protobuf.WebSocketMessage.decode(reader.result);
console.log(message);
if (message.type === textsecure.protobuf.WebSocketMessage.Type.REQUEST ) {
socketWrapper.onmessage(message.request);
}
else {
throw "Got invalid message from server: " + message;
}
} catch (e) {
console.log('Error parsing server JSON message: ' + response);
return;
}
});
reader.readAsArrayBuffer(blob);
resetKeepAliveTimer();
};
socketWrapper.send = function(msg) {
socket.send(msg);
}
};
connect();
return socketWrapper;
}
return window.textsecure.websocket(URL+params)
}
self.getMessageWebsocket = function() {

View file

@ -240,19 +240,14 @@ window.textsecure.replay = function() {
window.textsecure.subscribeToPush = function(message_callback) {
var socket = textsecure.api.getMessageWebsocket();
socket.onmessage = function(message) {
textsecure.protocol.decryptWebsocketMessage(message.body).then(function(plaintext) {
var resource = new WebSocketResource(socket, function(request) {
// TODO: handle different types of requests. for now we only receive
// PUT /messages <base64-encoded encrypted IncomingPushMessageSignal>
textsecure.protocol.decryptWebsocketMessage(request.body).then(function(plaintext) {
var proto = textsecure.protobuf.IncomingPushMessageSignal.decode(plaintext);
// After this point, a) decoding errors are not the server's fault, and
// b) we should handle them gracefully and tell the user they received an invalid message
console.log("Successfully decoded message with id: " + message.id);
socket.send(
new textsecure.protobuf.WebSocketMessage({
response: { id: message.id, message: 'OK', status: 200 },
type: textsecure.protobuf.WebSocketMessage.Type.RESPONSE
}).encode().toArrayBuffer()
);
request.respond(200, 'OK');
return textsecure.protocol.handleIncomingPushMessageProto(proto).then(function(decrypted) {
// Delivery receipt
@ -348,7 +343,7 @@ window.textsecure.subscribeToPush = function(message_callback) {
console.log("Error handling incoming message: ");
console.log(e);
});
};
});
};
window.textsecure.registerSingleDevice = function(number, verificationCode, stepDone) {

134
js/websocket-resources.js Normal file
View file

@ -0,0 +1,134 @@
/* vim: ts=4:sw=4:expandtab
*
* This program is free software: you can redistribute it and/or modify
* it under the terms of the GNU Lesser General Public License as published by
* the Free Software Foundation, either version 3 of the License, or
* (at your option) any later version.
*
* This program is distributed in the hope that it will be useful,
* but WITHOUT ANY WARRANTY; without even the implied warranty of
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
* GNU Lesser General Public License for more details.
*
* You should have received a copy of the GNU Lesser General Public License
* along with this program. If not, see <http://www.gnu.org/licenses/>.
*/
;(function(){
'use strict';
/*
* WebSocket-Resources
*
* Create a request-response interface over websockets using the
* WebSocket-Resources sub-protocol[1].
*
* var client = new WebSocketResource(socket, function(request) {
* request.respond(200, 'OK');
* });
*
* client.sendRequest({
* verb: 'PUT',
* path: '/v1/messages',
* body: '{ some: "json" }',
* success: function(message, status, request) {...},
* error: function(message, status, request) {...}
* });
*
* 1. https://github.com/WhisperSystems/WebSocket-Resources
*
*/
var Request = function(options) {
this.verb = options.verb || options.type;
this.path = options.path || options.url;
this.body = options.body || options.data;
this.success = options.success
this.error = options.error
this.id = options.id;
if (this.id === undefined) {
var bits = new Uint32Array(2);
window.crypto.getRandomValues(bits);
this.id = dcodeIO.Long.fromBits(bits[0], bits[1], true);
}
};
var IncomingWebSocketRequest = function(options) {
var request = new Request(options);
var socket = options.socket;
this.verb = request.verb;
this.path = request.path;
this.body = request.body;
this.respond = function(status, message) {
socket.send(
new textsecure.protobuf.WebSocketMessage({
type: textsecure.protobuf.WebSocketMessage.Type.RESPONSE,
response: { id: request.id, message: message, status: status }
}).encode().toArrayBuffer()
);
};
};
var outgoing = {};
var OutgoingWebSocketRequest = function(options, socket) {
var request = new Request(options);
outgoing[request.id] = request;
socket.send(
new textsecure.protobuf.WebSocketMessage({
type: textsecure.protobuf.WebSocketMessage.Type.REQUEST,
request: {
verb : request.verb,
path : request.path,
body : request.body,
id : request.id
}
}).encode().toArrayBuffer()
);
};
window.WebSocketResource = function(socket, handleRequest) {
this.sendRequest = function(options) {
return new OutgoingWebSocketRequest(options, socket);
};
socket.onmessage = function(socketMessage) {
var blob = socketMessage.data;
var reader = new FileReader();
reader.onload = function() {
var message = textsecure.protobuf.WebSocketMessage.decode(reader.result);
if (message.type === textsecure.protobuf.WebSocketMessage.Type.REQUEST ) {
handleRequest(
new IncomingWebSocketRequest({
verb : message.request.verb,
path : message.request.path,
body : message.request.body,
id : message.request.id,
socket : socket
})
);
}
else if (message.type === textsecure.protobuf.WebSocketMessage.Type.RESPONSE ) {
var response = message.response;
var request = outgoing[response.id];
if (request) {
request.response = response;
var callback = request.error;
if (response.status >= 200 && response.status < 300) {
callback = request.success;
}
if (typeof callback === 'function') {
callback(response.message, response.status, request);
}
} else {
throw 'Received response for unknown request ' + message.response.id;
}
}
};
reader.readAsArrayBuffer(blob);
};
};
}());

72
js/websocket.js Normal file
View file

@ -0,0 +1,72 @@
/* vim: ts=4:sw=4:expandtab
*
* This program is free software: you can redistribute it and/or modify
* it under the terms of the GNU Lesser General Public License as published by
* the Free Software Foundation, either version 3 of the License, or
* (at your option) any later version.
*
* This program is distributed in the hope that it will be useful,
* but WITHOUT ANY WARRANTY; without even the implied warranty of
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
* GNU Lesser General Public License for more details.
*
* You should have received a copy of the GNU Lesser General Public License
* along with this program. If not, see <http://www.gnu.org/licenses/>.
*/
;(function(){
'use strict';
/*
* var socket = textsecure.websocket(url);
*
* Returns an adamantium-reinforced super socket, capable of sending
* app-level keep alives and automatically reconnecting.
*
*/
window.textsecure.websocket = function (url) {
var socketWrapper = { onmessage: function() {}, ondisconnect: function() {} };
var socket;
var keepAliveTimer;
var reconnectSemaphore = 0;
var reconnectTimeout = 1000;
function resetKeepAliveTimer() {
clearTimeout(keepAliveTimer);
keepAliveTimer = setTimeout(function() {
socket.send(JSON.stringify({type: 1, id: 0}));
resetKeepAliveTimer();
}, 50000);
};
function reconnect(e) {
reconnectSemaphore--;
setTimeout(connect, reconnectTimeout);
socketWrapper.ondisconnect(e);
};
var connect = function() {
clearTimeout(keepAliveTimer);
if (++reconnectSemaphore <= 0) { return; }
if (socket) { socket.close(); }
socket = new WebSocket(url);
socket.onerror = reconnect;
socket.onclose = reconnect;
socket.onopen = resetKeepAliveTimer;
socket.onmessage = function(response) {
socketWrapper.onmessage(response);
resetKeepAliveTimer();
};
socketWrapper.send = function(msg) {
socket.send(msg);
}
};
connect();
return socketWrapper;
};
})();

View file

@ -100,6 +100,8 @@
<script type="text/javascript" src="js/protobufs.js"></script>
<script type="text/javascript" src="js/curve25519_compiled.js"></script>
<script type="text/javascript" src="js/nativeclient.js"></script>
<script type="text/javascript" src="js/websocket.js"></script>
<script type="text/javascript" src="js/websocket-resources.js"></script>
<script type="text/javascript" src="js/helpers.js"></script>
<script type="text/javascript" src="js/storage.js"></script>
<script type="text/javascript" src="js/storage/devices.js"></script>

View file

@ -126,6 +126,8 @@
<script type="text/javascript" src="../js/components.js"></script>
<script type="text/javascript" src="../js/protobufs.js" data-cover></script>
<script type="text/javascript" src="../js/websocket.js"></script>
<script type="text/javascript" src="../js/websocket-resources.js"></script>
<script type="text/javascript" src="../js/helpers.js" data-cover></script>
<script type="text/javascript" src="../js/storage.js"></script>
<script type="text/javascript" src="../js/storage/devices.js"></script>
@ -165,6 +167,7 @@
<script type="text/javascript" src="views/message_list_view_test.js"></script>
<script type="text/javascript" src="models/conversations_test.js"></script>
<script type="text/javascript" src="models/messages_test.js"></script>
<script type="text/javascript" src="websocket-resources_test.js"></script>
<script type="text/javascript" src="protocol_test.js"></script>
</body>
</html>

View file

@ -0,0 +1,98 @@
/* vim: ts=4:sw=4
*
* This program is free software: you can redistribute it and/or modify
* it under the terms of the GNU Lesser General Public License as published by
* the Free Software Foundation, either version 3 of the License, or
* (at your option) any later version.
*
* This program is distributed in the hope that it will be useful,
* but WITHOUT ANY WARRANTY; without even the implied warranty of
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
* GNU Lesser General Public License for more details.
*
* You should have received a copy of the GNU Lesser General Public License
* along with this program. If not, see <http://www.gnu.org/licenses/>.
*/
;(function() {
'use strict';
describe('WebSocket-Resource', function() {
it('receives requests and sends responses', function(done) {
// mock socket
var request_id = '1';
var socket = {
send: function(data) {
var message = textsecure.protobuf.WebSocketMessage.decode(data);
assert.strictEqual(message.type, textsecure.protobuf.WebSocketMessage.Type.RESPONSE);
assert.strictEqual(message.response.message, 'OK');
assert.strictEqual(message.response.status, 200);
assert.strictEqual(message.response.id.toString(), request_id);
done();
}
};
// actual test
var resource = new WebSocketResource(socket, function (request) {
assert.strictEqual(request.verb, 'PUT');
assert.strictEqual(request.path, '/some/path');
assertEqualArrayBuffers(request.body.toArrayBuffer(), new Uint8Array([1,2,3]).buffer);
request.respond(200, 'OK');
});
// mock socket request
socket.onmessage({
data: new Blob([
new textsecure.protobuf.WebSocketMessage({
type: textsecure.protobuf.WebSocketMessage.Type.REQUEST,
request: {
id: request_id,
verb: 'PUT',
path: '/some/path',
body: new Uint8Array([1,2,3]).buffer
}
}).encode().toArrayBuffer()
])
});
});
it('sends requests and receives responses', function(done) {
// mock socket and request handler
var request_id;
var socket = {
send: function(data) {
var message = textsecure.protobuf.WebSocketMessage.decode(data);
assert.strictEqual(message.type, textsecure.protobuf.WebSocketMessage.Type.REQUEST);
assert.strictEqual(message.request.verb, 'PUT');
assert.strictEqual(message.request.path, '/some/path');
assertEqualArrayBuffers(message.request.body.toArrayBuffer(), new Uint8Array([1,2,3]).buffer);
request_id = message.request.id;
}
};
// actual test
var resource = new WebSocketResource(socket, function() {});
resource.sendRequest({
verb: 'PUT',
path: '/some/path',
body: new Uint8Array([1,2,3]).buffer,
error: done,
success: function(message, status, request) {
assert.strictEqual(message, 'OK');
assert.strictEqual(status, 200);
done();
}
});
// mock socket response
socket.onmessage({
data: new Blob([
new textsecure.protobuf.WebSocketMessage({
type: textsecure.protobuf.WebSocketMessage.Type.RESPONSE,
response: { id: request_id, message: 'OK', status: 200 }
}).encode().toArrayBuffer()
])
});
});
});
}());