后台webapi代码：
[HttpGet]
[Route("{manifestId}")]
public IHttpActionResult FindManifestPdfById([FromUri]string manifestId)
{
byte[] result = _manifestService.GetData(manifestId);
HttpResponseMessage response = new HttpResponseMessage(HttpStatusCode.OK);
response.Content = new StreamContent(new MemoryStream(result));
response.Content.Headers.Add("Access-Control-Expose-Headers", "Content-Disposition");
response.Content.Headers.ContentType = new MediaTypeHeaderValue("application/pdf");
response.Content.Headers.ContentDisposition = new ContentDispositionHeaderValue("attachment")
{
FileName = manifestId + ".pdf",
};
return this.ResponseMessage(response);
前端代码：这边用的是angularjs，实现代码大同小异
function downloadFile(manifestUrl) {
$http({
url: manifestUrl,
method: 'GET',
responseType: "blob",
params: {},
headers: {
'Content-Type': 'application/pdf',
}
}).success(function (response, status, headers, config) {
Export(response, 'abc.pdf');
}).error(function (response) {
});
}
//文件流下载
function Export(blob, fileName) {
if ('download' in document.createElement('a')) { // 非IE下载
var elink = document.createElement('a');
elink.setAttribute("download", fileName);
elink.style.display = 'none';
elink.href = URL.createObjectURL(blob);
document.body.appendChild(elink);
elink.click();
URL.revokeObjectURL(elink.href);// 释放URL 对象
document.body.removeChild(elink);
} else { // IE10+下载
navigator.msSaveBlob(blob, fileName);
}
}
这边
最最最重要
的一行代码是请求时添加
responseType: "blob"
,参数。
之前没有添加：
通过返回的response组装blob
var blob = new Blob([data], {type: 'application/pdf'})；
出来的标签死活是空白pdf，个人感觉是没有传responseType参数，服务器传回来的类型变成了字符串，再通过数组转成Blob时，编码就会异常，返回了空白pdf。
pdf流字符串显示形式
主要参考的文章有：
https://stackoverflow.com/questions/34436133/pdf-is-blank-when-downloading-using-javascript
https://stackoverflow.com/questions/12876000/how-to-build-pdf-file-from-binary-string-returned-from-a-web-service-using-javas/31763030#31763030
responseType说明
https://developer.mozilla.org/zh-CN/docs/Web/API/XMLHttpRequest/responseType
