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