Page クラス

Page は、ブラウザ内の単一のタブまたは拡張機能のバックグラウンドページとやり取りするためのメソッドを提供します。

注記

1 つの Browser インスタンスには、複数の 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 クラスは、ブラウザのアクセシビリティツリーを検査するためのメソッドを提供します。アクセシビリティツリーは、スクリーンリーダーやスイッチなどの支援技術で使用されます。
coverage	読み取り専用	カバレッジ	Coverage クラスは、ページで使用された JavaScript と CSS の部分に関する情報を収集するためのメソッドを提供します。
keyboard	読み取り専用	キーボード	Keyboard は、仮想キーボードを管理するための API を提供します。高レベルの API は Keyboard.type() であり、これは生の文字を受け取り、ページで適切な keydown、keypress/input、keyup イベントを生成します。
mouse	読み取り専用	マウス	Mouse クラスは、ビューポートの左上隅を基準としたメインフレームの CSS ピクセル単位で動作します。
touchscreen	読み取り専用	タッチスクリーン	Touchscreen クラスは、タッチスクリーンイベントを公開します。
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)		目的の URL またはコンテンツを使用して、ページに <script> タグを追加します。
addStyleTag(options)		目的の URL を持つ <link rel="stylesheet"> タグ、またはコンテンツを持つ <style type="text/css"> タグをページに追加します。 page.mainFrame().addStyleTag(options) のショートカットです。
addStyleTag(options)
authenticate(credentials)		HTTP 認証 の資格情報を提供します。
bringToFront()		ページを前面に表示します（タブをアクティブにします）。
browser()		ページが属するブラウザを取得します。
browserContext()		ページが属するブラウザコンテキストを取得します。
click(selector, options)		このメソッドは selector を持つ要素を取得し、必要に応じてビューポートにスクロールしてから、Page.mouse を使用して要素の中央をクリックします。selector に一致する要素がない場合、このメソッドはエラーをスローします。
close(options)
content()		DOCTYPE を含むページの完全な HTML コンテンツ。
cookies(urls)		URL を指定しない場合、このメソッドは現在のページ URL の Cookie を返します。URL を指定した場合、それらの URL の Cookie のみが返されます。
createCDPSession()		ページに接続された Chrome Devtools Protocol セッションを作成します。
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 PeerConnections には影響しません（https://crbug.com/563644 を参照）。ページをオフラインにするには、Page.setOfflineMode() を使用できます。 PredefinedNetworkConditions をインポートすることで、事前に定義されたネットワーク条件のリストを使用できます。
emulateTimezone(timezoneId)
emulateVisionDeficiency(type)		ページで指定された視覚障害をシミュレートします。
evaluate(pageFunction, args)		ページのコンテキストで関数を評価し、結果を返します。 page.evaluate に渡された関数が Promise を返す場合、関数は Promise が解決されるのを待ってその値を返します。
evaluateHandle(pageFunction, args)
evaluateOnNewDocument(pageFunction, args)		次のシナリオのいずれかで呼び出される関数を追加します。 - ページが移動されたとき - 子フレームがアタッチまたは移動されたとき。この場合、関数は新しくアタッチされたフレームのコンテキストで呼び出されます。 この関数は、ドキュメントが作成された後、そのスクリプトが実行される前に呼び出されます。これは、JavaScript 環境を修正する場合（例：Math.random をシードする場合）に役立ちます。
exposeFunction(name, pptrFunction)		このメソッドは、ページの window オブジェクトに name という名前の関数を追加します。呼び出されると、この関数は node.js で puppeteerFunction を実行し、puppeteerFunction の戻り値に解決される Promise を返します。 puppeteerFunction が Promise を返す場合、それは待機されます。 :::注記 page.exposeFunction を介してインストールされた関数は、移動後も存続します。 :::注記
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 を参照して、詳細とサポートされているアクションを確認してください。
locator(func)		指定された関数のロケーターを作成します。Locator を参照して、詳細とサポートされているアクションを確認してください。
mainFrame()		ページのメインフレーム。
metrics()		メトリクスをキー/値のペアとして含むオブジェクト。
pdf(options)		print CSS メディアタイプを使用して、ページの PDF を生成します。
queryObjects(prototypeHandle)		このメソッドはJavaScriptヒープを反復処理し、指定されたプロトタイプを持つすべてのオブジェクトを見つけます。
reload(options)		ページを再読み込みします。
removeExposedFunction(name)		このメソッドは、以前にPage.exposeFunction() を介して追加された、name と呼ばれる関数をページのwindowオブジェクトから削除します。
removeScriptToEvaluateOnNewDocument(identifier)		Page.evaluateOnNewDocumentによってページに挿入されたスクリプトを削除します。
screencast(options)		このpageのスクリーンキャストをキャプチャします。
screenshot(options)		このpageのスクリーンショットをキャプチャします。
screenshot(options)
select(selector, values)		指定されたすべてのオプションが選択されると、changeイベントとinputイベントをトリガーします。selectorに一致する<select>要素がない場合、このメソッドはエラーをスローします。
setBypassCSP(enabled)		ページのContent-Security-Policyのバイパスを有効/無効にします。
setBypassServiceWorker(bypass)		各リクエストに対するサービスワーカーの無視を有効/無効にします。
setCacheEnabled(enabled)		enabledの状態に基づいて、各リクエストに対するキャッシュの無視を有効/無効にします。デフォルトでは、キャッシュは有効になっています。
setContent(html, options)		ページのコンテンツを設定します。
setCookie(cookies)
デフォルトの最大ナビゲーション時間を変更します。		この設定は、以下のメソッドと関連するショートカットのデフォルトの最大ナビゲーション時間を変更します。 - page.goBack(options) - page.goForward(options) - page.goto(url,options) - page.reload(options) - page.setContent(html,options) - page.waitForNavigation(options)
setDefaultTimeout(timeout)
setDragInterception(enabled)
setExtraHTTPHeaders(headers)		追加のHTTPヘッダーは、ページが開始するすべてのリクエストに送信されます。 :::tip すべてのHTTPヘッダー名は小文字になります。（HTTPヘッダーは大文字と小文字を区別しないため、サーバーコードに影響を与えることはありません。） ::: :::注記 page.setExtraHTTPHeadersは、送信リクエストにおけるヘッダーの順序を保証しません。 :::
setGeolocation(options)		ページの地理位置情報を設定します。
setJavaScriptEnabled(enabled)
setOfflineMode(enabled)		ネットワーク接続をオフラインに設定します。 Page.emulateNetworkConditions()で使用されるパラメーターは変更されません。
setRequestInterception(value)		リクエストインターセプトを有効にすると、HTTPRequest.abort()、HTTPRequest.continue()、HTTPRequest.respond()メソッドが有効になります。これにより、ページによって行われたネットワークリクエストを変更する機能が提供されます。 リクエストインターセプトが有効になると、継続、応答、または中止されない限り、ブラウザキャッシュを使用して完了しない限り、すべてのリクエストが停止します。 詳細については、リクエストインターセプトガイドを参照してください。
setUserAgent(userAgent, userAgentMetadata)
setViewport(viewport)		page.setViewportはページのサイズを変更します。多くのウェブサイトは、携帯電話のサイズが変更されることを想定していないため、ページに移動する前にビューポートを設定する必要があります。 単一のブラウザに複数のページがある場合、各ページには独自のビューポートサイズを設定できます。
tap(selector)		このメソッドは、selector で指定された要素を取得し、必要に応じてビューにスクロールしてから、Page.touchscreen を使用して要素の中央をタップします。selector に一致する要素がない場合、このメソッドはエラーをスローします。
target()		このページが作成されたターゲット。
title()		ページのタイトル。
type(selector, text, options)		テキストの各文字に対して、keydown、keypress/input、keyupイベントを送信します。 ControlやArrowDownなどの特別なキーを押すには、Keyboard.press()を使用します。
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が既に存在する場合、メソッドはすぐに返ります。timeoutミリ秒待ってもselectorが表示されない場合、関数はスローします。
workers()		ページに関連付けられているすべての専用のWebWorkers。