如何使用浏览器（chrome/firefox）的HTML/CSS/JS渲染引擎来生成PDF？

html google-chrome java pdf pdf-generation

2022-09-01 19:32:29

有一些不错的项目可以从html/css/js文件生成pdf

http://wkhtmltopdf.org/（开源）
https://code.google.com/p/flying-saucer/（开源）
http://cssbox.sourceforge.net/（不一定是直接的pdf生成）
http://phantomjs.org/（开源允许pdf输出）
http://www.princexml.com/（商业，但手放下最好的一个）
https://thepdfapi.com/ 一个chrome修改，从html中吐出pdf

我想以编程方式控制chrome或firefox浏览器（因为它们都是跨平台的），使它们加载网页，运行脚本和设置页面样式并生成用于打印的pdf文件。

但是，我如何开始以自动方式控制浏览器，以便我可以做这样的事情

渲染到 pdf 文件到渲染.html输出.pdf

我可以通过浏览页面然后将其打印为pdf来轻松手动完成这项工作，并且我在pdf文件上获得准确的，100%符合规范的呈现html / css / js页面。甚至可以通过浏览器中的配置选项在pdf中省略URL标题。但是，我该如何开始尝试自动化此过程？

我想在服务器端自动化，打开浏览器，导航到页面，并使用浏览器呈现的页面生成pdf。

我做了很多研究，只是不知道如何提出正确的问题。我想以编程方式控制浏览器，也许像selenium一样，但到了我将网页导出为PDF的程度（因此使用浏览器的渲染功能来生成良好的pdfs）

答案 1

我不是专家，但PhamtomJS似乎是这项工作的正确工具。我不确定它下面使用什么无头浏览器（我猜它是铬/铬）

var page = require('webpage').create();
page.open('http://github.com/', function() {
     var s = page.evaluate(function() {
         var body = document.body,
             html = document.documentElement;

        var height = Math.max( body.scrollHeight, body.offsetHeight, 
            html.clientHeight, html.scrollHeight, html.offsetHeight );
        var width = Math.max( body.scrollWidth, body.offsetWidth, 
            html.clientWidth, html.scrollWidth, html.offsetWidth );
        return {width: width, height: height}
    });

    console.log(JSON.stringify(s));

    // so it fit ins a single page
    page.paperSize = {
        width: "1980px",
        height: s.height + "px",
        margin: {
            top: '50px',
            left: '20px'
        }
    };

    page.render('github.pdf');
    phantom.exit();
});

希望它有帮助。

答案 2

Firefox有一个API方法：https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/API/tabs/saveAsPDF

browser.tabs.saveAsPDF({})
  .then((status) => {
    console.log('PDF file status: ' + status);
  });

但是，它似乎仅适用于浏览器扩展，不能从网页调用。

我仍然在寻找一个公共API...