Improved websocket speed for MSTSC.js bitmaps.

Ylian Saint-Hilaire committed Jun 10, 2020 at 12:10 UTC 14c08ce461a07310ca9fd6ba7e06470baa0a01cd
2 files changed +38 -27
mstsc.js
+3 -1
@@ -84,7 +84,9 @@ module.exports.CreateMstscRelay = function (parent, db, ws, req, args, domain, u
84 }).on('connect', function () {
85 send(['rdp-connect']);
86 }).on('bitmap', function (bitmap) {
87 - send(['rdp-bitmap', bitmap]);
87 + try { ws.send(bitmap.data); } catch (ex) { } // Send the bitmap data as binary
88 + delete bitmap.data;
89 + send(['rdp-bitmap', bitmap]); // Send the bitmap metadata seperately, without bitmap data.
90 }).on('close', function () {
91 send(['rdp-close']);
92 }).on('error', function (err) {
public/mstsc/js/client.js
+35 -26
@@ -129,6 +129,7 @@
129 // start connection
130 var self = this;
131 this.socket = new WebSocket("wss://" + window.location.host + "/mstsc/relay.ashx");
132 + this.socket.binaryType = 'arraybuffer';
133 this.socket.onopen = function () {
134 console.log("WS-OPEN");
135 self.socket.send(JSON.stringify(['infos', {
@@ -145,33 +146,41 @@
146 }]));
147 };
148 this.socket.onmessage = function (evt) {
148 - var msg = JSON.parse(evt.data);
149 - switch (msg[0]) {
150 - case 'rdp-connect': {
151 - //console.log('[mstsc.js] connected');
152 - self.activeSession = true;
153 - break;
154 - }
155 - case 'rdp-bitmap': {
156 - var bitmap = msg[1];
157 - bitmap.data = new Uint8Array(bitmap.data.data).buffer;
158 - //console.log('[mstsc.js] bitmap update bpp : ' + bitmap.bitsPerPixel);
159 - self.render.update(bitmap);
160 - break;
161 - }
162 - case 'rdp-close': {
163 - //console.log('[mstsc.js] close');
164 - self.activeSession = false;
165 - next(null);
166 - break;
167 - }
168 - case 'rdp-error': {
169 - var err = msg[1];
170 - console.log('[mstsc.js] error : ' + err.code + '(' + err.message + ')');
171 - self.activeSession = false;
172 - next(err);
173 - break;
149 + if (typeof evt.data == 'string') {
150 + // This is a JSON text string, parse it.
151 + var msg = JSON.parse(evt.data);
152 + switch (msg[0]) {
153 + case 'rdp-connect': {
154 + //console.log('[mstsc.js] connected');
155 + self.activeSession = true;
156 + break;
157 + }
158 + case 'rdp-bitmap': {
159 + if (self.bitmapData == null) break;
160 + var bitmap = msg[1];
161 + bitmap.data = self.bitmapData; // Use the binary data that was sent earlier.
162 + delete self.bitmapData;
163 + //console.log('[mstsc.js] bitmap update bpp : ' + bitmap.bitsPerPixel);
164 + self.render.update(bitmap);
165 + break;
166 + }
167 + case 'rdp-close': {
168 + //console.log('[mstsc.js] close');
169 + self.activeSession = false;
170 + next(null);
171 + break;
172 + }
173 + case 'rdp-error': {
174 + var err = msg[1];
175 + console.log('[mstsc.js] error : ' + err.code + '(' + err.message + ')');
176 + self.activeSession = false;
177 + next(err);
178 + break;
179 + }
180 }
181 + } else {
182 + // This is binary bitmap data, store it.
183 + self.bitmapData = evt.data;
184 }
185 };
186 this.socket.onclose = function () {