Page 类
Page 提供方法与浏览器中的单个标签页或 扩展程序后台页面 进行交互。
一个浏览器实例可能包含多个 Page 实例。
签名:
export declare abstract class Page extends EventEmitter<PageEvents>
扩展: EventEmitter<PageEvents>
备注
此类的构造函数被标记为内部函数。第三方代码不应直接调用构造函数或创建扩展 Page 类的子类。
示例 1
此示例创建了一个页面，将其导航到一个 URL，然后保存一个屏幕截图
import puppeteer from 'puppeteer';
(async () => {
const browser = await puppeteer.launch();
const page = await browser.newPage();
await page.goto('https://example.com');
await page.screenshot({path: 'screenshot.png'});
await browser.close();
})();
Page 类扩展了 Puppeteer 的 EventEmitter 类，并将发出各种事件，这些事件在 PageEvent 枚举中进行了记录。
示例 2
此示例记录单个页面load事件的消息
page.once('load', () => console.log('Page loaded!'));
要取消订阅事件，请使用EventEmitter.off()方法
function logRequest(interceptedRequest) {
console.log('A request was made:', interceptedRequest.url());
}
page.on('request', logRequest);
// Sometime later...
page.off('request', logRequest);
属性
| 属性 | 修饰符 | 类型 | 描述 |
|---|---|---|---|
| accessibility | 只读 | Accessibility | Accessibility 类提供用于检查浏览器辅助功能树的方法。辅助功能树由辅助技术使用，例如屏幕阅读器或开关。 |
| coverage | 只读 | Coverage | Coverage 类提供用于收集有关页面使用的 JavaScript 和 CSS 部分的信息的方法。 |
| keyboard | 只读 | Keyboard | Keyboard 提供了一个用于管理虚拟键盘的 API。高级 API 是Keyboard.type()，它接受原始字符并在页面上生成适当的 keydown、keypress/input 和 keyup 事件。 |
| mouse | 只读 | Mouse | Mouse 类在相对于视窗左上角的视窗主框架 CSS 像素中运行。 |
| touchscreen | 只读 | Touchscreen | Touchscreen 类公开触摸屏事件。 |
| tracing | 只读 | Tracing | Tracing 类公开跟踪审核接口。 |
方法
| 方法 | 修饰符 | 描述 |
|---|---|---|
| $(selector) | 在页面内运行document.querySelector。如果没有任何元素匹配选择器，则返回值将解析为null。 | |
| $$(selector) | 该方法在页面内运行document.querySelectorAll。如果没有任何元素匹配选择器，则返回值将解析为[]。 | |
| $$eval(selector, pageFunction, args) | 此方法在页面内运行Array.from(document.querySelectorAll(selector))，并将结果作为第一个参数传递给pageFunction。 | |
| $eval(selector, pageFunction, args) | 此方法在页面内运行document.querySelector，并将结果作为第一个参数传递给pageFunction。 | |
| addScriptTag(options) | 在页面中添加一个<script>标签，其中包含所需的 URL 或内容。 | |
| addStyleTag(options) | 在页面中添加一个 | |
| addStyleTag(options) | ||
| authenticate(credentials) | 提供用于HTTP 身份验证的凭据。 | |
| bringToFront() | 将页面置于最前面（激活选项卡）。 | |
| browser() | 获取页面所属的浏览器。 | |
| browserContext() | 获取页面所属的浏览器上下文。 | |
| click(selector, options) | 此方法使用selector获取元素，如果需要，将其滚动到视图中，然后使用 Page.mouse 点击元素的中心。如果找不到与selector匹配的元素，则该方法会抛出错误。 | |
| close(options) | ||
| content() | 页面的完整 HTML 内容，包括 DOCTYPE。 | |
| cookies(urls) | 如果没有指定 URL，则此方法将返回当前页面 URL 的 cookie。如果指定了 URL，则仅返回这些 URL 的 cookie。 | |
| createCDPSession() | 创建一个附加到页面的 Chrome Devtools 协议会话。 | |
| createPDFStream(options) | 使用print CSS 媒体类型生成页面的 PDF。 | |
| deleteCookie(cookies) | ||
| emulate(device) | 模拟给定设备的指标和用户代理。 为了帮助模拟，Puppeteer 提供了一系列已知设备，可以通过 KnownDevices 获取。 | |
| emulateCPUThrottling(factor) | 启用 CPU 节流以模拟慢速 CPU。 | |
| emulateIdleState(overrides) | 模拟空闲状态。如果没有设置参数，则清除空闲状态模拟。 | |
| emulateMediaFeatures(features) | ||
| emulateMediaType(type) | ||
| emulateNetworkConditions(networkConditions) | 这不会影响 WebSockets 和 WebRTC 对等连接（参见 https://crbug.com/563644）。要将页面设置为离线，可以使用 Page.setOfflineMode()。 可以通过导入 PredefinedNetworkConditions 使用预定义的网络条件列表。 | |
| emulateTimezone(timezoneId) | ||
| emulateVisionDeficiency(type) | 模拟页面上的给定视力缺陷。 | |
| evaluate(pageFunction, args) | 在页面的上下文中评估函数并返回结果。 如果传递给 | |
| evaluateHandle(pageFunction, args) | ||
| evaluateOnNewDocument(pageFunction, args) | 添加一个函数，该函数将在以下场景之一中被调用 - 每当页面导航时 - 每当子帧附加或导航时。在这种情况下，该函数将在新附加的帧的上下文中调用。 该函数在文档创建后但其任何脚本运行之前被调用。这对于修改JavaScript环境很有用，例如，为 | |
| exposeFunction(name, pptrFunction) | 该方法在页面的 如果puppeteerFunction返回一个 :::note 通过 :::note | |
| focus(selector) | 此方法使用selector获取元素并将其聚焦。如果没有匹配selector的元素，该方法将抛出错误。 | |
| frames() | 附加到页面的所有帧的数组。 | |
| getDefaultTimeout() | 以毫秒为单位的最大时间。 | |
| goBack(options) | 此方法导航到历史记录中的上一页。 | |
| goForward(options) | 此方法导航到历史记录中的下一页。 | |
| goto(url, options) | 将页面导航到给定的url。 | |
| hover(selector) | 此方法使用selector获取元素，如果需要，将其滚动到视图中，然后使用Page.mouse将鼠标悬停在元素的中心。如果没有匹配selector的元素，该方法将抛出错误。 | |
| isClosed() | 指示页面已关闭。 | |
| isDragInterceptionEnabled() | 如果正在拦截拖动事件，则为true，否则为false。 | |
| isJavaScriptEnabled() | 如果页面启用了JavaScript，则为true，否则为false。 | |
| isServiceWorkerBypassed() | true 如果服务工作者被绕过，否则为 false。 | |
| locator(selector) | 为提供的选择器创建一个定位器。有关详细信息和支持的操作，请参阅 定位器。 | |
| locator(func) | 为提供的函数创建一个定位器。有关详细信息和支持的操作，请参阅 定位器。 | |
| mainFrame() | 页面的主框架。 | |
| metrics() | 包含指标作为键值对的对象。 | |
| pdf(options) | 使用print CSS 媒体类型生成页面的 PDF。 | |
| queryObjects(prototypeHandle) | 此方法迭代 JavaScript 堆并查找具有给定原型的所有对象。 | |
| reload(options) | 重新加载页面。 | |
| removeExposedFunction(name) | 此方法从页面的 window 对象中删除先前通过 $Page.exposeFunction() 添加的名为 name 的函数。 | |
| removeScriptToEvaluateOnNewDocument(identifier) | 删除通过 Page.evaluateOnNewDocument 注入页面的脚本。 | |
| screencast(options) | 捕获此 页面 的屏幕录制。 | |
| screenshot(options) | 捕获此 页面 的屏幕截图。 | |
| screenshot(options) | ||
| select(selector, values) | 在所有提供的选项都被选中后，触发 change 和 input 事件。如果不存在与 selector 匹配的 <select> 元素，则该方法将抛出错误。 | |
| setBypassCSP(enabled) | 切换绕过页面的内容安全策略。 | |
| setBypassServiceWorker(bypass) | 切换忽略每个请求的服务工作者。 | |
| setCacheEnabled(enabled) | 根据启用状态切换忽略每个请求的缓存。默认情况下，缓存已启用。 | |
| setContent(html, options) | 设置页面的内容。 | |
| setCookie(cookies) | ||
| setDefaultNavigationTimeout(timeout) | 此设置将更改以下方法和相关快捷方式的默认最大导航时间 | |
| setDefaultTimeout(timeout) | ||
| setDragInterception(enabled) | ||
| setExtraHTTPHeaders(headers) | 页面发起的每个请求都会发送额外的 HTTP 头信息。 :::tip 所有 HTTP 头名称都小写。（HTTP 头不区分大小写，因此这不会影响您的服务器代码。） ::: :::note page.setExtraHTTPHeaders 不保证传出请求中头信息的顺序。 ::: | |
| setGeolocation(options) | 设置页面的地理位置。 | |
| setJavaScriptEnabled(enabled) | ||
| setOfflineMode(enabled) | 将网络连接设置为离线。 它不会更改 Page.emulateNetworkConditions() 中使用的参数。 | |
| setRequestInterception(value) | 激活请求拦截将启用 HTTPRequest.abort()、HTTPRequest.continue() 和 HTTPRequest.respond() 方法。这提供了修改页面发出的网络请求的能力。 启用请求拦截后，每个请求都会被阻塞，除非它被继续、响应或中止；或使用浏览器缓存完成。 有关更多详细信息，请参阅 请求拦截指南。 | |
| setUserAgent(userAgent, userAgentMetadata) | ||
| setViewport(viewport) |
在单个浏览器中有多个页面的情况下，每个页面都可以有自己的视窗大小。 | |
| tap(selector) | 此方法使用 selector 获取元素，如果需要，将其滚动到视图中，然后使用 Page.touchscreen 点击元素的中心。如果找不到与 selector 匹配的元素，则该方法会抛出错误。 | |
| target() | 创建此页面的目标。 | |
| title() | 页面的标题 | |
| type(selector, text, options) | 为文本中的每个字符发送 要按下特殊键，例如 | |
| url() | 页面的 URL。 | |
| viewport() | 返回当前页面视窗设置，不检查实际页面视窗。 这可能是使用之前的 Page.setViewport() 调用设置的视窗，也可能是通过 BrowserConnectOptions.defaultViewport 设置的默认视窗。 | |
| waitForDevicePrompt(options) | 此方法通常与触发来自 WebBluetooth 等 API 的设备请求的操作相结合。 :::caution 此方法必须在发出设备请求之前调用。它不会返回当前活动的设备提示。 ::: | |
| waitForFileChooser(options) | 此方法通常与触发文件选择的动作相结合。 :::caution 此方法必须在启动文件选择器之前调用。它不会返回当前活动的 文件选择器。 ::: | |
| waitForFrame(urlOrPredicate, options) | 等待与给定条件匹配的帧出现。 | |
| waitForFunction(pageFunction, options, args) | 等待提供的函数 pageFunction 在页面的上下文中执行时返回真值。 | |
| waitForNavigation(options) | 等待页面导航到新 URL 或重新加载。当您运行将间接导致页面导航的代码时，此方法很有用。 | |
| waitForNetworkIdle(options) | 等待网络空闲。 | |
| waitForRequest(urlOrPredicate, options) | ||
| waitForResponse(urlOrPredicate, options) | ||
| waitForSelector(selector, options) | 等待 selector 出现在页面中。如果在调用此方法时 selector 已经存在，则该方法将立即返回。如果 selector 在等待 timeout 毫秒后没有出现，则该函数将抛出异常。 | |
| workers() | 与页面关联的所有专用 WebWorkers。 |