前端使用puppeteer 爬虫生成《React.js 小书》PDF并合并( 二 )


3.3 设置 .title 加上序号, 便于在页眉中使用 。
3.4 隐藏 传播一下知识也是一个很好的选择 这一个模块(因为页眉页脚中设置了书的链接等信息,就隐藏这个了)
3.5 给 分页 上一节,下一节加上序号,便于查看 。
3.6 最末尾声明下该 pdf的说明,仅供学习交流,严禁用于商业用途 。
3.7 返回宽高,用于设置视图大小
3.8 设置视图大小,创建生成 pdf
4、关闭浏览器
具体代码:可以查看这里爬虫生成《React.js小书》的 pdf每一小节的代码
// node 执行这个文件// 笔者这里是:node src/puppeteer/reactMiniBook.js
即可生成如下图:每一小节(0-46小节)的 pdf

前端使用puppeteer 爬虫生成《React.js 小书》PDF并合并

文章插图
生成这些后,那么问题来了,就是查看时总不能看一小节,打开一小节来看,这样很不方便 。
于是接下来就是合并这些 pdf成为一个 pdf文件 。
3、合并成一个PDF文件pdf-merge
起初,我是使用在线网站,合并 PDF 。合并的效果还是很不错的 。这网站还是其他功能 。比如 word转 pdf等 。
后来找到社区提供的一个 npmmerge 。(毕竟笔者是写程序的,所以就用代码来实现合并了)
这个 pdf-merge依赖 pdftk
安装 PDFtk
下载并安装
笔者安装后,重启电脑才能使用 。
,安装
笔者在系统安装后,即可使用 。
apt- pdftk
使用例子
const PDFMerge = require('pdf-merge');const files = [`${__dirname}/1.pdf`,`${__dirname}/2.pdf`,];// Buffer (Default)PDFMerge(files).then((buffer) => {...});// StreamPDFMerge(files, {output: 'Stream'}).then((stream) => {...});// 笔者这里使用的是这个// Save as new filePDFMerge(files, {output: `${__dirname}/3.pdf`}).then((buffer) => {...});
知道这些后,可以开始写主程序了 。
简单说下主流程
1、读取到生成的所有 pdf文件路径,并排序(0-46)
2、判断下输出文件夹是否存在,不存在则创建
3、合并这些小节的 pdf保存到新文件 React小书(完整版)-作者:胡子大哈-时间戳.pdf
具体代码:可以查看这里爬虫生成《React.js小书》的 pdf合并 pdf的代码
最终合并的pdf文件可供下载 。百度网盘链接:提取码: m4nd 。下载链接:React小书(完整版)-作者:胡子大哈 。
本想着还可以加下书签和页码,没找到合适的生成方案,那暂时先不加了 。如果读者有好的方案,欢迎与笔者交流 。
小结
1、 是官方出品的node库,可以在浏览器中手动执行的大多数操作都可以使用 完成 。总之可以用来做很多有趣的事情 。
2、用生成每一小节的 pdf,用依赖 pdftk的 pdf-merge npm包, 合并成一个新的 pdf文件 。或者使用等网站合并 。
3、《 React.js小书》,推荐给大家 。爬虫生成 pdf,应该不会对作者@胡子大哈有什么影响 。作者写书服务社区不易,尽可能多支持作者 。
最后推荐几个链接,方便大家学习。
入门教程
初探之前端自动化测试
爬虫生成ES6标准入门 pdf
大前端神器安利之
API中文文档
关于
作者:常以若川为名混迹于江湖 。前端路上 | PPT爱好者 | 所知甚少,唯善学 。
个人博客 使用重构了,阅读体验可能更好些
,相关源码和资源都放在这里,求个 star^_^~
微信交流群,加我微信,注明来源,拉您进前端视野交流群
下图是公众号二维码:若川视野,一个可能比较有趣的前端开发类公众号,目前前端内容不多