[英]Javascript download BLOB as PDF
我正在尝试将 blob object 转换为 pdf 并下载它。
到目前为止,我已经尝试了以下方法:
var downloadLink = document.createElement('a');
downloadLink.target = '_blank';
downloadLink.download = 'name_to_give_saved_file.pdf';
// convert downloaded data to a Blob
var blob = new Blob([file.$binary], { type: 'application/pdf' });
// create an object URL from the Blob
var URL = window.URL || window.webkitURL;
var downloadUrl = URL.createObjectURL(blob);
// set object URL as the anchor's href
downloadLink.href = downloadUrl;
// append the anchor to document body
document.body.append(downloadLink);
// fire a click event on the anchor
downloadLink.click();
文件大小似乎是正确的,但我无法查看它,因为它似乎已损坏。
在我的 html 文件中查看 PDF 的工作方式如下:
$('#test').html('<embed width=100% height=100%'
+ ' type="application/pdf"'
+ ' src="data:application/pdf;base64,'
+ escape(file.$binary)
+ '"></embed>')
这工作没有任何问题!
现在我的问题......为什么一个工作而另一个不工作?
谢谢你的帮助...
您的file.$binary
不是二进制数据(即使 object 名称是 `$binary)。 它实际上是一个包含二进制数据的 base64 表示形式的字符串。
因此,在制作Blob
之前,您需要将字符串转换为二进制数据。
您可以使用以下方法(来自https://stackoverflow.com/a/16245768 ):
const b64toBlob = (b64Data, contentType='', sliceSize=512) => {
const byteCharacters = atob(b64Data);
const byteArrays = [];
for (let offset = 0; offset < byteCharacters.length; offset += sliceSize) {
const slice = byteCharacters.slice(offset, offset + sliceSize);
const byteNumbers = new Array(slice.length);
for (let i = 0; i < slice.length; i++) {
byteNumbers[i] = slice.charCodeAt(i);
}
const byteArray = new Uint8Array(byteNumbers);
byteArrays.push(byteArray);
}
const blob = new Blob(byteArrays, {type: contentType});
return blob;
}
然后你可以做
var blob = b64toBlob(file.$binary, 'application/pdf');
查看同一问题的其他答案( https://stackoverflow.com/a/36183085 ),有一种更小的方法可以做到这一点:
const b64toBlob = (base64, type = 'application/octet-stream') =>
fetch(`data:${type};base64,${base64}`).then(res => res.blob())
然后你仍然可以做
var blob = b64toBlob(file.$binary, 'application/pdf');
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.