# ページ全体のスクリーンショット

> 公開Webページの上部から縦に長い範囲を無料で取得するオンラインツールで、ページ全体の取得にはAPIまたはログインが必要です。

長いWebページを一枚の画像として取得する無料のオンラインツールです。無料ツールで取得できるのは、ページ上部から指定した高さまでの範囲で、登録は不要です。ページ全体の長さを取得するには、ログインするか、APIのfull_pageを使います。

## 主な仕様

- 登録なしで無料の場合、制限は訪問者ごとに適用されます。毎分10回、一日あたり50回まで利用でき、そのうち一日あたり5回までURLを指定できます。ログインしている場合：ページ全体のスクリーンショットは、高さ5,000pxまでの画像で2クレジットかかります。それを超える分は5,000px（端数を含む）ごとに1クレジットずつ加算され、16,384pxまでで最大5クレジットです。高さは出力ピクセルで数えるため、device_scale_factorが2の場合は高さも倍になります。ジョブは2クレジットで予約され、実際の画像の高さに応じて精算されます。
- 無料ツールは、ページ上部から2000pxまでの範囲を取得します。ページ全体の取得には、ログインするか、APIでfull_pageを使います。
- full_pageは、ページ全体を取得し、出力の高さは16,384pxまでです。上限より高いページは切り取られ、結果にtruncatedと表示されます。出力はPNGまたはJPEGです。
- アカウント登録なしの無料利用では、訪問者ごとに毎分10件、毎日50件まで変換でき、透かしは入りません。ログインしているユーザーは、レンダリングごとに1クレジットを使用します。毎月100無料クレジットが付与されます。
- ファイルは自動的に削除されます。アカウント登録なしの場合は変換後10分、無料アカウントの場合は1日で削除されます。
- 開発者は、APIキーを付けてPOST https://api.aiipworld.com/v1/renderを送信すると、同じレンダリングを実行できます。詳しくはスクリーンショットAPIページをご覧ください。

## 使い方

1. ページのアドレスを貼り付け、画面幅を選びます。
2. 取得する高さを選びます。無料ツールでは、一覧に表示される上限まで選べます。
3. 「スクリーンショットを撮る」をクリックし、結果の画像をダウンロードします。
4. ページ全体を取得する場合は、下のコード例（full_pageをtrueに設定したリクエスト）をコピーし、APIキーを使って実行します。

## 無料ツールと full_page の違い

無料ツールは、ページの上部から縦に長いウィンドウ分を取得します。取得の高さは2000pxまでです。とても長いページは、一枚の画像に収まらないことがあります。

匿名で使う場合は、セキュリティ確認を完了する必要があります。ログインしているユーザーは、セキュリティ確認が不要で、クレジットを使って取得できます。

ログインしている場合の取得は、full_pageによる実際のページ全体の取得です。ただし、下に示す高さの上限があります。

full_pageはAPIで、APIキーを使って利用します。取得した結果は10分後に削除され、履歴は残りません。

## full_pageの高さの上限と切り取り

full_pageで出力される画像の高さは、16,384pxが上限です。高さは、ページのCSSの高さに device_scale_factor を掛けた値です。2xの場合、ページはCSSの高さの半分で上限に達します。

上限より高いページは、その高さで画像が切り取られます。ジョブの結果には出力が切り取られたことが表示されるため、画像が不完全であることを確認できます。

高いページを取得した場合のクレジットは、次のとおりです。ページ全体のスクリーンショットは、高さ5,000pxまでの画像で2クレジットかかります。それを超える分は5,000px（端数を含む）ごとに1クレジットずつ加算され、16,384pxまでで最大5クレジットです。高さは出力ピクセルで数えるため、device_scale_factorが2の場合は高さも倍になります。ジョブは2クレジットで予約され、実際の画像の高さに応じて精算されます。

## Web ページ スクリーンショット 全体で長いページを取得する方法

無料ツールは、ページ全体ではなく上部だけを取得し、2000pxで止まります。ページ全体の長さを取得するには、ログインするか、APIでfull_pageをtrueに設定します。

full_pageの結果は、16,384pxまでの一枚の高い画像になります。ページがそれより長い場合は画像が切り取られ、ジョブの結果に切り取られたと表示されます。

無料ツールは、ログインしていない訪問者としてサーバー上でページを読み込みます。そのため、画像にはログインしていない人が見る内容が表示されます。

## 遅れて読み込まれる画像の扱い

多くの長いページは、スクロールしたときに画像を読み込みます（遅延読み込み）。取得の際にはページをスクロールしないため、これらの画像が欠けることがあります。

APIのwait_untilは、ページが読み込み完了とみなすタイミングを指定します。指定できるのは、load、domcontentloaded、networkidle、commitです。初期値はloadです。

wait_for_selectorには、遅れて表示される要素のセレクターを指定します。delay_msでは10秒まで待機時間を指定できます。

## コードでページ全体のスクリーンショットを取得する

コードから取得する場合は、/v1/renderにリクエストを送ります。urlを指定し、outputをpng（またはjpeg）に設定し、optionsの中でfull_pageをtrueにします。APIキーはAuthorization: Bearerのヘッダーにトークンとして入れます。

失敗したジョブとタイムアウトしたジョブのクレジットは返却されます。一括処理用のエンドポイントはないため、ページごとに一回ずつリクエストを送ります。各ジョブは新しいブラウザのコンテキストで実行され、Cookieやキャッシュはジョブ同士で共有されません。カスタムヘッダーとuser agentはAPIで設定できます。

処理の流れは次のとおりです。

- POST /v1/render にリクエストを送ると、202 とjob_idが返ります。
- GET /v1/jobs/:id を、statusがsucceeded、failed、timeoutのいずれかになるまで確認します。
- succeededになったら、download_urlから画像をダウンロードします。このリンクは有効期間が短いため、ジョブが成功したらすぐに保存してください。

## ブラウザで開くページとの違い

ブラウザは、開いているページを自分のウィンドウに表示します。このツールは、ヘッドレスChromium（画面を持たないブラウザエンジン）を使い、リソースを制限したワーカーコンテナ内でサーバー上にページを読み込みます。各ジョブには時間制限があります。

レンダリングサーバーは、ブラウザのCookieや開いているタブを使いません。JavaScriptは標準で実行されるため、スクリプトで作られた内容も画像に表示されることがあります。

## ページ全体の画像をAPIで取得する

自分のコードからページ全体を取得する場合は、APIキーを使ってfull_pageオプションを使います。このオプションは無料のWebツールにはありません。

ページ全体が上限より長い場合は、16,384pxで切り取られます。画像を使う前に、ジョブの結果で出力が切り取られたかどうかを確認してください。

## Chromeの機能と本ツールの違い

Chromeの開発者ツールには「フルサイズのスクリーンショットをキャプチャ」（Capture full size screenshot）というコマンドがあります。これは、自分のブラウザで開いているページを対象に、ファイルをパソコンに保存します。

本ツールは公開アドレスを対象とし、インストールは不要です。ブラウザが使えるデバイスならどこからでも利用でき、ページは自分のウィンドウではなくサーバー上で読み込まれます。fullpage screenshotやfull page screen captureと呼ばれる取得も、結果はどちらも一枚の高い画像です。

## 一枚の画像でWebページ全体を取得する方法

コードから取得する場合は、上で説明したfull_pageオプションを使います。多くのページを取得する場合は、ページごとに一回のAPIリクエストを送ります。APIはヘッドレスChromiumを使って処理します。

スマートフォンのスクロールスクリーンショットは、複数の画面をつなぎ合わせます。本ツールでは、サーバーがページを一枚の高い画像として取得するため、スクロールや結合は必要ありません。ブラウザの拡張機能も不要で、このページから利用できます。

## よくある質問

### 無料ツールでページ全体を取得できないのはなぜですか？

ページ全体は非常に高くなることがあり、レンダリングのコストもかかるためです。匿名で使うWebツールは、2000pxまでの範囲に制限されています。full_pageはAPIキーでのみ有効です。

### ページ全体を取得するにはどうすればよいですか？

無料アカウントを作成してAPIキーを取得し、full_pageをtrueに設定したリクエストを送ります。コード例は上のセクションにあります。ページ全体のスクリーンショットは、高さ5,000pxまでの画像で2クレジットかかります。それを超える分は5,000px（端数を含む）ごとに1クレジットずつ加算され、16,384pxまでで最大5クレジットです。高さは出力ピクセルで数えるため、device_scale_factorが2の場合は高さも倍になります。ジョブは2クレジットで予約され、実際の画像の高さに応じて精算されます。無料アカウントには、毎月100クレジットが含まれます。

### full_pageに高さの上限はありますか？

はい、出力は16,384pxまでに制限されています。ページがそれより高い場合は、その高さで画像が切り取られ、ジョブの結果に切り取られたと表示されます。

### 画像の下の部分が欠けるのはなぜですか？

取得の前にページをスクロールしないため、スクロールで読み込まれる内容が欠けることがあります。APIのdelay_msとwait_untilの設定で、ページの読み込みに時間を与えられます。

### ログインが必要なページを取得できますか？

無料ツールではできません。無料ツールはログインしていない訪問者としてページを開きます。APIではカスタムリクエストヘッダーを指定できます。コピーが許可されているページだけを取得してください。

### 取得した画像はどのくらい保存されますか？

Webツールの結果は10分後に削除されます。APIの結果は、プランの保存期間の間保持されます。保存期間は結果の下と料金ページに表示されます。

### ウェブサイトのページ全体のスクリーンショットを撮るにはどうすればよいですか？

アドレスを貼り付け、画面幅を選び、「スクリーンショットを撮る」をクリックします。無料ツールはページの上部から2000pxまで取得します。ページ全体を取得する場合は、ログインするか、APIキーでfull_pageをtrueに設定します。取得できるのは公開されたhttpとhttpsのアドレスだけです。

### 非常に高いページには、PNGとJPEGのどちらを使うのがよいですか？

PNGが既定の形式で、可逆圧縮のため文字をくっきり残せます。JPEGは、特に写真でファイルサイズが小さくなるのが一般的です。qualityオプションで画質とサイズのバランスを決められ、これはJPEGにのみ適用されます。ファイルサイズが重要な非常に高いページでは、JPEGが現実的な選択になることもあります。

### ページ全体の取得には、固定ヘッダーや固定要素も含まれますか？

ページによって異なります。固定ヘッダーや固定要素は、ページ自身のCSSで配置されるため、高い画像では画面で見た表示と違って見えることがあります。結果を使う前に、テストで取得して確認してください。

### ページのURLからスクリーンショットを取得するにはどうすればよいですか？

URL入力欄にURLを貼り付け、「スクリーンショットを撮る」をクリックします。無料ツールはページの上部から2000pxまで取得するので、結果から画像をダウンロードします。APIでは、完了したジョブがダウンロード用のdownload_urlを返します。短時間で期限が切れるため、ジョブが成功したらすぐに保存してください。

### Webページ全体のスクリーンショットはどう撮りますか？

アドレスを貼り付け、画面幅を選び、「スクリーンショットを撮る」をクリックします。無料ツールは上部から2000pxまで取得します。Webページ全体を取得するには、ログインするか、APIキーでfull_pageをtrueにします。出力の高さは16,384pxまでです。

### ブラウザの拡張機能は必要ですか？

いいえ、必要ありません。Webツールなので、何もインストールせずに使えます。公開アドレスを貼り付け、画像をダウンロードするだけです。

### Cookieの同意バナーを表示させずにページ全体を取得するには？

APIには、同意ボタンのクリック、要素の非表示、CSSの追加を行うオプションはなく、Cookieも送信しません。そのため、新しい訪問者に表示されるバナーは画像に写ることがあります。方法は三つあります。javascriptをfalseに設定すると、スクリプトで描画されるバナーを止められますが、他のスクリプトで作られた内容も消えます。outputをhtmlにしてレンダリング後のHTMLを取得し、自分のコードでバナーを削除してから、base_urlにページのアドレスを指定し、javascriptをオフにしてhtmlとして送る方法もあります。clipで必要な範囲だけを保存する方法もあります。どの方法が合うかはページによるため、実際のページで試してください。

### Chromeでページ全体のスクリーンショットを撮るにはどうすればよいですか？

Chromeの開発者ツールで「フルサイズのスクリーンショットをキャプチャ」（Capture full size screenshot）を使うと、自分のブラウザで開いているページを取得し、ファイルをパソコンに保存できます。本ツールは公開アドレスをサーバー上で取得するため、インストールは不要です。無料ツールは2000pxまでで、ページ全体にはログインするか、APIのfull_pageオプションが必要です。

## 関連ツール

- [WebページをPDFに変換](https://aiipworld.com/ja/tools/url-to-pdf/index.md)
- [HTMLを画像に変換](https://aiipworld.com/ja/tools/html-to-image/index.md)
- [HTMLをJPGに変換](https://aiipworld.com/ja/tools/html-to-jpg/index.md)

ページ： https://aiipworld.com/ja/tools/full-page-screenshot/
