【Chrome ヘッドレスモード】大量の画面キャプチャを一括で撮る方法
こんにちは。WebディレクターのNです。
Chromeヘッドレスモード※機能を使って大量キャプチャーを撮る方法はいろいろなサイト様が紹介してくださっているのですが、コマンド（ターミナル）を使ったり、サーバサイドJavaScriptをインストールするのはちょっと敷居が高い……というWebディレクターさんって結構多いのではないでしょうか？
※Chromeブラウザを開かずにコマンドラインやプログラムを使っていろんな処理ができる機能。
そこで今回は、こちらのサイト様を参考にエクセル（VBA）の編集だけでできる方法を試してみましたよ。それではさっそくいってみましょう！
【目次】
- 検証環境
- 取得したいWebページのリストを作成
- VBAコードを書き込む
- ベーシック認証（IDとパスが必要）なページを撮るには
- まとめ
1．検証環境
今回の検証環境はこちら
Windows 10 pro
chrome 最新（2021年5月時点）
Excel 2019
2．取得したいWebページのURLリストを作成
A列には画像を書き出した時の「ファイル名」、B列には取得したい「URL」を書きます。
取得ページが大量にある場合は下記※のツールを使ってリスト化すると効率的かもしれません。
Website Explorer (ウェブサイト・エクスプローラ) ウェブサイトの情報を階層表示する サイト丸ごとダウンロードも可能
※制作者さんによるツール開発は終了しています。ダウンロードの場合はご留意ください。
ここで、任意の場所に書き出し用フォルダ（例：C:/Users/ユーザー名/01）を作成し一旦ファイルを保存します。
3.VBAコードを書き込む
次に、2.で作成したエクセルシートにVBAコードを書き込みます。
①エクセルを新規作成で開いてから
メニューリボン → 開発タブ → VisualBasicの順にクリック。
メニューリボンに「開発タブ」が表示されていない場合はこちらを参照してください。
②記入ボックスにソースコードを書き込む
ソースコードはこちら。赤字の値は用途に応じてカスタマイズ
③マクロ有効ブック形式（.xlsm）で保存
④作成したファイルを開いて実行ボタンをクリックすると…
⑤指定フォルダにちゃんとキャプチャが格納されましたよ！感動！
4.スマホ版、公開前の開発サイト（IDとパスが必要）なページを撮るには
スマホ版の場合はソースコードの-window-sizeの数値を調整、ベーシック認証なページはURLにIDとパスを含めると書き出すことができました※2021年5月時点
IDとPWが入っているのでとり扱いには十分にご注意ください。
例：
|
修正前）https://citrusjapan.co.jp/index.html ↓ 修正後）https://ユーザー名:パスワード@citrusjapan.co.jp/index.html |
5.まとめ
以上、Chromeヘッドレスモードを使って画面キャプチャを一括で撮る方法のご紹介でした。
この手順に慣れてきたら、次はコマンドプロンプトとJavaScriptを使った方法も試してみたいと思います！結果はこのコラムで紹介しますね。
それではまた。
参考サイト：
