Nodejs中利用phantom把html转为pdf或图片格式 - younglao的博客 - CSDN博客

标签: | 发表时间:2019-01-14 07:23 | 作者:
出处:https://blog.csdn.net

最近在项目中遇到需要把html页面转换为pdf的需求,并且转换成的pdf文件要保留原有html的样式和图片。也就是说,html页面的图片、表格、样式等都需要完整的保存下来。

最初找到三种方法来实现这个需求,这三种方法都只是粗浅的看了使用方法,从而找出适合这个需求的方案:

  • html-pdf 模块
  • wkhtmltopdf 工具
  • phantom 模块

最终使用了phantom模块,也达到了预期效果。现在简单的记录三种方式的使用方法,以及三者之间主要的不同之处。


1.html-pdf

安装:

npm install -g html-pdf

使用命令行:

html-pdf /test/index.html index.pdf

这样便可以把index.html页面转换为对应的index.pdf文件。

使用代码:

var express = require('express');
var router = express.Router();
var pdf = require('html-pdf');

router.get('/url',function(req,res){
    res.render('html',function(err,html){
        html2Pdf(html,'html.pdf');
        //........
   });
});

/**
 * 这种方法没有渲染样式和图片
 * @param url
 * @param pdfName
 */
exports.html2Pdf = function(html,pdfName){
    var options = {format:true};
    pdf.create(html,options).toFile(__dirname+'/'+pdfName,function(err,res){
        if (err) return console.log(err);
        console.log(res);
    });
};

在测试过程中发现,生成的pdf文件中并没有支持样式渲染和图片加载,不能支持通过url直接加载html;但是在分页的支持上很好。

结果如下:

这里写图片描述


2 wkhtmltopdf

wkhtmltopdf在效果上比较html-pdf要好很多,它支持样式渲染,图片加载,还可以通过url直接生成PDF文件。
但是安装上要麻烦得多。具体安装步骤 参考这里

安装完毕之后,使用命令行:

wkhtmltopdf https://github.comgithub.pdf

即可生成对应的PDF文件。

代码使用:

var wkhtmltopdf = require('wkhtmltopdf');
var fs = require('fs');


// URL 使用URL生成对应的PDF
wkhtmltopdf('http://github.com', { pageSize: 'letter' })
  .pipe(fs.createWriteStream('out.pdf'));

除了可以通过URL生成之外,还能通过HTML文件内容生成,就像HTML-PDF一样,只要有HTML格式的字符串就可以生成相应的PDF。

结果如下:
这里写图片描述


3 phantom 模块

phantomjs是基于webkit的无头浏览器,提供相关的JavaScript API,nodejs就相当于对phantomjs的模块化封装,使得它能够在nodejs中使用。

模块安装:

node版本6.X以上的:

npm install phantom –save

node版本5.X的:

npm install phantom@3 –save

node版本4.X及以下的:

npm install phantom@2 –save

以下的例子都是基于node 4.x

代码使用:

var phantom = require('phantom');

phantom.create().then(function(ph) {
    ph.createPage().then(function(page) {
        page.open("https://www.oracle.com/index.html").then(function(status) {
            page.property('viewportSize',{width: 10000, height: 500});
            page.render('/oracle10000.pdf').then(function(){
                console.log('Page rendered');
                ph.exit();
            });
        });
    });
});

代码中,phantom能够通过URL转换为相应的PDF,而且能够通过 page.property('viewportSize',{width:width,height:height})来设置生成的PDF的宽度和高度。

此例phantom中并没有分页,它是以整个浏览器截图的形式,获取全文,转化为PDF格式。

选择phantom的主要原因就是便于设置PDF的宽度,更能兼容HTML的排版。

结果如下:

这里写图片描述

相关 [nodejs 利用 phantom] 推荐:

Nodejs中利用phantom把html转为pdf或图片格式 - younglao的博客 - CSDN博客

- -
最近在项目中遇到需要把html页面转换为pdf的需求,并且转换成的pdf文件要保留原有html的样式和图片. 也就是说,html页面的图片、表格、样式等都需要完整的保存下来. 最初找到三种方法来实现这个需求,这三种方法都只是粗浅的看了使用方法,从而找出适合这个需求的方案:. wkhtmltopdf 工具.

nodejs快速入门

- AreYouOK? - 淘宝数据平台与产品部官方博客 tbdata.org
主要介绍了一下node.js的发展, 现状, 安装, 使用.

NodeJS学习笔记

- - Web前端 - ITeye博客
今天开始学习NodeJS,在这里做个笔记,记录一下我的学习历程,也方便以后参考. Node.js® 是一个基于  Chrome V8 引擎 的 JavaScript 运行时. 简单的说 Node.js 就是运行在服务端的 JavaScript. Node.js 是一个基于Chrome JavaScript 运行时建立的一个平台.

使用phantom-limb 模拟Touch 事件

- - ITeye博客
下载 phantom-limb.js. 注意phantom-limb位置. // 在这里可以直接监听touch事件了. 测试结果在Canvas上可以正常写字,表示通过. 已有 0 人发表留言,猛击->> 这里<<-参与讨论. —软件人才免语言低担保 赴美带薪读研.

NodeJS与Mysql的交互

- - CSDN博客推荐文章
把Mysql Module装到 NodeJS中.   JS脚本 mysqlTest.js. //加载mysql Module  .   //要创建的数据库名  .     //要创建的表名  . 作者:qxs965266509 发表于2013-8-17 9:47:35 原文链接. 阅读:0 评论:0 查看评论.

nodejs web开发入门: Simple-TODO Nodejs 实现版

- Aleafs - CNode社区
看到simple todo的各种python版本实现, 我也来凑凑热闹…. 既然已经有这么多python版本了, 我就对比实现了一个Simple-TODO的nodejs版本: Node TODO, 模版和樣式全部copy自web.py版本.. 源代码: https://github.com/fengmk2/todo.

Vision Research 推出 Phantom v1210 与 v1610,极度放慢你的脚步

- Fox - Engadget 中国版
不论你手滑掉落的冰淇淋速度有多快,Vision Research 最新推出的高速摄影机都可以将一切过程纪录的巨细靡遗(不过可以的话看影片前我还是想要吃完它). 厂商形容这次推出的 Phantom v1610 与 v1210 为「世界上最快速的百万像素级高速数字摄影机」. v1210 具有撷取 12,000 fps 到 16,000 fps 高速影像的能力,可选配 12GB、24GB 或 48GB 的储存空间,而更高阶的 v1610 则是来到了 650,000 fps,甚至是 (牺牲点画质后)可达到一百万 fps 的超高速动态录像,可选配 24GB、48GB 或 96GB 的储存空间.

Quantum Phantom 将智能型手机变身无线鼠标

- Lamo - Engadget 中国版
上次我们看到 Ben Wu 时,他还正埋首于 Quantum Phantom -- 一个让网络摄影机(Webcam)成为电脑鼠标的程序雏形. 而现在他将此概念经由手机搭载的相机镜头扩展到智能手机的范畴. 其透过 WiFi 连接 Linux 计算机与 Android 手机,再把相机所录制的视讯建立为一个影像串流的服务器来操控电脑,并于影片中成功的运用此技术在屏幕上画出了一个笑脸.

無痛安裝 NodeJS 和 Node Framework Express

- Hming - 小惡魔 - 電腦技術 - 工作筆記 - AppleBOY
直接到官網下載 Stable 的版本吧,目前是 node-v0.4.10.tar.gz,也可以先看看 API Document. 安裝 Ububtu 相關套件. 下面會使用最原始的編譯方式,所以必須安裝 g++ 套件,否則下 ./configure 的時候,會吐出來沒有安裝過的套件. 兩種方法:1.用 apt-get install nodejs 2.

nodejs-post文件上传原理详解

- never-online - CNode社区
浅谈HTTP中Get与Post的区别. 其中请求报文中的开始行和首部行包含了常见的各种信息,比如http协议版本,方法(GET/POST),accept-language,cookie等等. 而’实体主体’一般在post中使用,比如我们用表单上传文件,文件数据就是在这个’实体主体’当中. 写这篇教程的起因是因为在学习nodejs的过程中,想要自己实现一些文件上传的功能,于是不得不去研究POST.