들어오는 XHR2 데이터 처리 (BLOB)

Question

Blob의 XHR2에 여러 파일을 전송하여 Node.js/Express 서버에 보냅니다.

올바르게 조립 된 상태에서 서버에서 어떻게받을 수 있습니까? 올바른 순서로, 그리고 여러 파일이 "즉시"업로드 될 때 올바른 파일로.

다음은 현재까지 가지고 있지만 여러 개의 업로드를 아직 고려하지 않은 코드입니다 (프런트 엔드 및 백엔드 모두).

프런트 엔드 :

// '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

업로드 논리가 순진합니다. 다음은 정확성을 보장하기 위해해야 ​​할 몇 가지 사항은 다음과 같습니다

1. 하는 당신은 유지하고 순서가 유지 될 수 있도록 클라이언트와 서버 사이의 청크 ID/번호를 전달해야합니다.

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

2. 귀하의 서버에서 귀하는 어떠한 게시물 요청도 수락하고 본문에 첨부합니다. 파일 이름과 파일 유형에 대한 변수를 유지하고 추가하기 전에 들어오는 요청과 일치시켜야합니다.

   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 
   } 
   

   확인시에만 데이터에 추가하십시오.

3. fs.writeFile에 인코딩을 바이너리로 설정해야합니다. 이미지 및 비디오 파일은 바이너리 인코딩되며 기본 utf-8 인코딩으로 작성하면 인코딩이 손상 될 수 있습니다. 그것을 삭제하고 전송해야하는 덩어리 알 수 있도록이 클라이언트에 다시 승인을 보내야합니다 서버가 수신 한 각 청크를 들어

   fs.writeFile(newPath, body, 'binary', function (err){...}); 
   

4. (선택 사항).