时间：2023-05-24 01:06:02 | 来源：网站运营
时间：2023-05-24 01:06:02 来源：网站运营
使用SlimerJS将网页输出为PDF：本文主要介绍本人在项目实践中通过SlimerJS将网页输出为PDF文档的过程，生成的PDF文档中的文本是矢量的，可以选择复制。虽然网上也有一些类似的分享，但是并没有将整个过程中的可能遇到的坑以及在Web开发中的一些技术细节讲述的比较清楚。
在线咨询
yum install xorg-x11-server-Xvfbwget https://ftp.mozilla.org/pub/firefox/releases/46.0.1/linux-x86_64-EME-free/zh-CN/firefox-46.0.1.tar.bz2tar xjvf firefox-46.0.1.tar.bz2注意这里我们下载Firefox的版本号为64的EME版本，普通版本在渲染复杂网页时可能会出现莫名的引擎级别错误。yum install gtk3-develyum install cupswget http://download.slimerjs.org/releases/0.10.0/slimerjs-0.10.0.zipunzip slimerjs-0.10.0.zip// 这里设置为firefox文件夹下的的firefox可执行文件的路径export SLIMERJSLAUNCHER=PATH_TO_FIREFOXcd PATH_TO_SLIMERJSxvfb-run ./slimerjs SCRIPT_PATH HTTP_PAGE_URL OUTPUT_FILENAME另外如果执行没有正常运行，可以加上—debug参数xvfb-run ./slimerjs --debug test.js http://www.qq.com/ test.pdfvar page = require('webpage').create()var system = require('system')if (system.args.length !== 3) { console.log('Arguments error: xvfb-run ./slimerjs SCRIPT_PATH HTTP_PAGE_URL OUTPUT_FILENAME') slimer.exit()} else { var url = system.args[1] var renderPath = system.args[2] console.log('Page url is ' + url) console.log('Output path is ' + renderPath) page.paperSize = { // magic number in my project width: '1500px', height: '1038px', shrinkToFit: true, printBGColors: true, printBGImages: true } page.onLoadFinished = function() { console.log('Finish loading page') // 有些时候分页不理想，需要删除一些节点 page.evaluate(function() { var nodes = document.querySelectorAll('.bottom-line') for(var i = 0; i< nodes.length; i += 1) { nodes[i].parentNode.removeChild(nodes[i]) } }) console.log('Start rendering') page.render(renderPath) console.log('Finish rendering') slimer.exit() } console.log('Opening page now ...') page.open(url)}@media print { body { /*https://developer.mozilla.org/en-US/docs/Web/CSS/-webkit-print-color-adjust*/ -webkit-print-color-adjust: exact; }}对于SlimerJS，虽然paperSize存在相关设置（printBGColors/printBGImages），但是文本颜色似乎无法设置。所以我推荐在编写CSS的时候注意如下细节：.someClassName { background-color:red; color: #FFF;}@media print { .someClassName { background-color:red !important; color: #FFF !important; }}关键词：输出,使用
