Question

我将多个通过XHR2分组到Blob的文件发送到Node.js / Express服务器。

如何在确保将它们正确放在一起的同时在服务器上接收它们？当他们正确的顺序和正确的文件时，上传多个文件＆＃34;一次＆＃34;。

以下是我到目前为止的代码（前端和后端），但尚未考虑多个上传。

前端

// 'files' is of type FileList, directly from file input.
for (var i = 0, length = files.length; i < length; i++) {
    var file = files[i];

    var bytes = 51200; // 50 KB
    var size = file.size;
    var start = 0;
    var end = bytes;

    while (start < size) {
        sendBlob(file.slice(start, end), file.name, file.type);
        start = end;
        end = start + bytes;
    }   
}   

// sendBlob()
var sendBlob: function (data, filename, filetype) {
    var xhr = new XMLHttpRequest();
    xhr.open('POST', this.url, false);
    xhr.setRequestHeader('X_FILENAME', filename);
    xhr.setRequestHeader('Content-Type', filetype);
    xhr.send(data);
};

后端

app.post('/', function (req, res) {
    var body = '';
    req.on('data', function (data) {
        body += data;
    });
    req.on('end', function () {
        var filename = req.headers['x_filename'];
        var newPath = __dirname + '/upload/' + filename;
        fs.writeFile(newPath, body, function (err) {
            res.send({
                filename: filename
            });
        });
    });
});

非常小的文本文件存储正确，但图像似乎总是搞砸了，最终文件大小更大。更大的文本文件写得正确，但第一个块似乎丢失了。

Answer 1

您的上传逻辑很天真。以下是您应该采取的一些措施来确保正确性：

您必须维护并传达客户端和服务器之间的块ID /号码，以便维护订单。

var sendBlob: function (data, filename, filetype, chunkid)
//set chunkid in header or in data.

在您的服务器中，您接受任何发布请求并将其附加到正文。您应该维护filename和filetype的变量，并在附加之前将其与传入请求进行匹配。
```
Files[Name] = { //Create a new Entry in The Files Variable for each new file
    Filetype : "",
    FileSize: 0,//size of Data in buffer  
    Data: "",  //buffer for storing data
    Downloaded:  //chunks recieved
}
```
仅在检查时附加到数据。（额外的文件大小可能是由于此）
在你的fs.writeFile中，你应该将编码设置为二进制，图像和视频文件是二进制编码的，将它们写入默认的utf-8编码可能会破坏它们。
```
fs.writeFile(newPath, body, 'binary', function (err){...});
```
（可选）对于服务器收到的每个块，它应该向客户端发送一个确认，以便它知道哪个块被丢弃并且必须被发送。

处理传入的XHR2数据（Blob）

1 个答案: