Puppeteer 介绍

Puppeteer 翻译是操纵木偶的人，利用这个工具，我们能做一个操纵页面的人。 Puppeteer 是一个 Nodejs 的库，支持调用 Chrome的API来操纵Web ，相比较 Selenium 或是 PhantomJs ,它最大的特点就是它的操作 Dom 可以完全在内存中进行模拟既在 V8 引擎中处理而不打开浏览器，而且关键是这个是Chrome团队在维护，会拥有更好的兼容性和前景。

Puppeteer 用处

• 利用网页生成PDF、图片
• 爬取SPA应用，并生成预渲染内容（即“SSR” 服务端渲染）
• 可以从网站抓取内容
• 自动化表单提交、UI测试、键盘输入等
• 帮你创建一个最新的自动化测试环境（chrome），可以直接在此运行测试用例6.捕获站点的时间线，以便追踪你的网站，帮助分析网站性能问题

Puppeteer 使用

安装 Puppeteer

由于封网，直接下载 Chromium 会失败，可以先阻止下载 Chromium 然后再手动下载它

# 安装命令npm i puppeteer --save# 错误信息ERROR: Failed to download Chromium r515411! Set "PUPPETEER_SKIP_CHROMIUM_DOWNLOAD" env variable to skip download.# 设置环境变量跳过下载 Chromiumset PUPPETEER_SKIP_CHROMIUM_DOWNLOAD=1 # 或者可以这样干，只下载模块而不buildnpm i --save puppeteer --ignore-scripts# 成功安装模块+ puppeteer@0.13.0added 1 package in 1.77s

手动下载 Chromium，下载完后将压缩包解压，会有个 Chromium.app，将其放在你喜欢的目录下，例如 /Users/huqiyang/Documents/project/z/chromium/Chromium.app。正常安装包后 Chromium.app 会在 .local-chromium中

Tip：下载 Chromium 失败解决办法

更换国内Chromium源

PUPPETEER_DOWNLOAD_HOST=https://storage.googleapis.com.cnpmjs.orgnpm i puppeteer

或者用 cnpm 安装

npm install -g cnpm --registry=https://registry.npm.taobao.orgcnpm i puppeteer

点击查阅 Puppeteer API

初试 Puppeteer，截个图吧

知识点

• puppeteer.launch 启动浏览器实例
• browser.newPage() 创建一个新页面
• page.goto 进入指定网页
• page.screenshot 截图

const puppeteer = require('puppeteer');(async () => { const browser = await (puppeteer.launch({ // 若是手动下载的chromium需要指定chromium地址, 默认引用地址为 /项目目录/node_modules/puppeteer/.local-chromium/ executablePath: '/Users/huqiyang/Documents/project/z/chromium/Chromium.app/Contents/MacOS/Chromium', //设置超时时间 timeout: 15000, //如果是访问https页面 此属性会忽略https错误 ignoreHTTPSErrors: true, // 打开开发者工具, 当此值为true时, headless总为false devtools: false, // 关闭headless模式, 不会打开浏览器 headless: false })); const page = await browser.newPage(); await page.goto('https:///hz/buy/'); // 获取页面标题 let title = await page.title(); console.log(title); // 获取汽车品牌 const BRANDS_INFO_SELECTOR = '.dd-all.clearfix.js-brand.js-option-hid-info'; const brands = await page.evaluate(sel => { const ulList = Array.from($(sel).find('ul li p a')); const ctn = ulList.map(v => { return v.innerText.replace(/\s/g, ''); }); return ctn; }, BRANDS_INFO_SELECTOR); console.log('汽车品牌: ', JSON.stringify(brands)); let writerStream = fs.createWriteStream('car_brands.json'); writerStream.write(JSON.stringify(brands, undefined, 2), 'UTF8'); writerStream.end(); // await bodyHandle.dispose(); // 获取车源列表 const CAR_LIST_SELECTOR = 'ul.carlist'; const carList = await page.evaluate((sel) => { const catBoxs = Array.from($(sel).find('li a')); const ctn = catBoxs.map(v => { const title = $(v).find('h2.t').text(); const subTitle = $(v).find('div.t-i').text().split('|'); return { title: title, year: subTitle[0], milemeter: subTitle[1] }; }); return ctn; }, CAR_LIST_SELECTOR); console.log(`总共${carList.length}辆汽车数据: `, JSON.stringify(carList, undefined, 2)); // 将车辆信息写入文件 writerStream = fs.createWriteStream('car_info_list.json'); writerStream.write(JSON.stringify(carList, undefined, 2), 'UTF8'); writerStream.end(); browser.close();})();

运行结果

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