javascript - html2pdf.js 在 iOS 上生成一个空白文档

问题描述

我正在使用 eKoopman 的 html2pdf.js 库https://github.com/eKoopmans/html2pdf.js在评估结束时为用户生成推荐列表。这些是根据响应动态生成的。

它在桌面上运行得非常好。但是，当我尝试在 iOS 上输出 PDF 时，除了我在单独的函数中添加的页眉和页脚外，文档是空白的。

它就像它完全忽略了元素。

下面是我在用户单击按钮时触发的代码。

        var element = $('#recommendationsdisplay').html();
        var opt = {
            margin: [.75,0,.75,0],
            filename: 'Click_Start_' + Math.floor(Date.now() / 10000) + '.pdf',
            enableLinks: true,
            image: {
                type: 'jpeg',
                quality: 1
            },
            html2canvas: {
                scale: 2,
                dpi: 300,
                letterRendering: true
            },
            jsPDF: {
                unit: 'in',
                format: 'letter',
                orientation: 'portrait'
            },
            pagebreak:{
                mode: ['avoid-all', 'css', 'legacy'],
                avoid: 'div.recgrid-item'
            }
        };

        html2pdf().from(element, 'string').set(opt).toPdf().get('pdf').then(function (pdfObject) {
        /* some image related encoding */
            var headerTitle = "Recommendations";
            var footerCR = "© 2020";

            // Header and Footer
            for (var i = 1; i < pdf_pages.length; i++) {
                pdfObject.setPage(i);
                pdfObject.setFontSize(14);
                pdfObject.setTextColor('#0090DA');
                pdfObject.addImage(headerData, 'PNG', 0, 0, 8.5, .5);
                pdfObject.setFontSize(10);
                pdfObject.setTextColor('#777777');
                pdfObject.text(footerCR, 4, 10.5);
                pdfObject.text(' ' + i, 7.375, 10.5);
                pdfObject.addImage(logoData, 'PNG', .75, 10.25, 1, .325);
            }

        }).save();

编辑：似乎问题出在画布大小限制上。如果元素的高度不高于某个阈值（评估中选择的项目较少），则该元素会在 PDF 中正确呈现。我的文档只有几页长（<7），但我看到其他用户报告说能够创建几十页的 PDF，所以我不确定问题是什么。

标签： javascriptiosjspdf

javascript - html2pdf.js 在 iOS 上生成一个空白文档

问题描述

解决方案

推荐阅读