2013-02-23 8 views
6

Ho un'applicazione server node.js e un client browser. L'invio del browser dati ArrayBuffer -> server funziona perfettamente, ma il server -> browser genera una stringa "[object ArrayBuffer]" ricevuta. Questo succede nelle ultime versioni di Chrome e Firefox.Ricezione dati WebSocket ArrayBuffer nel browser - stringa ricevente invece

Server:

var serverPort = 9867; 

// dependencies 
var webSocketServer = require('websocket').server; 
var http = require('http'); 
var players = {}; 
var nextPlayerId = 0; 

// create http server 
var server = http.createServer(function(request, response) { }); 
server.listen(serverPort, function() { 
    console.log((new Date()) + " Server is listening on port " + serverPort); 
}); 

// create websocket server 
var wServer = new webSocketServer({ httpServer: server }); 
// connection request callback 
wServer.on('request', function(request) { 
    var connection = request.accept(null, request.origin); 
    connection.binaryType = "arraybuffer"; 
    var player = {}; 
    player.connection = connection; 
    player.id = nextPlayerId; 
    nextPlayerId++; 
    players[player.id] = player; 
    console.log((new Date()) + ' connect: ' + player.id); 

    // message received callback 
    connection.on('message', function(message) { 
     if (message.type == 'binary' && 'binaryData' in message && message.binaryData instanceof Buffer) { 
      // this works! 
      console.log('received:'); 
      console.log(message); 

     } 
    }); 

    // connection closed callback 
    connection.on('close', function(connection) { 
     console.log((new Date()) + ' disconnect: ' + player.id); 
     delete players[player.id]; 
    }); 
}); 

function loop() { 
    var byteArray = new Uint8Array(2); 
    byteArray[0] = 1; 
    byteArray[0] = 2; 
    for (var index in players) { 
     var player = players[index]; 
     console.log('sending: '); 
     console.log(byteArray.buffer); 
     player.connection.send(byteArray.buffer); 
    } 
} 

timerId = setInterval(loop, 500); 

Cliente:

<!DOCTYPE html> 
<html> 
    <head> 
    </head> 
    <body> 
    <script type="text/javascript"> 

     window.WebSocket = window.WebSocket || window.MozWebSocket; 
     var connection = new WebSocket('ws://127.0.0.1:9867'); 
     connection.binaryType = "arraybuffer"; 

     // most important part - incoming messages 
     connection.onmessage = function (event) { 
     document.getElementById("log").innerHTML += typeof(event.data) + ' '; 
     document.getElementById("log").innerHTML += event.data + ' ';  
     if (event.data instanceof ArrayBuffer) { 
      // string received instead of a buffer 
     } 
     }; 

     window.onkeydown = function(e) { 
     var byteArray = new Uint8Array(2); 
     byteArray[0] = 1; 
     byteArray[1] = e.keyCode; 
     connection.send(byteArray.buffer); 
     }; 
    </script> 

    <div id='log'>Log: </div> 
    </body> 
</html> 

Che cosa sto facendo di sbagliato?

Edit:

Dalla sorgente websocket node.js:

WebSocketConnection.prototype.send = function(data, cb) { 
    if (Buffer.isBuffer(data)) { 
     this.sendBytes(data, cb); 
    } 
    else if (typeof(data['toString']) === 'function') { 
     this.sendUTF(data, cb); 
    } 

Quindi, se si utilizza un Uint8Array, invia i dati come una stringa, invece di usare sendBytes, come sendBytes esigenze un oggetto Buffer. Come nella risposta qui sotto, ho bisogno di sendBytes. Come non posso passare un ArrayBuffer-sendBytes, ho fatto questo sul server:

function loop() { 
    var buffer = new Buffer(2); 
    buffer[0] = 1; 
    buffer[1] = 2; 
    for (var index in players) { 
     var player = players[index]; 
     console.log('sending: '); 
     console.log(buffer); 
     player.connection.send(buffer); 
    } 
} 

Ora funziona.

Conclusione:

Mentre Chrome e Firefox WebSockets .send() un buffer Uint8Array come dati binari, sembra Node.JS WebSockets inviano come dati string, ed è necessario un buffer Buffer per inviare binario.

+0

Dato che ArrayBuffer non è supportato in IE fino alla versione 10 (che la maggior parte delle persone non ha ancora), perché non inviare semplicemente dati testuali al client e aggirare questo problema? –

+0

Desidero utilizzare il numero minimo di byte possibile poiché invierò i dati molto rapidamente a più client e voglio rimanere al di sotto del totale a monte di 10 kB/s sul server, incluso il sovraccarico. Sembra che ArrayBuffer sia perfetto per questo, non mi interessa se funzionerà in IE onestamente. Principalmente ho bisogno che funzioni su Chrome. – svinja

+0

Dai un'occhiata a questo: http://stackoverflow.com/a/11426037/4323 –

risposta

4

inviare dati binari utilizzare il metodo sendBytes().

+0

Non sono esattamente sicuro del motivo per cui questo fa la differenza, ma sembra funzionare (a patto che l'OP desideri utilizzare un buffer di nodo anziché un UInt8Array). –

5

Ho giocato con WebSockets di recente e almeno questo sembra funzionare:

if(event.data instanceof ArrayBuffer) 
{ 
    var wordarray = new Uint16Array(event.data); 
    for (var i = 0; i < wordarray.length; i++) 
    { 
    console.log(wordarray[i]); 
    wordarray[i]=wordarray[i]+1; 
    } 
    console.log("End of binary message"); 
    console.log("sending changes"); 
    ws.send(wordarray.buffer); 
} 

Fondamentalmente io sono solo la creazione di un nuovo array in base a event.data

Problemi correlati