Chromeで大きなウェブページのスクリーンショットをキャプチャする

Webページが非常に大きい（数MB）。私はこれらの拡張機能を試しましたが、すべて失敗しました：

• スクリーンキャプチャ（by Google） -画像のない新しいタブが表示されます
• Pixlr Grabber-保存を押した後、「500」リクエストエラーが発生する
• キャプチャーWebページのスクリーンショット-Fireshot -Webページが大きすぎてRAMに保存されることを告げると、エラーが発生しますInsufficient video memory: You need at least -2365 MB of RAM（それはとんでもないことで、1 GBが好きです）
• WebページとWebCamのスクリーンショット -画像が表示されない
• 素晴らしいスクリーンショット-キャプチャして注釈を付ける - capturing...と表示され、完了したら、いくつかのボタンを備えた新しいタブを開きます。「完了」を押すと、preparing your image...永遠に表示されます。

実際に機能するウェブサイトの画面キャプチャツールを知っていますか？

Chromeを使用している場合は、CuttyCaptを使用します。これは、Webkitのレンダリングを画像にキャプチャします。

CutyCaptは、WebKitによるWebページのレンダリングをSVG、PDF、PS、PNG、JPEG、TIFF、GIF、BMPなどのさまざまなベクトルおよびビットマップ形式にキャプチャする小さなクロスプラットフォームのコマンドラインユーティリティです。Internet Explorerに基づく同様のツールについては、IECaptを参照してください。

私はWindowsでPhantomJSを使用することになり、使用しました...

screenshot.js

var page = require('webpage').create();

page.open('http://gigantic-web-page.com', function () {
    page.render('test.png');
    phantom.exit();
});

これをphantomjsフォルダーにダンプしてから、もう1つのファイル、screenshot.cmdをダンプします。

phantomjs --ignore-ssl-errors=yes --cookies-file=cookies.txt --web-security=no screenshot.js

これらの両方のファイルをphantomjsフォルダーに入れて、screenshot.cmdを実行します。巨大なページの40 MBのpngファイルを生成したところ、しばらく時間がかかりましたが、最終的に出力されました。

Chromeで大きなウェブページのスクリーンショットをキャプチャしますか？Webページが非常に大きい（数MB）。Screen Capture（by Google）を試しました-画像が含まれていない新しいタブが表示されます

それは、使用するcanvas要素に癖があるためです。無視してファイルを保存し、ファイルを開きます。大丈夫です。

少し前に、空のタブの問題も発生し（ページ全体の機能を使用する場合は多少一般的であるように思われます）、ひばりで、[Save]とにかくボタンをクリックしました。結果のファイルを開いたとき（好奇心から、それは空白か0x0のどちらかになると思いました）、画像がそこだけでなく正しいことに驚きました。いいね。

もちろん、これは保存する前に拡張機能の（限定された）画像編集ツールを使用できないことを意味しますが、それではどうでしょうか。MSPaintなどを簡単に使用できます（私は常に変更なしで保存し、コピーを変更します）。

これは、v59以降のChromeで実現できます。

開発者ブログでの発表

ビデオチュートリアル

手順の概要（テキストが必要な場合）：

1. オープンな開発ツール
2. デバイスのツールバーを切り替えます
3. デバイスのツールバーで必要な解像度を設定します
4. デバイスツールバーの[その他のオプション]オーバーフローメニューを選択します
5. [スクリーンショットをキャプチャ]または[フルサイズのスクリーンショットをキャプチャ]を選択します
6. スクリーンショットはダウンロードフォルダーに保存されます