Puppeteer 爬虫
知识点1
chrome 和 chromium 的联系
chrome : google的闭源项目,基于chromium ,扩展更严格
chromium :google的开源项目 ,国产的双核浏览器,基本全基于该项目
知识点2
headless browser 模式
指浏览器的无界面模式,在不打开GUI的情况下,使用浏览器支持的功能
该模式下减少了加载css,js及渲染页面所用到的时间,效率更高
下面正式介绍 Puppeteer
官方定义: Puppeteer 是一个 Node 库,它提供了一个高级 API 来通过 DevTools 协议控制 Chromium 或 Chrome。 Puppeteer中文文档
Puppeteer
使用 DevTools 协议 与浏览器进行通信。Browser
实例可以拥有浏览器上下文。BrowserContext
实例定义了一个浏览会话并可拥有多个页面。Page
至少有一个框架:主框架。 可能还有其他框架由 iframe 或 框架标签 创建。frame
至少有一个执行上下文 - 默认的执行上下文 - 框架的 JavaScript 被执行。 一个框架可能有额外的与 扩展 关联的执行上下文。Worker
具有单一执行上下文,并且便于与 WebWorkers 进行交互。
然后我们就根据上图所示的调用Puppeteer
依次创建相关的对象
首先我们在一个文件夹内 或 项目内执行 yarn add puppeteer 添加相关依赖
然后新建js文件,按照上图所示调用链创建相应的对象,其中每一步都可以加入海量的参数,以下就不意义赘述,可以去http://www.puppeteerjs.com/ 查询具体参数及方法
const puppeteer = require('puppeteer'); // 引入Puppeteer
puppeteer.launch().then(async browser => { // 创建 browser
const page = await browser.newPage(); // 创建 Page
await page.goto('https://www.baidu.com'); // 打开页面
await page.waitForTimeout(600)
// 其他操作...
let content = await page.content(); // 返回页面的完整 html 代码,包括 doctype
await page.pdf({path: 'page.pdf'}); // 页面截图生成PDF文件,必须在headless模式下,有path参数才能保存,没有不存
await page.evaluate(() => Array.from(document.body.querySelectorAll('a[href]'), ({ href }) => href)) // 在页面实例上下文中执行的方法 ,返回执行结果
// 其他操作...
await browser.close(); // 关闭 browser
});
我们今天只说到该插件的基础使用,还有很多更专业,更全面的功能, Puppeteer中文文档
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· 记一次.NET内存居高不下排查解决与启示
· 探究高空视频全景AR技术的实现原理
· 理解Rust引用及其生命周期标识(上)
· 浏览器原生「磁吸」效果!Anchor Positioning 锚点定位神器解析
· 没有源码,如何修改代码逻辑?
· 全程不用写代码,我用AI程序员写了一个飞机大战
· MongoDB 8.0这个新功能碉堡了,比商业数据库还牛
· 记一次.NET内存居高不下排查解决与启示
· 白话解读 Dapr 1.15:你的「微服务管家」又秀新绝活了
· DeepSeek 开源周回顾「GitHub 热点速览」