Lv3 ・ 120 分
Step 5 ブラウザ自動化（ビジネス向け）
動的サイトや通常取得では足りないページを、Dify と Browser API で扱えるようにする。
このハンズオンでは、通常のページ取得では足りない場面に対応します。たとえば、JavaScript で後から内容が出るページ、スクロールしないと見えない一覧、ボット判定が強いサイトです。
ここでは Playwright のコードは使わず、Dify の Web スクレイピング機能 や Browser API を使ったマネージド運用 という考え方で進めます。
ゴールと所要時間
- ゴール: 動的ページを対象に、ブラウザを遠隔で動かす手段が必要か判断し、取得から要約までつなげる
- 所要時間: 約 120 分
- 難易度: Lv3
前提
- Step 1 認証（ビジネス向け） が完了している
- Dify を使える
- 動的サイトの実例が 1 つある
まず判断すること
次のどれに当てはまるかを見ます。
| 状況 | まず試す手段 |
|---|---|
| HTML を取れば十分 | 通常のページ取得 |
| ページ読み込み後に情報が出る | ブラウザ自動化 |
| スクロールで商品が増える | ブラウザ自動化 |
| ボット判定で止まりやすい | Browser API やマネージド運用 |
手順 1: 通常取得で足りるかを先に試す
Dify の HTTP Request か Web スクレイピング機能で、まず対象ページをそのまま取得してみます。
確認ポイント:
- 欲しい要素が本文に入っているか
- 商品一覧や記事一覧が途中で切れていないか
- 価格や在庫が空欄になっていないか
足りるなら、その時点で通常取得を採用します。ここで終わるなら一番軽いです。
手順 2: ブラウザ自動化が必要か判断する
次の症状があるなら、ブラウザを遠隔で動かす手段を検討します。
- 画面を開いた直後は空白に近い
- スクロールしないと一覧が増えない
- ボタン操作後に価格や在庫が出る
- 取得結果が何度も不安定
手順 3: Dify で業務フロー化する
ブラウザ自動化を使う場合も、業務での見え方は同じです。
- 入力: URL または商品一覧ページ
- 取得: Browser API またはマネージド運用
- 整理: Dify で必要項目を抽出
- 出力: 表、要約、通知
プロンプト例:
取得したページから、商品名、価格、在庫表示、キャンペーン文言を抜き出し、
Markdown 表で返してください。
スクロール後に見つかった内容も含めてください。手順 4: スクリーンショットを残す
動的ページでは、テキストだけだと確認しづらいことがあります。重要ページでは次も残すのが実務向きです。
- ページ全体のスクリーンショット
- 取得日時
- 対象 URL
これがあると、「AI が見た画面」と「人間が見た画面」の差を確認しやすくなります。
手順 5: どこまで自動化するかを決める
最初は次のどちらかで十分です。
- 半自動: 担当者が URL を入れて実行する
- 定期実行: 重要ページだけ毎朝確認する
ログインが必要な対象や、利用規約が厳しい対象は、社内ルールを確認してから進めます。
実務でのコツ
すべてをブラウザ自動化にしない
重い処理なので、本当に必要なページだけに限定します。
確認用の画像を残す
価格や訴求文言の変化を会議で示すときに役立ちます。
重要項目を固定する
毎回違う項目を抜くと比較しづらいので、最初に表の列を決めます。
次の一歩
ブラウザを遠隔で動かす考え方がつかめたら、最後に AI エージェントからこれらをまとめて呼び出す段階に進みます。