Javascript Blob anchortag下載產生損壞的文件

Question

下面的代碼下載一個文件，無法打開（損壞），我完全不知道爲什麼。我已經在很多方面嘗試了這一點，但它永遠不會工作，它總是會產生一個損壞的文件。原始文件不是問題，因爲它可以正常打開。我正在嘗試打開mp4，mp3和圖像文件。

//$scope.fileContents是一個字符串

$scope.fileContents = $scope.fileContents.join(","); 
     var blob = new Blob([$scope.fileContents], {type: $scope.file.fileDetails.type}); 
     var dlURL = window.URL.createObjectURL(blob); 
     document.getElementById("downloadFile").href = dlURL; 
     document.getElementById("downloadFile").download = $scope.file.fileDetails.name; 
     document.getElementById("downloadFile").click(); 
     window.URL.revokeObjectURL(dlURL); 

Answer 1

您需要使用ArrayBuffer例如下載的文件內容爲二進制

$http.get(yourFileUrl, { responseType: 'arraybuffer' }) 
    .then(function (response) { 
     var blob = new Blob([response.data], {type: $scope.file.fileDetails.type}); 
     // etc... 
    }); 

來源：

• angular solution
• plain javascript solution