puppeteer参数 puppeteer原理

转载

lingyuli 2024-05-27 16:13:51

文章标签 puppeteer参数 puppeteer node.js java 执行上下文 文章分类 运维

“ 大数据时代，衍生出了许多跟数据相关的公司和行业。在这个数据为王的时代，每个人都必须掌握一手获取数据的能力！”

puppeteer参数 puppeteer原理_执行上下文

—

什么是Puppeteer?

Puppeteer 是一个 Node 库，它提供了一个高级 API 来通过 DevTools 协议控制 Chromium 或 Chrome。我们来看看Puppeteer单词原本的意思：

puppeteer参数 puppeteer原理_node.js_02

Puppete 的原意为木偶，即很多90后小时候听的木偶奇遇记的故事里面讲述的那个说谎后鼻子会变长的“小孩”。根据这个单词的意思，我们就很清楚的明白Puppeteer的执行原理就是像操纵木偶的人一样，通过各种方式(接口)进行操纵浏览器帮你执行各种操作的工具。

puppeteer参数 puppeteer原理_node.js_03

截至目前，Puppeteer的最新版本为v5.5.0，于2020年11月16日更新

—

Puppeteer 能帮我们具体做什么？

简单来说，你能在浏览器里做的大部分事情，Puppeteer都可以做！像打开标签页，打开百度，输入搜索关键词，点击搜索，点击下一页....等等你的日常操作行为都能模拟，其它的你不常使用的楷哥也整理了一些：

生成页面 PDF
抓取 SPA（单页应用）并生成预渲染内容（即“SSR”（服务器端渲染））
自动提交表单，进行 UI 测试，键盘输入等
创建一个实时更新的自动化测试环境
使用最新的 JavaScript 和浏览器功能直接在最新版本的Chrome中执行测试
捕获网站的timeline trace，帮助你分析该网站的性能问题
测试浏览器的自动化扩展

—

Puppeteer 为什么可以做到控制浏览器？

Puppeteer之所以可以帮助我们做这么多，首先我们需要分析下Puppeteer的整体架构:

puppeteer参数 puppeteer原理_puppeteer_04

我们可以从图中看到Puppeteer将浏览器分为了几个部分：Browser（浏览器）,Context(上下文)，Page(页面或标签)，Workers(工人)等部分，他们之间的关系是：

Puppeteer 使用 DevTools 协议与浏览器进行通信。
Browser 实例可以拥有浏览器上下文。
BrowserContext 实例定义了一个浏览会话并可拥有多个页面。
Page 至少有一个框架：主框架。可能还有其他框架由 iframe 或框架标签创建。
frame 至少有一个执行上下文 - 默认的执行上下文 - 框架的 JavaScript 被执行。一个框架可能有额外的与扩展关联的执行上下文。
Worker 具有单一执行上下文，并且便于与 WebWorkers 进行交互。

—

Puppeteer VS Puppeteer-core？

Puppeteer从v1.7.0开始，每个版本都会发布两个包：

Puppeteer
Puppeteer-core

Puppeteer是浏览器自动化的产品。安装后，它会下载一个版本的 Chromium，然后使用Puppeteer-core 驱动工作。作为最终用户产品，Puppeteer支持一堆方便的 PUPPETEER* env 变量来调整行为。Puppeteer-core 是一个核心库来帮助驱动任何支持 DevTools 协议的东西。Puppeteer-core 在安装时不会下载 Chromium。作为一个库，Puppeteer-core 是完全是通过其编程接口驱动的并忽略所有PUPPETEER* env 变量。

总结一下，Puppeteer-core 与 Puppeteer不同的地方：