如何使用Node.js爬取任意网页资源并输出PDF文件到本地

需求:

  • 使用Node.js爬取网页资源,开箱即用的配置
  • 将爬取到的网页内容以PDF格式输出

如果你是一名技术人员,那么可以看我接下来的文章,否则,请直接移步到我的github仓库,直接看文档使用即可

仓库地址:附带文档和源码

本需求使用到的技术:Node.js和puppeteer

  • puppeteer 官网地址: puppeteer地址
  • Node.js官网地址:链接描述
  • Puppeteer是谷歌官方出品的一个通过DevTools协议控制headless Chrome的Node库。可以通过Puppeteer的提供的api直接控制Chrome模拟大部分用户操作来进行UI Test或者作为爬虫访问页面来收集数据。
  • 环境和安装
  • Puppeteer本身依赖6.4以上的Node,但是为了异步超级好用的async/await,推荐使用7.6版本以上的Node。另外headless Chrome本身对服务器依赖的库的版本要求比较高,centos服务器依赖偏稳定,v6很难使用headless Chrome,提升依赖版本可能出现各种服务器问题(包括且不限于无法使用ssh),最好使用高版本服务器。(建议使用最新版本的Node.js)

小试牛刀,爬取京东资源

const puppeteer = require('puppeteer'); // 引入依赖
(async () => { //使用async函数完美异步
const browser = await puppeteer.launch(); //打开新的浏览器
const page = await browser.newPage(); // 打开新的网页
await page.goto('https://www.jd.com/'); //前往里面 'url' 的网页
const result = await page.evaluate(() => { //这个result数组包含所有的图片src地址
let arr = []; //这个箭头函数内部写处理的逻辑
const imgs = document.querySelectorAll('img');
imgs.forEach(function (item) {
arr.push(item.src)
})
return arr
});
// '此时的result就是得到的爬虫数据,可以通过'fs'模块保存'
})()

复制过去 使用命令行命令 ` node 文件名 ` 就可以运行获取爬虫数据了 这个 puppeteer 的包 ,其实是替我们开启了另一个浏览器,重新去开启网页,获取它们的数据。

  • 上面只爬取了京东首页的图片内容,假设我的需求进一步扩大,需要爬取京东首页中的所有<a> 标签对应的跳转网页中的所有 title的文字内容,最后放到一个数组中。
  • 我们的async函数上面一共分了五步, 只有 puppeteer.launch() ,browser.newPage(), browser.close() 是固定的写法。
  • page.goto 指定我们去哪个网页爬取数据,可以更换内部url地址,也可以多次调用这个方法。
  • page.evaluate 这个函数,内部是处理我们进入想要爬取网页的数据逻辑
  • page.goto和page.evaluate两个方法,可以在async内部调用多次,那意味着我们可以先进入京东网页,处理逻辑后,再次调用page.goto这个函数

注意,上面这一切逻辑,都是puppeteer这个包帮我们在看不见的地方开启了另外一个浏览器,然后处理逻辑,所以最终要调用browser.close()方法关闭那个浏览器。

这时候我们对上一篇的代码进行优化,爬取对应的资源。

const puppeteer = require('puppeteer');
(async () => {
const browser = await puppeteer.launch();
const page = await browser.newPage();
await page.goto('https://www.jd.com/');
const hrefArr = await page.evaluate(() => {
let arr = [];
const aNodes = document.querySelectorAll('.cate_menu_lk');
aNodes.forEach(function (item) {
arr.push(item.href)
})
return arr
});
let arr = [];
for (let i = 0; i < hrefArr.length; i++) {
const url = hrefArr[i];
console.log(url) //这里可以打印
await page.goto(url);
const result = await page.evaluate(() => { //这个方法内部console.log无效
return $('title').text(); //返回每个界面的title文字内容
});
arr.push(result) //每次循环给数组中添加对应的值
}
console.log(arr) //得到对应的数据 可以通过Node.js的 fs 模块保存到本地
await browser.close()
})()

上面有天坑 page.evaluate函数内部的console.log不能打印,而且内部不能获取外部的变量,只能return返回,
使用的选择器必须先去对应界面的控制台实验过能不能选择DOM再使用,比如京东无法使用querySelector。这里由于
京东的分界面都使用了jQuery,所以我们可以用jQuery,总之他们开发能用的选择器,我们都可以用,否则就不可以。

接下来我们直接来爬取Node.js的官网首页然后直接生成PDF

无论您是否了解Node.js和puppeteer的爬虫的人员都可以操作,请您一定万分仔细阅读本文档并按顺序执行每一步

本项目实现需求:给我们一个网页地址,爬取他的网页内容,然后输出成我们想要的PDF格式文档,请注意,是高质量的PDF文档

  • 第一步,安装Node.js ,推荐http://nodejs.cn/download/,Node.js的中文官网下载对应的操作系统包
  • 第二步,在下载安装完了Node.js后, 启动windows命令行工具(windows下启动系统搜索功能,输入cmd,回车,就出来了)
  • 第三步 需要查看环境变量是否已经自动配置,在命令行工具中输入 node -v,如果出现 v10. ***字段,则说明成功安装Node.js
  • 第四步 如果您在第三步发现输入node -v还是没有出现 对应的字段,那么请您重启电脑即可
  • 第五步 打开本项目文件夹,打开命令行工具(windows系统中直接在文件的url地址栏输入cmd就可以打开了),输入 npm i cnpm nodemon -g
  • 第六步 下载puppeteer爬虫包,在完成第五步后,使用cnpm i puppeteer --save 命令 即可下载
  • 第七步 完成第六步下载后,打开本项目的url.js,将您需要爬虫爬取的网页地址替换上去(默认是http://nodejs.cn/)
  • 第八步 在命令行中输入 nodemon index.js 即可爬取对应的内容,并且自动输出到当前文件夹下面的index.pdf文件中

TIPS: 本项目设计思想就是一个网页一个PDF文件,所以每次爬取一个单独页面后,请把index.pdf拷贝出去,然后继续更换url地址,继续爬取,生成新的PDF文件,当然,您也可以通过循环编译等方式去一次性爬取多个网页生成多个PDF文件。

对应像京东首页这样的开启了图片懒加载的网页,爬取到的部分内容是loading状态的内容,对于有一些反爬虫机制的网页,爬虫也会出现问题,但是绝大多数网站都是可以的

const puppeteer = require('puppeteer');
const url = require('./url');
(async () => {
const browser = await puppeteer.launch({ headless: true })
const page = await browser.newPage()
//选择要打开的网页
await page.goto(url, { waitUntil: 'networkidle0' })
//选择你要输出的那个PDF文件路径,把爬取到的内容输出到PDF中,必须是存在的PDF,可以是空内容,如果不是空的内容PDF,那么会覆盖内容
let pdfFilePath = './index.pdf';
//根据你的配置选项,我们这里选择A4纸的规格输出PDF,方便打印
await page.pdf({
path: pdfFilePath,
format: 'A4',
scale: 1,
printBackground: true,
landscape: false,
displayHeaderFooter: false
});
await browser.close()
})()

文件解构设计

数据在这个时代非常珍贵,按照网页的设计逻辑,选定特定的href的地址,可以先直接获取对应的资源,也可以通过再次使用 page.goto方法进入,再调用 page.evaluate() 处理逻辑,或者输出对应的PDF文件,当然也可以一口气输出多个PDF文件~

这里就不做过多介绍了,毕竟 Node.js 是可以上天的,或许未来它真的什么都能做。这么优质简短的教程,请收藏
或者转发给您的朋友,谢谢。

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持我们。

(0)

相关推荐

  • Node.js爬取豆瓣数据实例分析

    一直自以为自己vue还可以,一直自以为webpack还可以,今天在慕课逛node的时候,才发现,自己还差的很远.众所周知,vue-cli基于webpack,而webpack基于node,对node不了解,谈什么了解webpack.所以就自己给自己出了一道题,爬取豆瓣数据,目前还处于初级阶段.今天就浅谈爬取到豆瓣的数据,再另一个页面用自己的方式展现,后续会跟进. 1.需要解决的问题 搭建服务 怎么处理爬到的数据 怎么自动打开默认浏览器 2.搭建服务 搭建服务有好几种方式,一开始我用的http,但是

  • node.js爬虫爬取拉勾网职位信息

    简介 用node.js写了一个简单的小爬虫,用来爬取拉勾网上的招聘信息,共爬取了北京.上海.广州.深圳.杭州.西安.成都7个城市的数据,分别以前端.PHP.java.c++.python.Android.ios作为关键词进行爬取,爬到的数据以json格式储存到本地,为了方便观察,我将数据整理了一下供大家参考 数据结果 上述数据为3月13日22时爬取的数据,可大致反映各个城市对不同语言的需求量. 爬取过程展示 控制并发进行爬取 爬取到的数据文件 json数据文件 爬虫程序 实现思路 请求拉钩网的

  • 利用node.js写一个爬取知乎妹纸图的小爬虫

    前言 说起写node爬虫的原因,真是羞羞呀.一天,和往常一样,晚上吃过饭便刷起知乎来,首页便是推荐的你见过最漂亮的女生长什么样?,点进去各种漂亮的妹纸爆照啊!!!,看的我好想把这些好看的妹纸照片都存下来啊!一张张点击保存,就在第18张得时候,突然想起.我特么不是程序员么,这种手动草做的事,怎么能做,不行我不能丢程序员的脸了,于是便开始这次爬虫之旅. 原理 初入爬虫的坑,没有太多深奥的理论知识,要获取知乎上帖子中的一张图片,我把它归结为以下几步. 准备一个url(当然是诸如你见过最漂亮的女生长什么

  • 手把手教你用Node.js爬虫爬取网站数据的方法

    开始之前请先确保自己安装了Node.js环境,还没有安装的的童鞋请看一下安装教程...... https://www.jb51.net/article/113677.htm https://www.jb51.net/article/57687.htm 直接开始吧 1.在项目文件夹安装两个必须的依赖包 npm install superagent --save-dev SuperAgent(官网是这样解释的) -----SuperAgent is light-weight progressive

  • node.js爬取中关村的在线电瓶车信息

    背景 学习nodejs已经有段时间,网上很多nodejs爬虫的文章,所以着手练习写一段,最近打算买一辆电瓶车来上下班,但又不知道哪个好,网上是各说纷纭啊,于是就想着,干脆用node.js自己写一个小爬虫,来爬一下中关村在线里面电瓶车的信息吧. 简介 该demo采用node.js作为爬虫,为方便,有些地方使用es6语法,如有不懂,欢迎咨询

  • 利用node.js爬取指定排名网站的JS引用库详解

    前言 本文给大家介绍的爬虫将从网站爬取排名前几的网站,具体前几名可以具体设置,并分别爬取他们的主页,检查是否引用特定库.下面话不多说了,来一起看看详细的介绍: 所用到的node主要模块 express 不用多说 request http模块 cheerio 运行在服务器端的jQuery node-inspector node调试模块 node-dev 修改文件后自动重启app 关于调试Node 在任意一个文件夹,执行node-inspector,通过打开特定页面,在页面上进行调试,然后运行app

  • 如何使用Node.js爬取任意网页资源并输出PDF文件到本地

    需求: 使用Node.js爬取网页资源,开箱即用的配置 将爬取到的网页内容以PDF格式输出 如果你是一名技术人员,那么可以看我接下来的文章,否则,请直接移步到我的github仓库,直接看文档使用即可 仓库地址:附带文档和源码 本需求使用到的技术:Node.js和puppeteer puppeteer 官网地址: puppeteer地址 Node.js官网地址:链接描述 Puppeteer是谷歌官方出品的一个通过DevTools协议控制headless Chrome的Node库.可以通过Puppe

  • Node.js抓取中文网页乱码问题和解决方法

    Node.js 抓取非 utf-8 的中文网页时会出现乱码问题,比如网易的首页编码是 gb2312,抓取时会出现乱码 复制代码 代码如下: var request = require('request')  var url = 'http://www.163.com' request(url, function (err, res, body) {      console.log(body) }) 可以使用 iconv-lite来解决 安装 复制代码 代码如下: npm install ico

  • ajax+node+request爬取网络图片的实例(宅男福利)

    注:本文只讨论技术不涉及商业,如有侵权请告知,未经本人同意转载后果自负! 本文是通过浏览器端ajax,node端request-json进行爬取"尤果网"部分图片资源,纯属技术方面兴趣,不涉及商业方面: 先上图: 如果没有node基础请自行学习~ 获取图片原理:通过request请求html文件,利用正则匹配图片路径获取到当前页面图片的数组,发送到浏览器端,进行展示: 1.安装request-json (cnpm i request-json --save) 2.安装express(c

  • Linux使用Node.js建立访问静态网页的服务实例详解

    Linux使用Node.js建立访问静态网页的服务实例详解 一.安装node.js运行所需要的环境,:http://www.jb51.net/article/79536.htm 二.创建node目录(/node/www),并在目录下创建node.js服务文件server.js var http = require('http'); var fs = require('fs');//引入文件读取模块 var documentRoot = '/node/www';//需要访问的文件的存放目录 var

  • Python爬虫爬取一个网页上的图片地址实例代码

    本文实例主要是实现爬取一个网页上的图片地址,具体如下. 读取一个网页的源代码: import urllib.request def getHtml(url): html=urllib.request.urlopen(url).read() return html print(getHtml(http://image.baidu.com/search/flip?tn=baiduimage&ie=utf-8&word=%E5%A3%81%E7%BA%B8&ct=201326592&am

  • Python使用爬虫爬取静态网页图片的方法详解

    本文实例讲述了Python使用爬虫爬取静态网页图片的方法.分享给大家供大家参考,具体如下: 爬虫理论基础 其实爬虫没有大家想象的那么复杂,有时候也就是几行代码的事儿,千万不要把自己吓倒了.这篇就清晰地讲解一下利用Python爬虫的理论基础. 首先说明爬虫分为三个步骤,也就需要用到三个工具. ① 利用网页下载器将网页的源码等资源下载. ② 利用URL管理器管理下载下来的URL ③ 利用网页解析器解析需要的URL,进而进行匹配. 网页下载器 网页下载器常用的有两个.一个是Python自带的urlli

  • python 爬取豆瓣网页的示例

    python作为一种已经广泛传播且相对易学的解释型语言,现如今在各方面都有着广泛的应用.而爬虫则是其最为我们耳熟能详的应用,今天笔者就着重针对这一方面进行介绍. python 语法简要介绍 python 的基础语法大体与c语言相差不大,由于省去了c语言中的指针等较复杂的结构,所以python更被戏称为最适合初学者的语言.而在基础语法之外,python由其庞大的第三方库组成,而其中包含多种模块,而通过模块中包含的各种函数与方法能够帮助我们实现各种各样的功能. 而在python爬虫中,我们需要用到的

随机推荐