binary.js和文件广播到连接的客户端

时间:2014-01-20 14:52:06

标签: javascript node.js websocket

我在这里要做的是使用binaryjs客户端/服务器系统通过websocket / binaryjs向连接到服务器的其他客户端广播文件。

问题来自大文件(或者可能是完全随机的?!?!)。客户端停止向服务器发送数据,从而产生错误。

这是我第一次尝试这样的东西,而且我对套接字编程很陌生,所以我可能会遗漏某些内容......或者其他所有内容。

这是客户端

<html>
    <head>
        <script src="http://cdn.binaryjs.com/0/binary.js" type="text/javascript" language="javascript"></script>
        <script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript" language="javascript"></script>
        <script>
            $(document).ready(start);


            function upload(e){
                var file = e.target.files[0];

                var chunkSize = 1024 * 1024; //1mb in this case but the problem seems to be uneffected by the chunk size 
                var fileSize = file.size;
                var start = 0;
                var end = chunkSize;
                var s = client.createStream({name: file.name, size: file.size});

                while(start < fileSize) {
                    w = s.write(file.slice(start, end));
                    console.log(w);
                    start = end;
                    end = start + chunkSize;
                }

                /*
                //the client.send way
                var reader = new FileReader();
                reader.onload = function(e) {
                    var contents = e.target.result;
                    client.send(contents, {name: file.name, size: file.size});
                };
                reader.readAsArrayBuffer(file);
                */
            }





            var client = new BinaryClient('ws://0.0.0.0');
            function start() {
                var o = $('#output');
                client.on('stream', function(stream, meta){
                    var parts = [];
                    var meta = meta;
                    var downloaded = 0;
                    var element = $('<div />');
                    o.append(element);
                    stream.on('data', function(data){
                        downloaded += data.byteLength;
                        element.html(meta.name+' '+(Math.round(downloaded/meta.size*100 *100)/100)+'% ');
                        parts.push(data);
                    });
                    stream.on('end', function(){
                        var a = document.createElement("a");
                        a.innerHTML='download';
                        a.href = (window.URL || window.webkitURL).createObjectURL(new Blob(parts));
                        a.download = meta.name;
                        a.target = '_blank';
                        element.append(a);
                    });
                });
            }
        </script>
    </head>
    <body>
        <input type="file" id="files" name="files" />
        <div id="output"></div>
        <script>
            document.getElementById('files').addEventListener('change', upload, false);
        </script>
    </body>
</html>

然后是服务器代码

var BinaryServer = require('binaryjs').BinaryServer;
var server = BinaryServer({port:80});
var clients = [];

server.on('connection', function(client){
    clients.push(client);
    console.log(clients.length);
    client.on('stream', function(stream, meta){
        var s = [];
        var d = 0;
        for (var i=0;i<clients.length;i++) {
            if (clients[i].id == client.id) {

            } else {
                s.push(clients[i].createStream(meta));
            }
        }

        var name = meta;
        var parts = [];
        stream.on('data', function(data){
            d += data.length;
            console.log('data in '+d);
            for (var i=0;i<s.length;i++) {
                s[i].write(data);
            }
        });
        stream.on('end', function(){
            console.log('end');
            for (var i=0;i<s.length;i++) {
                s[i].end();
            }
        });
    });
    client.on('close', function() {
        for (var i=0;i<clients.length;i++) {
            if(clients[i].id == client.id) {
                clients.splice(i, 1);
            }
        }
        client.close();
    });
    client.on('error', function(){
        console.log('error');
    });
});

从客户端上传时,我会随机收到此错误消息(client binary.js)

WebSocket connection to 'ws://0.0.0.0/' failed: Failed to send WebSocket frame. binary.js:1341
WebSocket connection to 'ws://0.0.0.0/' failed: Failed to load Blob: error code = 3 binary.js:1341

小文件没问题(例如它永远无法播放25mb wmv)。 Dunno,如果这只是一个巧合。 任何帮助将不胜感激。

0 个答案:

没有答案