Javascript 有没有一种方法可以打印PDF文件，但可以随意设置值，而不从主HTML中获取这些值？

我需要在我的网站上添加一个“打印PDF”选项，但我的问题是我使用Ext.js，所以我的网站的代码不是HTML。我一直在搜索如何从网站上打印pdf，我只找到如何通过HTML打印。所以我想知道是否有任何库或东西可以设置我想要手动打印的内容，而不是从HTML代码中获取

这就是我定义要在PDF文件中打印的表的方式

const store = Ext.create('Ext.data.Store', {
                storeId:'hotelsStore',
                fields:['name', 'Best price', 'Price1', 'Price2', 'Price3'],
                proxy: {
                    type: 'memory',
                    reader: {
                        type: 'json',
                        root: 'items'
                    }
                }
            });

            const grid = Ext.define('KitchenSink.view.grid.CellEditing', {
                extend: 'Ext.grid.Panel',                
                xtype: 'cell-editing',
                initComponent: function() {                   
                    Ext.apply(this, {
                        store: Ext.data.StoreManager.lookup('hotelsStore'),
                        columns: [
                        {
                            header: 'Name',
                            dataIndex: 'name',
                            width: 300                           
                        }, {
                            header: 'Best price',
                            dataIndex: 'bestPrice',
                            width: 105
                        },
                        {
                            header: 'Price1',
                            dataIndex: 'priceSite1',
                            width: 200
                        },
                        {
                            header: 'Price2',
                            dataIndex: 'priceSite2',
                            width: 200
                        },
                        {
                            header: 'Price3',
                            dataIndex: 'priceSite3',
                            width: 200
                        },
                        {
                            xtype: 'actioncolumn',
                            width: 30,
                            sortable: false,
                            menuDisabled: true,
                            id: 'delete-column',
                            items: [{
                                icon: '/assets/img/delete.png',
                                tooltip: 'Delete',
                                scope: this,
                                handler: this.onRemoveClick
                            }],

                        }],
                        dockedItems: [{
                            xtype: 'toolbar',
                            items: [{
                                text: 'Add',
                                scope: this,
                                handler: this.add
                            }, {
                                text: 'Print values',
                                scope: this,
                                hander: this.printValues
                            }, {
                                text: 'Logout',
                                scope: this,
                                handler: this.logout
                            }]
                        }],                     
                    });

                    this.callParent();
},

我要在PDF中打印的值在此数组中：

function fillData()
  for(var i = 0; i<hotelNames.length; i++) {
      dataArray.push({ 'name': names[i], 'bestPrice': results[i2], 'Price1': 
      results[i4], 'Price2': results[i5], 'Price3': results[i6]})
      i2 = i2 + 4;
      i3 = i3 + 4;
      i4 = i4 + 4;
      i5 = i5 + 4;
      i6 = i6 + 4;
  }
}

如您所见，我没有任何HTML代码。Ext.js使用JavaScript，那么如何实现这一点呢

提前谢谢。

您可以使用或库

PDFMake（纯JavaScript中用于服务器端和客户端的PDF文档生成库）

PDFKit（PDFKit是一个用于节点和浏览器的PDF文档生成库，可轻松创建复杂、多页、可打印的文档。该API包含可链接性，包括低级功能以及高级功能的抽象。PDFKit API设计简单，因此生成复杂文档通常与将mple作为几个函数调用。）

---

更新！如何在浏览器中使用PDFKit？

要首先在浏览器中使用PDFKit，应添加

index.html

文件

script.js

var element = document.getElementById('printDoc'); 
element.addEventListener('click', ()=>{
 // create a document and pipe to a blob
        var doc = new PDFDocument();
        var stream = doc.pipe(blobStream());

        // draw some text
        doc.fontSize(25).text('Stackoverflow with smile :) ', 100, 80);

        doc.end();
        stream.on('finish', function () {

               window.open(stream.toBlobURL('application/pdf'), '_blank');
        });

});

---

我将选择PDFKit。非常感谢！：）我刚刚尝试了PDFKit，它似乎正确地生成了PDF，但是我希望在浏览器中显示它，而不是将其保存在本地，因为我的站点托管在服务器中。因此，我尝试使用浏览器，当我运行它时，我得到了以下错误：

this.\u blob=new blob（this.chunks，{

Blob不是构造函数

。你知道会出什么问题吗？嗯，我不确定，但是如果你想在保存它之前进行预览，你应该检查这里，你应该知道blobStream是因为浏览器在服务器端不起作用。欢迎你，当然require不起作用，你不需要在客户端使用require，我们如“PDFKit浏览器演示示例”：

var doc=new PDFDocument（）；

var stream=doc.pipe（blobStream（））

…好的，我已经更好地查看了它的文档，显然我需要使用

browserify

，以便在web浏览器中预览pdf。但是，一开始它有点混乱，因为示例在

iframe

中预览它，而我的网站上没有该文档，所以我不得不在d我需要使用

constURL=stream.toBlobURL（'application/pdf'）；

window.open（url）；

而不是

iframe.src=stream.toBlobURL（'application/pdf'）；

。我解释了这一点，这样可能会对某些人有所帮助。

var element = document.getElementById('printDoc'); 
element.addEventListener('click', ()=>{
 // create a document and pipe to a blob
        var doc = new PDFDocument();
        var stream = doc.pipe(blobStream());

        // draw some text
        doc.fontSize(25).text('Stackoverflow with smile :) ', 100, 80);

        doc.end();
        stream.on('finish', function () {

               window.open(stream.toBlobURL('application/pdf'), '_blank');
        });

});