複数Webページのスクリーンショット撮影を自動化する[完全無料]

Excelに記載されたURLの一覧を読み込み、各URLのスクリーンショット撮影を自動化するRPAを作成してみました。

## この記事で紹介している内容
クラウド型のRPAである『クラウドBOT』を使用して、以下のような自動化を作成する手順を紹介しています。
【**人の作業**】
URLの一覧が記載されたExcelファイルを用意。ロボットに参照し、実行する。

【**RPAの処理**】
1.Excelに記載されたURL1件1件に繰り返しアクセスし、Webページ全体のスクリーンショットを撮影する。

## クラウドBOTとは
ブラウザ操作を自動化できる、クラウド型のRPAサービスです。
**ユーザがブラウザで行っている操作を記録し、クラウド上で自動実行できます。** Webページのスクリーンショット撮影も可能で、Webページ全体のスクリーンショット撮影だけでなく、必要な部分のみを撮影する事もできます。

https://www.c-bot.pro/

## 事前準備
スクリーンショットを撮影するページのURLが記載されたExcelファイルを用意します。
1行目をヘッダーとし、「URL」とします。
![excel_list.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/459104/a328b3f8-5595-cdd5-bb76-1c405ca33c5c.png)

## RPAの作成手順
### BOTエディタ画面を開く
クラウドBOTにログインし、ダッシュボード画面の「**BOTを作る**」ボタンをクリックします。
![1_ダッシュボード画面.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/459104/41b68e87-ba16-0b86-d2de-20920a2062e8.png)

「**仮想ブラウザを起動する**」ボタンをクリックし、仮想ブラウザを起動します。
![2_仮想ブラウザを起動する.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/459104/93059fb1-eca6-0aa0-121b-3883c81ed52c.png)

### Excelをグループデータにインポートする
データ欄の「**ビューア**」をクリックし、データビューアを開きます。
![３_データビューアを開く.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/459104/2b89acdd-4fe2-bda6-f173-97490a34c3b1.png)

データビューア内の「**グループ追加**」から以下のようなグループデータを作成します。
グループ名は「**URL一覧**」とし、グループ内のデータとして「**URL**」を追加します。
(データ名はExcelファイルのヘッダーに合わせます。)
![４_グループデータを作成する.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/459104/2d6f5dde-6e87-a619-c1f4-cecd158adb82.png)

「**インポート・エクスポート**」ボタンをクリックし、「**参照**」ボタンから、事前準備で作成したExcelを参照します。
「**インポート**」ボタンをクリックして、データをインポートします。
![5_データをインポートする.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/459104/f67c8932-51f7-1a47-97b5-dd81dd64009d.png)
「OK」ボタンをクリックしてデータビューアを閉じます。

### Webページにアクセスし、スクリーンショットを撮影する操作を記録する
「**ブラウザ操作を記録する**」ボタンをクリックします。
画面左下のデータ欄から、先ほど作成した「**URL一覧**」グループを選択し、「**グループを使う**」ボタンをクリックします。
タスクにグループが追加されます。
![6_タスクにグループを挿入.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/459104/cf566f8e-9c61-c3da-e5b9-8b3f8696c9a3.png)
※この青いグループ内に記録した操作が、先程インポートしたエクセルの行数分繰り返し処理されます。

仮想ブラウザのURL欄をクリックし、「**データを貼り付け**」>「**URL一覧**」>「**URL**」を選択します。

![7_URLを貼り付け.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/459104/fe4a7d3a-518e-6354-8d99-6add553d340a.png)

ページが表示されますので、画面右上の三点リーダーから「**スクリーンショットをコピー**」を選択します。
![8_スクリーンショットを撮影.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/459104/c9afe504-b39c-f993-c023-15545fb6da7a.png)

データ名に「**スクリーンショット**」と入力し、「**コピーする**」ボタンをクリックします。
![9_スクリーンショット名を入力.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/459104/f73fb5ad-0c19-1971-1f8c-110c123c3d33.png)

「**グループ処理を完了する**」ボタンをクリックし、全てのURLのスクリーンショットを繰り返し撮影します。
![10_グループ処理を完了.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/459104/8c591540-3f5f-3cd1-1a03-f64911a563e6.png)

処理が完了したら、データビューアを確認します。
ファイル名をクリックするとスクリーンショットの画像が確認できます。
![11_データビューアを確認.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/459104/ee5cbf2b-2622-544c-8d41-3ddb0c506752.png)

### BOTを保存する
最後にBOTを保存します。
この時、「**入力データを選択**」をクリックし、URLにチェックを入れて保存します。
![12_BOTを保存.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/459104/5202aace-3e04-f0ed-ed62-ffaf6d6ec5c1.png)

こうする事で、別のURLリストが記載されたExcelをインポートしてBOTを実行できるようになります。
![BOTを実行.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/459104/70ee722d-b8c0-205b-73e5-1b311654bacc.png)

## さいごに
クラウドBOTを使用して、Excelシートに記載したURLのスクリーンショット撮影を自動化する方法を紹介しました。競合調査やデザイン・レイアウトチェックなどの効率化に活用できるのではないでしょうか。

デフォルトで使用できるクラウドブラウザの連続実行時間は10分です。大量のURLに対してスクリーンショット撮影を行いたい場合は、「**Cloud BOT Agent インストール版**」(無料)を活用する事で、最大2時間まで連続実行させる事ができます。必要に応じて検討くださ

https://www.c-bot.pro/ja/agent/install_edition/