0

语境

我正在开发一个专门用于 pdf 操作的 vueJS 组件。目标是允许用户上传多个 pdf 文件,删除一些页面并按特定顺序重新组织所有页面。

代码

我有一个名为的文件数组pdfFiles。每次用户删除一个新的 pdf 文件时,我都会将 blob 存储在这个数组中。

有一个名为 的数组pages。该数组存储每个导入的 pdf 文件的每一页。存储在此数组中的对象具有以下结构:

pageObject: {
    pdfFileIndex: Integer,
    index: Integer,
    id: Integer,
    page: PDFPageProxy
}

page这是 PDF.js lib 中的一个自动生成的对象,对于示例id来说并不重要。

pdfFileIndex是一个整数,对应于pdfFiles页面关联的数组中文件的索引。

index只是他的pdf文件中页面的索引。

当用户结束对文件的操作时,我使用以下代码生成仅包含用户保留的页面的 pdf:

exportPdf() {
    (async () => {
        this.pages.forEach(page => {
            console.log(this.pdfFiles[page.pdfFileIndex]);
            console.log([page.index]);
            this.merger.add(this.pdfFiles[page.pdfFileIndex], [page.index]);
        });

        return await this.merger.saveAsBlob();
    })();
}

this.merger已初始化为:merger: new PDFMerger()在数据范围内。

所以this.pdfFiles[page.pdfFileIndex]包含文件的 blob 并[page.index]包含我要添加到合并对象的页面的索引。

我使用了一些 console.log 来检查这两个值是否与用户在编辑器中所做的相对应,并且确实如此。

问题

this.merger.saveAsBlob()我在这一步有一个问题:

Uncaught (in promise) Error: already ended
at eval (fragment.js?2c29:10)
at Object../node_modules/pdfjs/lib/fragment.js (chunk-vendors.js:3656)
at __webpack_require__ (app.js:854)
at fn (app.js:151)
at Object.eval (document.js?07b2:4)
at eval (document.js:813)
at Object../node_modules/pdfjs/lib/document.js (chunk-vendors.js:3572)
at __webpack_require__ (app.js:854)
at fn (app.js:151)
at eval (index.js?4e59:3)

在模块的 github 上只有一篇与此问题相关的帖子,即这个:https ://github.com/nbesli/pdf-merger-js/issues/29 。

事实是我的问题不一样,因为我只在应用程序中调用了一次“exportPdf”函数。

如果需要更多代码或解释,请询问我。感谢您的帮助

4

1 回答 1

0

merger.add是一个异步调用。

await merger.add(file)
于 2022-01-18T17:22:42.677 回答