2013-06-26 96 views
5

我正在處理一個需要上傳大文件到服務器端的項目。我決定使用HTML5 FileReader和jQuery上傳文件(ArrayBuffer)。通過jQuery在一個Ajax調用中發送ArrayBuffer與其他字符串

我成功完成了這項任務,將塊轉換爲base64字符串,並通過jQuery.post以JSON格式的數據參數發送到後端服務器。

例如

$.ajax({ 
    url: "/Home/Upload", 
    type: "POST", 
    data: { 
     name: block.name, 
     index: block.index, 
     base64: base64 
    }, 
    processData: true 
}); 

但我想優化這個代碼,因爲Base64是太大轉變。我想知道是否可以通過$.ajax直接發送ArrayBuffer。

我知道如果我設置processData: false並且只是將ArrayBuffer放入數據參數中,它可以作爲Request.InputStream發送到我的服務器端。但以這種方式我不能附加其他數據,如nameindex

我想知道我可以在一個ajax調用中將原始ArrayBuffer(或blob,二進制)與我的其他數據(名稱,索引)單獨發送。

回答

4

我想我已經解決了這個問題。我可以使用FormData將結構化數據單獨轉換爲一種形式的文件二進制文件。這樣

 
var blob = file.slice(block.start, block.end); 
// use formdata to send block content in arraybuffer 
var fd = new FormData(); 
fd.append("name", block.name); 
fd.append("index", block.index); 
fd.append("file", blob); 
$.ajax({ 
    url: "/Home/UploadInFormData", 
    data: fd, 
    processData: false, 
    contentType: "multipart/form-data", 
    type: "POST", 
    success: function (result) { 
     if (!result.success) { 
      alert(result.error); 
     } 
     callback(null, block.index); 
    } 
}); 

代碼,然後從服務器端,我可以從Request.Form找回我的結構化數據,而從Request.Files[0]

二進制內容