Docly Child

検索結果のスクレイピング

2317 views

この記事では、WEBページから情報を取得する方法を説明します。

【できるようになること】

  • ScrapePageアクションを利用
  • スクレイピング結果をシートに書き込む

 要件の確認

ワークフローを構築する前に今回作成するフローの要件を確認しましょう。

Googleで特定のキーワードを検索。

検索結果のタイトルとURLをスプレッドシートにリスト化する。

Google検索/空のスプレッドシート

この記事で紹介するワークフローでは以下の作業内容を設定します。

  • Google検索を開く
  • 検索ワードを入力する
  • 検索を実行する
  • 検索結果からタイトルとリンク先URLをスクレイピングする
  • スクレイピング結果をスプレッドシートに書き込む

 ワークフローの設定例

下記手順にてワークフローを設定します。

  • OpenBrowserアクションを設定します。
  • URLパラメータに「https://www.google.com/?hl=ja」を入力します。
  • TypeTextアクションを設定します。
  • CSSセレクタにはtextarea、文字列には「福岡市 観光」を入力します。

ここまで設定したら、検索バーに文字入力できているか実行して確認してみましょう。

 
 

検索バーに「福岡市 観光」と正しく入力されていることを確認したら、次にEnterキーを押して検索の実行を行う設定をします。

  • SendKeysアクションを設定します。
  • CSSセレクタにbody、キーには["Enter"]を入力します。
  • ブラウザにはTypeTextのアウトプットが設定されていることを確認します。
    ※空欄の場合にはTypeTextのアウトプットを引継ぐ設定をします。

ここまで設定したら、再度実行して検索結果のページが表示されているか確認してみましょう。「福岡市 観光」の検索結果ページが表示されていれば実行の成功です。

 

実際のブラウザでスクレイピング箇所を確認します。

今回取得するのは、以下画像の赤枠の部分です。
ScrapePageアクションでは、赤枠部分をまとめて一気に取得することが可能です。

 

スクレイピングする位置のCSSセレクタを確認します。

今回は1ページ内の全検索結果のうち、タイトルとリンク(URL)を取得することが目的です。よって、各検索結果が共通で持っているCSSセレクタを見つけ出す必要があります。

※CSSセレクタ取得の詳細はこちらをご参照ください

確認の結果、今回取得した要素群のCSSセレクタは以下であることが判明しました。

.yuRUbf a

※リンクのURLはa要素に含まれます。

スクレイピング箇所の確認ができたら、実際にスクレイピングアクションを設定します。

  • ScrapePageアクションを設定します。
  • CSSセレクタに4の確認結果を入力します。
    .yuRUbf a
  • ブラウザには、SendKeysのアウトプットが設定されていることを確認します。
    ※空欄の場合にはSendKeysのアウトプットを引継ぐ設定をします。
 

ScrapePageアクションを設定したら、ワークフローを実行してみましょう。
実行結果を見ると、以下のようなコードが並んでいます。
  • innerText:取得した要素のテキスト
  • href:取得した要素が持っているリンク先URL

今回はスクレイピングの実行結果の中から「innerText」と「href」の2つの項目をスプレッドシートに書き込んでいきます。

スクレイピング結果を書き込むためのスプレッドシートを準備します。

  • GetSperadsheetアクションを設定します。
  • プロバイダIDを選択します。
  • 書き込むスプレッドシートを選択します。

参考:CSVをGoogle Spreadsheetに転記する

ScrapePageの実行結果はリスト形式になっているので、ForEachの繰り返しを利用して、各要素をスプレッドシートに書き込みを行います。

  • ForEachの繰り返しを設定します。
  • 「繰り返すリスト」には、ScrapePageのアウトプットを紐づけます。
  • 「要素を格納する変数名」には、「data」と入力します。
 

スプレッドシートへの書き込みには、AppendValuesアクションを利用します。

  • AppendValuesアクションをForEachの中に設定します。
  • Spreadsheetの項目には、GetSpreadsheetのアウトプットを紐つけます。
  • 範囲には、任意のシート名を入力します。
  • 値には、 ["${data.innerText}","${data.href}"]を入力します。

これでワークフロー設定は以上になります。お疲れ様でした!!

最後にワークフローを実行して、1.で確認したイメージ通りの結果になっているか確認してみましょう。

GoogleのCSSセレクタは、変動することがあります。
2023-08-02時点のCSSセレクタは以下となります。

.yuRUbf a, .DhN8Cf a

※ページ上部の「完成イメージ」もご参照ください。

※画像はクリックで拡大できます

このワークフローはお手元で複製可能です。方法はこちらをご参照ください。

# ブラウザを開く
+open_browser_1:
  action>: OpenBrowser
  url: 'https://www.google.com/?hl=ja'
  lang: 'ja-JP'
  timeZone: 'Asia/Tokyo'
  headless: true
  useShadowDomSelector: false
  private: false

# 文字入力
+type_text_1:
  action>: TypeText
  browser: +open_browser_1
  selector: textarea
  text: '福岡市 観光'
  clearValue: false
  ignoreError: true
  private: false

# キーを送信_Enterキーを叩く
+send_keys_1:
  action>: SendKeys
  browser: +type_text_1
  selector: body
  keys: ["Enter"]
  waitAfter: 3000
  ignoreError: true
  private: false

# スクレイピング  
+scrape_page_1:
  action>: ScrapePage
  browser: +send_keys_1
  selector: '.yuRUbf a, .DhN8Cf a'
  text_only: false
  ignoreError: true
  private: false

# 既存のスプレッドシートを取得
+get_spreadsheet_1:
  action>: GetSpreadsheet
  provider: ''
  spreadsheet_id: ''
  private: false
  meta:
    display:

# 各要素について繰り返す
+for_each_1:
  for_each>:
    data: +scrape_page_1
  _do:

    # 末尾に値を追加_タイトルとURLをシートに書き込む
    +append_values_1:
      action>: AppendValues
      spreadsheet: +get_spreadsheet_1
      range: 'シート名!A:A'
      values: ["${data.innerText}","${data.href}"]
      private: false

 複数のページからスクレイピングする

複数のページから情報を取得する場合は、繰り返し処理を入れる必要があります。

繰り返し処理を入れた場合のアプローチ方針としては、以下3つが代表的です。

  1. xページ目まで繰り返す
  2. 次のページボタンがある限り、最大x回繰り返す
  3. 総件数から、ページ数を算出して繰り返す

本セクションでは、上記3つの内容を紹介します。
Webページのサンプルとして、本サイトを使用します。
参考:変数を使ってページ遷移する

本サイトで「変数」と検索し、3ページ目までの結果をスクレイピングする例を紹介します。

ポイントは以下3点です。

  • 繰り返しを追加している
  • 繰り返しの中に、スクレイピング系のアクションを入れている
  • 繰り返しの最後で、次のページ遷移するボタンをクリックしている

これ以外は、基本的に上述のGoogleと変わりません。

 

※「キーを送信」について…当サイトでは次のページボタンをクリックする前にページをスクロールしないとエラーになることが確認できています。これを回避するため=ページをスクロールするために設定してあります。

次のページボタンがある限り繰り返す例を紹介します。

ポイントは以下5点です。

  • 繰り返しを追加している
  • 繰り返しの中に、スクレイピング系のアクションを入れている
  • 繰り返しの中で、次のページボタンがあるか?を検知している。
  • 繰り返しの中で、次のページボタンの有無に応じた条件分岐処理を実行している。
  • 繰り返しの最後で、次のページ遷移するボタンをクリックしている

総件数から、ページ数を算出して繰り返す例を紹介します。

この方法は、「全x件」など総件数が記載のあるサイトで有効です。

 

ポイントは以下5点です。

  • 繰り返しを追加している
  • 繰り返しの中に、スクレイピング系のアクションを入れている
  • 繰り返しの前に、WEBサイトから総件数を取得するアクションを入れる
  • 繰り返しの回数には、${Math.ceil(総件数の変数 / 1ページあたりの表示件数)}として、繰り返し回数を割り出す
  • 繰り返しの最後で、次のページ遷移するボタンをクリックしている
※Math.ceil()は、括弧内の数字を切り上げることができます。
※総件数を取得する際に、数字のみを取り出すには正規表現の使用が有効です。
正規表現については以下ページをご覧ください。

このワークフローはお手元で複製可能です。方法はこちらをご参照ください。

# ブラウザを開く_AUTOROサポートサイトで「変数」と検索した結果 1ページ目
+open_browser_1:
  action>: OpenBrowser
  url: 'https://support.autoro.io/?s=%E5%A4%89%E6%95%B0&post_type=docs'
  lang: 'ja-JP'
  timeZone: 'Asia/Tokyo'
  headless: true
  windowSize: '1280 x 720'
  useShadowDomSelector: false
  private: false

# 既存のスプレッドシートを取得
+get_spreadsheet_1:
  action>: GetSpreadsheet
  provider: ''
  spreadsheet_id: ''
  private: false
  meta:
    display: null

# 繰り返し_最大3ページ数分
+loop_1:
  loop>: 3
  _do:

    # スクレイピング
    +scrape_page_1:
      action>: ScrapePage
      browser: +open_browser_1
      selector: 'div.b_top_post_content > a'
      text_only: false
      ignoreError: true
      private: false

    # 各要素について繰り返す
    +for_each_1:
      for_each>:
        data: +scrape_page_1
      _do:

        # リストを作成
        +create_list_1:
          action>: CreateList
          items: ["${data.innerText}","${data.href}"]
          private: false

        # 末尾に値を追加
        +append_values_1:
          action>: AppendValues
          spreadsheet: +get_spreadsheet_1
          range: '書き込み先シート名!A:A'
          values: +create_list_1
          private: false

    # キーを送信_最下部までスクロール(本サイトではこの操作が必要です)
    +send_keys_1:
      action>: SendKeys
      browser: +open_browser_1
      selector: body
      keys: ["End"]
      ignoreError: true
      private: false

    # クリック_次のページへ
    +click_1:
      action>: Click
      browser: +open_browser_1
      selector: 'a.next.page-numbers'
      confirm: true
      waitAfter: 2500
      ignoreError: true
      timeout: 4000
      private: false

# ブラウザを閉じる
+close_browser_1:
  action>: CloseBrowser
  browser: +open_browser_1
  private: false

このワークフローはお手元で複製可能です。方法はこちらをご参照ください。

# ブラウザを開く_AUTOROサポートサイトで「salesforce」と検索した結果 1ページ目
+open_browser_1:
  action>: OpenBrowser
  url: 'https://support.autoro.io/?s=salesforce'
  lang: 'ja-JP'
  timeZone: 'Asia/Tokyo'
  headless: true
  windowSize: '1280 x 720'
  useShadowDomSelector: false
  private: false

# 既存のスプレッドシートを取得
+get_spreadsheet_1:
  action>: GetSpreadsheet
  provider: ''
  spreadsheet_id: ''
  private: false
  meta:
    display:

# 繰り返し_次のページボタンがある限り、最大10ページ数分
+loop_1:
  loop>: 10
  _do:

    # スクレイピング
    +scrape_page_1:
      action>: ScrapePage
      browser: +open_browser_1
      selector: 'div.b_top_post_content > a'
      text_only: false
      ignoreError: true
      private: false

    # 各要素について繰り返す
    +for_each_1:
      for_each>:
        data: +scrape_page_1
      _do:

        # リストを作成
        +create_list_1:
          action>: CreateList
          items: ["${data.innerText}","${data.href}"]
          private: false

        # 末尾に値を追加
        +append_values_1:
          action>: AppendValues
          spreadsheet: +get_spreadsheet_1
          range: 'シート24!A:A'
          values: +create_list_1
          private: false

    # 要素を見つける_次のページボタンはあるか?
    +find_element_1:
      action>: FindElement
      browser: +open_browser_1
      find_by: selector
      value: 'a.next.page-numbers'
      timeout: 3000
      visible: true
      private: false

    # 変数に保存_次のページボタンの有無
    +store_value_1:
      action>: StoreValue
      key: hasNextPage
      value: +find_element_1
      private: false

    # 真のとき_次のページボタンあり
    +if_1:
      if>: ${hasNextPage}
      _do:

        # キーを送信_最下部までスクロール(本サイトではこの操作が必要ですが、必要のないサイトもあります)
        +send_keys_1:
          action>: SendKeys
          browser: +open_browser_1
          selector: body
          keys: ["End"]
          ignoreError: true
          private: false

        # クリック_次のページへ
        +click_1:
          action>: Click
          browser: +open_browser_1
          selector: 'a.next.page-numbers'
          confirm: true
          waitAfter: 2500
          ignoreError: true
          timeout: 4000
          private: false

    # 真のとき_次のページボタンなし
    +if_2:
      if>: ${!hasNextPage}
      _do:

        # テキストを作成
        +text_1:
          action>: Text
          text: '次のページボタンがありません。繰り返しを終了します'
          private: false

        # 繰り返しを終了する
        +break_if_1:
          break_if>: true

このワークフローはお手元で複製可能です。方法はこちらをご参照ください。

# ブラウザを開く_AUTOROサポートサイトで「変数」と検索した結果 1ページ目
+open_browser_1:
  action>: OpenBrowser
  url: 'https://support.autoro.io/?s=salesforce'
  lang: 'ja-JP'
  timeZone: 'Asia/Tokyo'
  headless: true
  confirm: true
  windowSize: '1280 x 720'
  useShadowDomSelector: false
  private: false

# 既存のスプレッドシートを取得
+get_spreadsheet_1:
  action>: GetSpreadsheet
  provider: ''
  spreadsheet_id: ''
  private: false
  meta:
    display: null

# テキストを作成 総件数を取得します(当サイトには総件数の表記がないため、テキストを作成しています。)
+text_2:
  action>: Text
  text: 55
  private: false

# 変数に保存
+store_value_2:
  action>: StoreValue
  key: count
  value: +text_2
  private: false

# 繰り返し回数を計算
+loop_1:
  loop>: ${Math.ceil(count / 10)}
  _do:

    # スクレイピング
    +scrape_page_1:
      action>: ScrapePage
      browser: +open_browser_1
      selector: 'div.b_top_post_content > a'
      text_only: false
      ignoreError: true
      private: false

    # 各要素について繰り返す
    +for_each_1:
      for_each>:
        data: +scrape_page_1
      _do:

        # リストを作成
        +create_list_1:
          action>: CreateList
          items: ["${data.innerText}","${data.href}"]
          private: false

        # 末尾に値を追加
        +append_values_1:
          action>: AppendValues
          spreadsheet: +get_spreadsheet_1
          range: 'シート24!A:A'
          values: +create_list_1
          private: false

    # キーを送信 本サイトではこの操作が必要ですが、必要のないサイトもあります
    +send_keys_1:
      action>: SendKeys
      browser: +open_browser_1
      selector: body
      keys: ['Enter']
      ignoreError: true
      private: false

    # クリック_次のページへ
    +click_1:
      action>: Click
      browser: +open_browser_1
      selector: 'a.next.page-numbers'
      confirm: true
      waitAfter: 2500
      ignoreError: true
      timeout: 4000
      private: false
<ScrapePage>スクレイピング

このページは役に立ちましたか?