みの雑多ブログ

勉強したことをアウトプットしたり、しなかったり

URL指定して画面キャプチャを一括で作成

developers.google.com

CLIで画面キャプチャとるんです

chromeのヘッドレススクリーンショット優秀すぎてびっくり
Firefoxもあるそう。。今回はchromeで。

Windowsコマンドプロンプトde実行

"C:\Program Files\Google\Chrome\Application\chrome.exe" --headless --disable-gpu --screenshot=[画像フォルダ/画像名].png --window-size=1280,1696 [画面キャプチャ撮りたいURL]


URLがあれば、全部すぐに撮れる。
Basic認証かかってるやつはhttps://[ユーザー名]:[パスワード]@www.xxx.com/hogehoge/で。

フルフルとれないところが課題。
ここからは結構大変だったので、やる気元気モリワキじゃない人は離脱で。

API使って画面キャプチャフルフルとる

Davidさんのブログを参考に、と書いてあるので試みる
→ 壁にぶつかる。node.jsワカラナイ
dschnurr.medium.com

とりあえず、node.jsをインストール(ダウンロード | Node.js)する
Node.js command prompt立ち上げる

次は必要なパッケージをインストールする
npm…node package manager
composerにお世話になってるので、それのnode版かぁ~という感じ。

npm init -y
npm install chrome-remote-interface --save
npm install chrome-launcher --save

ファイル実行する

node [ファイル名].js

わぁい、動いた。output.pngでキャプチャ撮れてる。Bufferが非推奨なのかな・・?
って、node.jsわからな過ぎてびっくりした。(javascript分かったら、わかるんじゃねという甘い考えだった)
ちょっと勉強して仕切りなおす。。