Socket.io begann, Binärstrom von 1.0 zu unterstützen, gibt es ein komplettes Beispiel speziell für Bild

Question

Ich bin ein Anfänger auf node.js und socket.io. Socket.io begann, den binären Stream von 1.0 zu unterstützen, gibt es ein komplettes Beispiel speziell für das Bild, das an den Client gesendet und im Canvas angezeigt wird? Danke

Answer 1

Die Lösung ist ein bisschen kompliziert, aber sollte in Chrome, Firefox arbeiten, und IE10 + (nicht sicher, über Opera und Safari):

Irgendwo auf der Server-Seite:

io.on('connection', function(socket){ 
    fs.readFile('/path/to/image.png', function(err, buffer){ 
     socket.emit('image', { buffer: buffer }); 
    }); 
}); 

Und hier ist, wie Sie es auf einem Client-Griff:

socket.on('image', function(data) { 
    var uint8Arr = new Uint8Array(data.buffer); 
    var binary = ''; 
    for (var i = 0; i < uint8Arr.length; i++) { 
     binary += String.fromCharCode(uint8Arr[i]); 
    } 
    var base64String = window.btoa(binary); 

    var img = new Image(); 
    img.onload = function() { 
     var canvas = document.getElementById('yourCanvasId'); 
     var ctx = canvas.getContext('2d'); 
     var x = 0, y = 0; 
     ctx.drawImage(this, x, y); 
    } 
    img.src = 'data:image/png;base64,' + base64String; 
}); 

Gerade yourCanvasId mit Leinwand-ID ersetzen :)

Answer 2

danke, @sovente, in dieser 1.0 Einführung http://socket.io/blog/introducing-socket-io-1-0/, das ist Code-Snippet auf binäre Unterstützung.

var fs = require('fs'); 
var io = require('socket.io')(3000); 
io.on('connection', function(socket){ 
    fs.readFile('image.png', function(err, buf){ 
    // it's possible to embed binary data 
    // within arbitrarily-complex objects 
    socket.emit('image', { image: true, buffer: buf }); 
    }); 
}); 

Ich möchte wissen, wie Sie den Puffer auf Client-Seite zu handhaben, Codes sind wie:

socket.on("image", function(image, buffer) { 
    if(image) 
    { 
     console.log(" image: "); 
     **// code to handle buffer like drawing with canvas** 
    } 

}); 

Answer 3

von Start socket.io 1.0 ist es möglich, binäre Daten zu senden. http://socket.io/blog/introducing-socket-io-1-0/

Wie die Art und Weise des Sendens und Empfangens von Binärdaten in der offiziellen Dokumentation nicht klar ist. Die einzige Dokumentation ist:

var socket = new WebSocket('ws://localhost'); 
socket.binaryType = 'arraybuffer'; 
socket.send(new ArrayBuffer); 

Ich schlage vor, Sie bei dieser Antwort einen Blick zu nehmen, wo Sie Code-Implementierung für Server und Client (Javascript, Java) finden:

https://stackoverflow.com/questions/34056705/how-to-send-binary-data-with-socket-io/

Die gute Teil ist, dass es auch auf Android funktioniert!

Prost