2017-01-24 56 views
0

我正在使用來自AngularJs的預先簽名的URL將文件上傳到Amazon S3 Bucket。打開下載的文件時Zip文件被破壞。當我以二進制格式從郵遞員上傳文件時,它按預期工作。如何在Angularjs中使用ng-file上傳庫以二進制格式上傳文件?

enter image description here

我正在使用angularjs NG-文件上傳庫。對於每個下載的文件包含在開始追加網絡套件形式邊界如下:

enter image description here

如果我們編輯和刪除網絡套件形式的邊界,並嘗試完全打開相同的文件開幕。

+0

你能提供一個用來下載文件的代碼嗎? –

回答

1

我在一週前遇到過同樣的問題,我想出的唯一解決方案是編寫自己的代碼,通過http請求發送文件。隨意使用的例子:

function azureChangeFn() { 
 
\t \t \t var inputElement = document.getElementById("fileSelect"); 
 
\t \t \t var newFile = inputElement.files[0]; 
 
\t \t \t var url = "https://YOUR_STORAGE_NAME.blob.core.windows.net/CONTAINER_NAME/"+ newFile.name +"GENERATED_SharedAccessSignature_FROM_AZURE_SITE"; 
 
\t \t \t 
 
\t \t \t var xhr = new XMLHttpRequest(); 
 
\t \t \t xhr.addEventListener("progress", updateProgress); 
 
\t \t \t xhr.onreadystatechange = function() { 
 
\t \t \t \t if (xhr.readyState == XMLHttpRequest.DONE) { 
 
\t \t \t \t \t alert("Sent to azure storage service!"); 
 
\t \t \t \t } 
 
\t \t \t } 
 
\t \t \t xhr.open('PUT', url, true); 
 
\t \t \t xhr.setRequestHeader("Content-type", "multipart/form-data"); 
 
\t \t \t xhr.setRequestHeader("lng", "en"); 
 
\t \t \t xhr.setRequestHeader("x-ms-blob-type", "BlockBlob"); 
 
\t \t \t xhr.setRequestHeader("x-ms-blob-content-type", newFile.type); 
 
\t \t \t xhr.send(newFile); 
 
\t \t } 
 
\t \t 
 
\t \t function updateProgress (oEvent) { 
 
\t \t if (oEvent.lengthComputable) { 
 
\t \t \t var percentComplete = oEvent.loaded/oEvent.total; 
 
\t \t \t console.log(percentComplete); 
 
\t \t } else { 
 
\t \t \t alert('FAIL'); 
 
\t \t } 
 
\t \t }
<html> 
 

 
<head> 
 
</head> 
 

 
<body> 
 
\t \t <label>Example without library:</label> 
 
\t \t <br> 
 
\t \t <label>Select file: <input type="file" id="fileSelect" onchange="azureChangeFn()"></label> 
 
\t \t 
 
\t \t 
 
</body> 
 
</html>

談到NG-文件上傳庫,在源代碼中我發現,formData.append方法附加文件時,automaticaly增加了web的套件頭。據我瞭解,FormData用於POST方法,但是當使用PUT時,所有主體都被當作文件。很遺憾,我無法通過POST方法將文件上傳到Azure存儲。

相關問題