必须有一种方法可以更有效地做到这一点。我所做的在概念上非常简单:
1) 调用网络服务并接收 PDF blob 的 b64 编码字符串。
2) 解码,创建 blob,在新窗口中呈现 PDF。考虑弹出窗口拦截器。
我的代码有效。没有什么花哨。它的所有客户端。一切正常,但与其他浏览器相比,IE 运行速度 super 慢(IE 11 与当前的 Chrome/Firefox/Safari)。
鉴于此,我确信我可以更有效地做到这一点。关于如何为 IE 11 加快速度的任何提示?
注意:我使用的是 Jeremy 的 b64toBlob函数(感谢 Jeremy)。
第一部分:模态内容
var box = new SimpleDialog(Dialogs.getNextId(), false);
box.title = "Fetching PDF";
box.isMovable = false;
box.extraClass = "";
box.width = 400;
box.isModal = true;
box.createDialog();
window.parent.box = box;
box.setContentInnerHTML('<p>Please wait....</p>');
box.show();
第二部分:调用外部服务,接收b64编码的字符串
setTimeout(function(){
var response = ... ; //do callout... get data
var statusCode = ...; //parse from response
var b64Data = ... ; //parse from response
if(statusCode == 200) {
//Account for IE
if (navigator.appVersion.toString().indexOf('.NET') > 0) {
var blob = b64toBlob(b64Data, "application/pdf");
var fileURL = URL.createObjectURL(blob);
window.navigator.msSaveOrOpenBlob(blob, "theFile.pdf");
window.parent.box.cancel();
} else {
var blob = b64toBlob(b64Data, "application/pdf");
var fileURL = URL.createObjectURL(blob);
var pdfWin = window.open(fileURL,"_blank","width=1000,height=800");
if(!pdfWin) {
box.setTitle("Success: PDF has been retrieved");
box.setContentInnerHTML("<p align='left'></p><p align='left'>A popup blocker was detected. The PDF will not open automatically.<br /><br /></p><p align='left'><a onclick='window.parent.box.cancel();' target='_blank' href='"+fileURL +"' >Click here to view .pdf</a><br /><br /></p><p align='center'><button class='btn' onclick='window.parent.box.cancel(); return false;'>Cancel</button></p>");
} else {
window.parent.box.cancel();
}
}
} else {
box.setTitle("Error fetching PDF");
box.setContentInnerHTML("<p align='left'><img src='/img/msg_icons/warning32.png' style='margin:0 5px;'/></p><p align='left'>Unable to retrieve PDF.</p><p align='center'><button class='btn' onclick='window.parent.box.cancel(); return false;'>OK</button></p>");
}
},200);
最佳答案
我真的没有看到任何缓慢,这个 plunkr 在 IE 中运行,(使用对原始“Jeremy”解决方案的更新)工作得很好:
原始帖子中有一个更新,进一步改进了答案:
function base64toBlob(base64Data, contentType, sliceSize) {
var byteCharacters,
byteArray,
byteNumbers,
blobData,
blob;
contentType = contentType || '';
byteCharacters = atob(base64Data);
// Get blob data sliced or not
blobData = sliceSize ? getBlobDataSliced() : getBlobDataAtOnce();
blob = new Blob(blobData, { type: contentType });
return blob;
/*
* Get blob data in one slice.
* => Fast in IE on new Blob(...)
*/
function getBlobDataAtOnce() {
byteNumbers = new Array(byteCharacters.length);
for (var i = 0; i < byteCharacters.length; i++) {
byteNumbers[i] = byteCharacters.charCodeAt(i);
}
byteArray = new Uint8Array(byteNumbers);
return [byteArray];
}
/*
* Get blob data in multiple slices.
* => Slow in IE on new Blob(...)
*/
function getBlobDataSliced() {
var slice,
byteArrays = [];
for (var offset = 0; offset < byteCharacters.length; offset += sliceSize) {
slice = byteCharacters.slice(offset, offset + sliceSize);
byteNumbers = new Array(slice.length);
for (var i = 0; i < slice.length; i++) {
byteNumbers[i] = slice.charCodeAt(i);
}
byteArray = new Uint8Array(byteNumbers);
// Add slice
byteArrays.push(byteArray);
}
return byteArrays;
}
}
来自这里的答案:
plunkr 对你来说很慢吗?您可以输入一些日志记录以了解哪个调用实际上很慢吗?放入计时器并记录每一行。在IE路线上。哪个报告“缓慢”?
更新 在 plunkr 上,我放了一个非常简单的计时器,它显示在 IE11 中只需要大约 46 毫秒就可以将 PDF 发送给您。明明不是多线程,但也算是一种暗示。
关于javascript - IE 和 javascript : efficient way to decode (and render) b64-encoded PDF blob,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/38950334/