jsPDF png 和自定义 ttf 在使用 output() 时损坏

问题描述 投票:0回答:1

我目前正在开发我的第一个 jsPDF 项目,进展顺利,接受一个问题...

在客户端,我生成一个 PDF,然后将其发送到本地 REST API。 使用

save()
方法在本地保存 PDF,效果很好,我得到了“漂亮”的 PDF。 然而,使用
output()
方法将其发送到 API 后,条形码 TTF 丢失,并且右上角的 png 看起来也非常奇怪。

PDF来自

save()

enter image description here

PDF来自

output()

enter image description here

问题可能是,自定义 ttf 和 png 都没有嵌入到 PDF 中?如果是这样,我该如何改变呢? 还是有什么不同?

这就是我生成 PDF 的方式:

let img = new Image();
img.src = '/assets/bag.png';
doc.addImage(img,'png',this.width-2-18.54,0,18.54,5);

doc.setFontSize(4);
doc.text("Part No.",0,0, {baseline: 'top'});

doc.setFontSize(10);
doc.text(part + '-' + selection,0,1.5,{baseline: 'top'});

if(description) {
    doc.setFontSize(4);
    doc.text("Description",0,4.5, {baseline: 'top'});
    doc.setFontSize(10);
    doc.text(description,0,6,{baseline: 'top'});
}

if(drawing) {
    doc.setFontSize(4);
    doc.text("Drawing No.",0,9, {baseline: 'top'});
    doc.setFontSize(10);
    doc.text(drawing,0,10.5,{baseline: 'top'});
}

doc.setFontSize(4);
doc.text("Quantity",0,13.5, {baseline: 'top'});
doc.setFontSize(10);
doc.text(amount.toString(),0,15,{baseline: 'top'});

createBarcode(doc,part,this.width-2-18.54,16);

doc.rect(0,0,this.width,this.height);

printAPI(doc.output(),printer,'lbl_' + part.replace('.',''),this.paper,quantity);
if(save) doc.save('lbl_' + part.replace('.','') + '.pdf');
function createBarcode(doc,content,x,y,fontSize = 12,maxWidth = 18.54) {
    doc.setFontSize(fontSize);
    doc.setFont('fre3of9x');
    doc.text('*' + content + '*',x,y,{
        baseline: 'top',
        maxWidth: maxWidth
    });
}

为了将其发送到 API,我只需将

doc
添加到请求正文中。

async function printAPI(doc,printer,labelName,paper,quantity) {
    let res = await fetch('http://127.0.0.1:3000/api/printer/print-label', {
        method: 'POST',
        headers: {
            'Accept': 'application/json',
            'Content-Type': 'application/json'
        },
        body: JSON.stringify({
            doc: doc,
            printer: printer,
            labelName: labelName,
            paper: paper,
            quantity: quantity
        })
    });
}

仅供参考,我从 API 端点添加了负责将

output()
数据编码回 PDF 文件的部分。
req.body.doc
是来自
output()

的数据
// [...]
const writer = fs.createWriteStream(uploadDirectory + '' + fileName);
writer.write(req.body.doc)
writer.end();
// [...]

如有任何建议,我们将不胜感激!

提前致谢并致以诚挚的问候😊

javascript node.js pdf jspdf
1个回答
0
投票

在服务器上,写入文件时,尝试设置

binary
编码:

const writer = fs.createWriteStream(uploadDirectory + '' + fileName, {encoding:'binary'});
© www.soinside.com 2019 - 2024. All rights reserved.