java爬虫抓取动态网页(之前第一篇教程.js爬虫入门（一）爬取静态页面)
优采云 发布时间: 2022-02-01 18:11java爬虫抓取动态网页(之前第一篇教程.js爬虫入门（一）爬取静态页面)
之前的第一篇爬虫教程，Node.js爬虫介绍（一）爬取静态页面讲解静态网页的爬取，很简单，但是如果遇到一些动态网页（ajax），可以直接用之前发送请求的方法我们都拿不到我们想要的数据，这时候需要爬取动态网页，selenium和puppeteer都不错。
这里推荐使用puppeteer，不为别的，只因为他是谷歌自己的，一直在维护更新。以下是翻译的官方文档介绍
Puppeteer 是一个 Node 库，提供一系列高级接口，通过 DevTools（开发者工具）协议控制 Chrome 或 Chromium（谷歌开源）。它默认以无头模式运行（无浏览器 UI），也可以通过配置以正常模式运行。
它可用于：
首先，我们必须在使用它之前安装它。默认安装会附带下载最新的 Chromium，大小约为 300M。
npm install puppeteer
如果本地已经有较新版本的chrome，可以只安装core版本，但是启动puppeteer时需要配置本地chrome的路径。
npm install puppeteer-core // 核心版本
假设我们现在要爬取拉狗网的前端招聘信息。这是一个动态页面。使用下面的示例尝试抓取。
因为chrome操作都是异步操作，为了避免回调地狱，推荐使用es7的async await。这种语法具有高度可读性，官方文档也是如此。
首先使用 puppeteer 启动浏览器并打开该动态页面
这里需要注意的是，如果使用的是本地浏览器，需要在启动浏览器配置中传入本地chrome路径
const browser = await puppeteer.launch({
executablePath: 'C:/Users/Administrator/AppData/Local/Google/Chrome/Application/chrome.exe'
})
在chrome环境中执行函数获取需要的数据然后返回节点的执行环境
上图是我们需要的数据的dom位置。在chrome环境执行的函数中，我们需要获取并整理需要的数据。
let list = document.querySelectorAll('.s_position_list .item_con_list li')
let res = []
for (let i = 0; i < list.length; i++) {
res.push({
name: list[i].getAttribute('data-positionname'),
company: list[i].getAttribute('data-company'),
salary: list[i].getAttribute('data-salary'),
require: list[i].querySelector('.li_b_l').childNodes[4].textContent.replace(/ |\n/g, ''),
})
}
return res
这里有一个调试技巧，获取数据的函数可以直接写在chrome的控制台中，方便调试
最后附上完整代码
const puppeteer = require('puppeteer');
(async () => {
// 启动浏览器
const browser = await puppeteer.launch({
headless: false, // 默认是无头模式，这里为了示范所以使用正常模式
})
// 控制浏览器打开新标签页面
const page = await browser.newPage()
// 在新标签中打开要爬取的网页
await page.goto('https://www.lagou.com/jobs/list_web%E5%89%8D%E7%AB%AF?px=new&city=%E5%B9%BF%E5%B7%9E')
// 使用evaluate方法在浏览器中执行传入函数（完全的浏览器环境，所以函数内可以直接使用window、document等所有对象和方法）
let data = await page.evaluate(() => {
let list = document.querySelectorAll('.s_position_list .item_con_list li')
let res = []
for (let i = 0; i < list.length; i++) {
res.push({
name: list[i].getAttribute('data-positionname'),
company: list[i].getAttribute('data-company'),
salary: list[i].getAttribute('data-salary'),
require: list[i].querySelector('.li_b_l').childNodes[4].textContent.replace(/ |\n/g, ''),
})
}
return res
})
console.log(data)
})()
运行结果
动态网页的爬取到这里也已经完成了，但是puppeteer功能远不止这些，它还有很多强大的API可以使用。您可以转到官方文档。
第三期会讲到如何定时执行爬虫并存入数据库。
