问题是在将多个pdf页面连接为一个单一的Blob时发生的。当使用Append Blob处理时,所有页面似乎都在同一个页面上,而不是分别附加到单独的Blob上。这可以通过使用Blob数组并在其中存储每个页面来解决。
以下是一个示例代码:
var blobArr = []; // 创建一个空数组
// 循环迭代每个页面,将其附加到Blob数组中
for(var i=1; i<=totalPages; i++){
pdfDoc.getPage(i).then(function(page){
var viewport = page.getViewport({scale: scale});
var canvas = document.createElement('canvas');
var context = canvas.getContext('2d');
canvas.height = viewport.height;
canvas.width = viewport.width;
var renderContext = {
canvasContext: context,
viewport: viewport
};
page.render(renderContext).then(function(){
canvas.toBlob(function(blob) {
blobArr.push(blob); // 附加每个Blob到数组中
if(blobArr.length === totalPages){ // 当所有Blob都已附加时合并它们
var mergedBlob = new Blob(blobArr, { type: 'application/pdf' });
// 现在可以根据需要对mergedBlob执行其他操作
}
}, 'application/pdf');
});
});
}
在上面的代码中,我们先创建一个名为blobArr的空数组,然后在循环迭代每个页面时,将其附加到Blob数组中。每个页面都被转换为canvas,并通过'toBlob()”方法变为一个Blob。当所有Blob都已附加到数组中时,我们可将它们合并为一个 mergedBlob,并对其执行任何其他操作。