原文传送门：https://www.ic365club.com/article/detail?id=MA217p10rc08
开发的需求中难免会遇到下载文件的要求，下载自定义HTML文件的需求尤为显著。而不是所有的用户都知道HTML，但是知道和使用pdf的肯定多余HTML的，将HTML文件转pdf提供下载优化用户体验自然也就成为各位内卷的又一目标啦！
[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-kRxh9Tvd-1633685073551)(/article/img/AI21bk10pz08.jpg “奋斗”)]
加油奥利给冲起来（别想歪了）
文章目录
思路
其实吧，其实吧方法挺多的，看大家接受哪种了。
1.前端客户自己生成图片，我的网站有几个demo。https://www.ic365club.com/picture/,类似这样的形式，但是局限比较大。我当时做的时候遇到了很多bug，很久没有去看了（bug运行起来就不要动它了）。兼容性不好，会受到浏览器、终端、内核、样式的影响。【pass】
2.使用python来搞，python大法好啊。但是网上看了一圈说速度也是不快，不能说慢，只能说不快。（知道的大佬可以评论区科普哈哈）【pass】
[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-zL1don5B-1633685073553)(http://img.doutula.com/production/uploads/image/2019/08/10/20190810417473_icDjId.jpg “python”)]
3.1使用nodejs模块html-pdf。这个还算可以，但是不支持远程url和一些标签渲染不出来，比如有的img标签，但有的又可以。【备选】
[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-XwBSsxaw-1633685073554)(http://img.doutula.com/production/uploads/image/2020/02/05/20200205899703_YNsciS.jpg “妙啊”)]
3.2使用nodejs模块puppeteer，这个模块不像上面的那个，这个是调用Chrome内核做无头浏览器，本质上是使用浏览器生成的。这个有点明显可以使用远程url也可以使用本地链接，而且对样式的渲染也比较好，出来的是彩色的。
[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-RVtZLhI0-1633685073555)(http://img.doutula.com/production/uploads/image/2019/01/01/20190101274861_vPERiw.png “成了”)]
方法一
使用nodejs模块html-pdf。
安装
npm i html-pdf
最好使用全局安装，有的依赖就是要全局安装才不会报错的。我在U盘安装了好几次都失败了，全局一次就成功了。
举例
var fs = require('fs');
var pdf = require('html-pdf');// 这种则是依靠自己本事转pdf的，这种方式样式兼容不太好，渲染结果是黑白的
var html = fs.readFileSync('pdf2.html', 'utf8');
var options = { format: 'Letter' };// api请查看npm，因为一直再更新，请根据官方为主。
pdf.create(html, options).toFile('./businesscard.pdf', function(err, res) {
if (err) return console.log(err);
console.log(res); // { filename: '/app/businesscard.pdf' }
});
关于更多的请参照官网。
方法二
使用nodejs模块puppeteer
安装
npm i puppeteer
npm i puppeteer-core
最好使用全局安装，有的依赖就是要全局安装才不会报错的。我在U盘安装了好几次都失败了，全局一次就成功了。
安装这个包时会安装一个浏览器内核，上面说过这个包是操作无头浏览器来生成的。
[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-Uez791Aj-1633685073556)(/article/img/AI217e10f108.png “内核”)]
使用
const puppeteer = require('puppeteer');
(async () => {
const browser = await puppeteer.launch();
const page = await browser.newPage();
await page.goto(__dirname+'/pdf.html', { //这个可以渲染出图片甚至跨域的图片
waitUntil: 'networkidle2',
});
await page.pdf({ path: 'hn1.pdf', format: 'a4' }); // 如果已有该文件会报错
await browser.close();
})();
第6行我渲染的是本地的文件所以取了文件的绝对路径。
关于具体的options还是请大家参考npm。
https://www.npmjs.com/package/puppeteer-core
中文文档
https://zhaoqize.github.io/puppeteer-api-zh_CN/#/
api文档
右上角“相关资料”下载完成api
总结
1.尽量全局安装
2.出错仔细看报错，一般是缺了某个依赖，安装一下即可
3.我用的node的两个包的速度差不多，都不快
4.搜了一下python的方法，说比较慢我就没有尝试python了，感兴趣的尝试了麻烦告诉我一哈哈
[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-d3rn2bNm-1633685073556)(http://img.doutula.com/production/uploads/image/2018/05/23/20180523081041_cRohPg.gif “响指”)]
原文传送门：https://www.ic365club.com/article/detail?id=MA217p10rc08
——————————
转载请注明出处！！！
本文首发：https://www.ic365club.com
ic365club是知识分享和学习交流的扁平化平台，欢迎广大爱好学习的伙伴一起加入。