如何使用ajax發送大文件？

Question

因此，目前我正在開發一個簡單的項目，用戶可以將圖片上傳到服務器。之前，我在這裏提到我的問題是我如何做它：

客戶：

var dataURL = sendingcanvas.toDataURL("image/*"); 
var imagedatatosend = dataURL.replace(/^data:image\/(png|jpg);base64,/, ""); 
formdata = { 
    'image': imagedatatosend 
}; 

$.ajax({ 
    url: '../receive', 
    type: 'POST', 
    data: formdata, 
    encode: false, 
    success: function(result){ 
     alert(result); 
    } 
}); 

FYI：imagedatatosend大小超過5MB較低且含有正好選擇的文件數據。

基本上會發生什麼是用戶使用<input type="file"標籤選擇圖像然後我將該選定的文件在canvas中繪製，以將其轉換爲base64並將其發送到服務器。

Java服務器：

String datareceived = request.getReader().lines().collect(Collectors.joining(System.lineSeparator())); 

byte[] bImg = Base64.decodeBase64(datareceived.getBytes("UTF-8")); 
FileOutputStream fos = new FileOutputStream("hi.jpg"); 
fos.write(bImg); 
fos.close(); 

我想我可能沒有必要解釋什麼上面的代碼一樣。但是我面臨着一些嚴重的性能問題我的意思是，即使我嘗試System.out.println(datareceived);，將數據寫入hi.jpg文件也需要花費很長時間，我的鼠標點擊需要幾秒鐘才能響應服務器控制檯。

我不知道爲什麼會發生這種情況，我需要將圖像數據作爲多部分發送還是什麼？

所有答覆都讚賞和感謝提前:)

Answer 1

使用XMLHttpRequest和FORMDATA到文件追加。它將使用多部分發送並適當分塊。

請參見：https://developer.mozilla.org/en-US/docs/Web/API/FormData/Using_FormData_Objects