Javascript 如何通过Websocket以二进制形式发送arraybuffer?

Javascript 如何通过Websocket以二进制形式发送arraybuffer?,javascript,file-upload,websocket,binary,arraybuffer,Javascript,File Upload,Websocket,Binary,Arraybuffer,我正在与Mozilla Europe合作一个项目。在这个项目中,我使用Worlize(服务器端)的websocket和Mozilla(客户端)的Node.js尝试将文件从客户端上传到服务器。 我目前的目标是将文件的arraybuffer发送到服务器。创建arraybuffer并发送即可。 但是我的服务器告诉我,arraybuffer是一条utf8消息,而不是二进制消息 我误解了什么吗?如果没有,我如何更正 客户端: reader = new FileReader(); reade

我正在与Mozilla Europe合作一个项目。在这个项目中,我使用Worlize(服务器端)的websocket和Mozilla(客户端)的Node.js尝试将文件从客户端上传到服务器。
我目前的目标是将文件的
arraybuffer
发送到服务器。创建arraybuffer并发送即可。
但是我的服务器告诉我,
arraybuffer
是一条utf8消息,而不是二进制消息

我误解了什么吗?如果没有,我如何更正

客户端:

    reader = new FileReader();
    reader.readAsArrayBuffer(file);
    reader.onload = function(e) {
        connection.send(e.target.result); 
    };
服务器端:

ws.on('message', function(message,flags) {
if (!flags.binary) {
    //some code
}
else {
    console.log('It\'s a binary');
}
我也尝试了
Blob
,同样的结果。二进制部分是不可见的

Note: Prior to version 11, Firefox only supported sending data as a string.

来源:

Gecko11.0
ArrayBuffer
已实现对
二进制数据的发送和接收支持

connection = new WebSocket( 'ws://localhost:1740' );
connection.binaryType = "arraybuffer";
connection.onopen = onopen;
connection.onmessage = onmessage;
connection.onclose = onclose;
connection.onerror = onerror;
发送二进制数据

function sendphoto() {
    imagedata = context.getImageData( 0, 0, imagewidth, imageheight );
    var canvaspixelarray = imagedata.data;
    var canvaspixellen = canvaspixelarray.length;
    var bytearray = new Uint8Array( canvaspixellen );
    for ( var i = 0; i < canvaspixellen; ++i ) {
        bytearray[i] = canvaspixelarray[i];
    }
    connection.send( bytearray.buffer );
    context.fillStyle = '#ffffff';
    context.fillRect( 0, 0, imagewidth, imageheight );
}
if ( event.data instanceof ArrayBuffer ) {
    var bytearray = new Uint8Array( event.data );
    var tempcanvas = document.createElement( 'canvas' );
    tempcanvas.height = imageheight;
    tempcanvas.width = imagewidth;
    var tempcontext = tempcanvas.getContext( '2d' );
    var imgdata = tempcontext.getImageData( 0, 0, imagewidth, imageheight );
    var imgdatalen = imgdata.data.length;
    for ( var i = 8; i < imgdatalen; i++ ) {
        imgdata.data[i] = bytearray[i];
    }
    tempcontext.putImageData( imgdata, 0, 0 );
    var img = document.createElement( 'img' );
    img.height = imageheight;
    img.width = imagewidth;
    img.src = tempcanvas.toDataURL();
    chatdiv.appendChild( img );
    chatdiv.innerHTML = chatdiv.innerHTML + "<br />";
}

这是一个问答网站,“叉子和参与”不会在这里发生(请参阅)。另外,请不要要求人们去挖掘你的代码——包括解释你到底在做什么所需的最低限度的代码。我意识到这是一段时间前提出的问题,所以我说我只想添加Firefox 11及以后版本支持二进制数组缓冲和Blob。你的意思是Gecko11.0,但我如何发送,比如,该文件的名称以及数据?如果我把它放在JSON中,JSON.stringify不适用于arraybuffers…@bluejayke将字符串数据转换为类型化数组并合并缓冲区。还添加一个字节长度标志以指示文件名缓冲区的长度,以便接收方知道读取和发送组合缓冲区的字节数,如:文件名长度|文件名|原始数据的其余部分。