如何使用浏览器(chrome/firefox)HTML/CSS/JS渲染引擎生成PDF？

Question

有很好的项目可以从html/css/js文件生成pdf

1. http://wkhtmltopdf.org/(开源)
2. https://code.google.com/p/flying-saucer/(开源)
3. http://cssbox.sourceforge.net/(不一定是直接的pdf生成)
4. http://phantomjs.org/(开源允许pdf输出)
5. http://www.princexml.com/(商业但是最好的那个)
6. https://thepdfapi.com/铬修改从html吐出pdf

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

但是我如何开始以自动方式控制浏览器,以便我可以做类似的事情

render-to-pdf file-to-render.html out.pdf

我可以通过浏览页面然后将其打印到pdf手动轻松完成这项工作,并在pdf文件上获得准确的,100%规范的html/css/js页面.甚至可以在浏览器中的pdf配置选项中省略url标头.但同样,我如何开始尝试自动化这个过程？

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

我做了很多研究,我不知道如何提出正确的问题.我想以编程方式控制浏览器,可能就像selenium一样,但我将网页导出为PDF(因此使用浏览器的渲染功能来生成良好的pdf)

Answer 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();
});

希望能帮助到你.

Answer 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...