ChromeのRecorderを利用したPuppeteerスクリプトによるスキャンの作成

Google Chromeブラウザに組み込まれているDeveloper Toolsには、ブラウザのインタラクションを記録し、PuppeteerスクリプトとしてエクスポートできるRecorder機能が備わっています。これは、複雑な認証フローやチェックアウトなどの高度なインタラクションを有効にする際に非常に役立ちます。

本ガイドでは、ChromeのRecorder機能で生成したPuppeteerスクリプトを使用してWebスキャンを作成する方法について説明します。Puppeteerスクリプトを使用することで、ユーザーのチェックアウトなどの複雑な認証やインタラクションのフローを自動化できます。

report.ostorlab.co へアクセスする

1. 新規スキャンへ移動する。

スキャンメニューから、または新規スキャンのショートカットをクリックして、新規スキャン画面へ移動します。

2. Web Appを選択する。

Web Appオプションを選択して、Webスキャンを作成します。

3. ターゲットURLを追加する。

ターゲットとなるURLまたはドメイン名を追加します。

4. 「Full Web Scan」をクリックする

スキャンプロファイルを選択します。

5. 「Continue」をクリックする

Continueボタンをクリックします。

6. オプションのスキャン設定を追加する。

QPSの制限、プロキシ設定、除外URLのリストなどのスキャン設定を追加します。

7. 「Test Credentials」をクリックする

「Test Credentials」セクションへ移動します。

8. 「Script」をクリックする

スクリプトを選択します。

9. スクリプトをアップロードする。

スクリプトを選択し、スクリプトファイルをアップロードします。

10. 「submit」をクリックすると、スキャンが開始されます。

「submit」をクリックしてスキャンメニューに戻ります。スキャンが実行中であることを確認できます。

Puppeteerスクリプトの作成

ChromeからPuppeteerスクリプトを作成するには、以下の手順に従ってください。

1. ChromeでDeveloper Toolsを開く

• Webページ上で右クリックして Inspect を選択するか、Ctrl+Shift+I (Windows/Linux) または Cmd+Option+I (Mac) を押します。
• これによりDeveloper Toolsペインが開き、通常はブラウザウィンドウの右側または下部にドッキングして表示されます。

2. Recorderツールへアクセスする

• Developer Toolsペインで、 Recorder と書かれたタブをクリックします。
• 表示されていない場合は、「>>」アイコンの裏に隠れている可能性があります。このアイコンをクリックし、ドロップダウンから Recorder を選択します。

3. 記録を開始する

• Start Recording ボタンをクリックします。これにより、すべてのブラウザインタラクションのキャプチャが開始されます。
• 対象のWebサイトで認証フローを操作します。例：
• ログインページへ移動する
• ユーザー名とパスワードを入力する
• ログインボタンをクリックする など

4. 記録を停止する

• 認証フローが完了したら、Recorderペインの Stop Recording ボタンをクリックします。

5. 確認とエクスポート

• 記録を停止した後、Recorderペインで記録されたすべてのステップを確認できます。必要に応じて、不要なステップを削除したり、不正確なステップを編集して修正したりできます。
• 記録されたインタラクションをPuppeteerスクリプトとしてエクスポートするには、Recorderペインの Save ボタンまたは Export ボタン（具体的なラベルはChromeのバージョンによって異なります）をクリックします。
• コンピュータ上の保存先を選択すると、 .js ファイルとしてダウンロードされます。