使用AngularJS从服务器端下载文件，但文件格式已更改?

Question

>我创建了一个与服务器交互并自动下载文件的 GET API，但是我在下载文件时遇到了很多问题。我下载的文件格式不可读。请给我一个建议。

this.sendGETRequestFiLeDownload = function(url) {
var defer = $q.defer();
$http.get(url, {
headers: {
'Accept': "application/vnd.ms-excel",
"Content-Type": "application/json",
"csrfToken": csrfToken,
"accessToken": accessToken,
"accessValue": accessValue,
"accessFlag": accessFlag,
"accessVariable": accessVariable,
"FAMA-TOKEN": iv,
"FAMA-ACCESS-KEY": salt,
}
})
.then(function(response) { 
var data = response.data
console.log(response);
var blob=new Blob([data], {type: 'application/vnd.ms-excel'});
var link=document.createElement('a');
link.href=window.URL.createObjectURL(blob);
link.download="transectionCommisionRepoert.xslx";
link.click();
defer.resolve(response);
},
function(errResponse) {
self.isSessionAvailable(errResponse);
defer.reject(errResponse);
}
);
return defer.promise;
}

Answer 1

如何使用 AngularJS 下载二进制文件

下载二进制文件时，设置responseType很重要：

app.service('dataService',['$http',function($http) {
this.downloadFile = function(url) {
var config = {      
//SET responseType
responseType: 'blob',
headers: {
'Accept': "application/vnd.ms-excel",
"Content-Type": "application/json",
"csrfToken": csrfToken,
"accessToken": accessToken,
"accessValue": accessValue,
"accessFlag": accessFlag,
"accessVariable": accessVariable,
"FAMA-TOKEN": iv,
"FAMA-ACCESS-KEY": salt,
}
};
return $http.get(url, config);
} 
]);

如果省略responseType，XHR API 默认将 UTF-8 编码文本转换为 DOMString (UTF-16(，这将损坏 PDF、图像和其他二进制文件。

有关更多信息，请参阅 MDN Web API 参考 - XHR 响应类型

Answer 2

为什么不在链接上使用下载属性？诸如此类：

<a href="/images/myw3schoolsimage.jpg" download>