Docly Child

AUTORO AssistantのREC機能を使用する

785 views

この記事では、Google Chrome拡張機能「AUTORO Assistant」のREC設定機能を使ってブラウザでの操作を記録する方法をご紹介します。

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

  • 手動操作を記録し、コード※として出力できる
  • 出力されたコード※を利用し、ワークフロー作成の手間を省く

※ここで使うコードはYAMLコードといい、これ以降は「YAMLコード」という表記で記載します

なおサイトの構造上、セレクタが取得できない箇所がある等の場合、この機能だと構築が難しいことがあります。補助的な機能としてご利用いただけますと幸いです。


AUTORO Assistant

AUTOROでサイトを操作する時に便利な3つの機能を持っています。

  • CSSセレクタの右クリック取得
  • サイト操作のREC機能
  • ExtractData機能

 AUTORO Assistantのインストール

AUTORO Assistantのダウンロードにつきましては、こちらからお問い合わせください。

また、すでにAUTOROをご契約いただいているお客様は、AUTOROログイン後に画面左下のサポートチャットの「ホーム」画面からダウンロードいただけます。

 REC機能の使い方

AUTORO AssistantのREC機能の基本的な操作方法をご紹介します。具体的な設定例は、「ワークフローの設定例」をご覧ください。

操作を記録したいブラウザ上で、拡張機能に追加したAUTORO Assistantのアイコンをクリックします。
画像のようなウィンドウが表示され、一番左の「●REC」ボタンを押すと記録が開始します。
ただし、記録には操作ごとに指定を行う必要があるため、以降すべての挙動が記録されるわけではありません。
 
また、タブ移動など一部の操作は記録対象として認識されません。これらは後でワークフローを編集する際に、手動で組み込む必要があります。

任意の場所でクリックすると、画像のようなメニューが表示されます。

該当箇所で行いたい操作をメニューから選択すると、その操作が記録されます。
AUTORO Assistantのアイコンを押すと、その時点までのログを確認することができます。操作ミスの場合、ここで取り消すことも可能です。

またレコーディング中にAUTORO Assistantのアイコンを押すと、
 ①レコーディングを終了
 ②レコーディングを中断(「▶RESUME」で再開)
が可能です。

 

「2.レコーディング中」項目の添付画像の「■STOP」を押しレコーディングを終了すると、記録した操作がYAMLコードで表示されます。この画面では、以下の操作が行えます。

①記録を破棄して、レコーディング開始前の状態に戻る
②記録した操作をブラウザ上で再生
③表示されているYAMLコードをコピー

 ワークフローの設定例

AUTORO Assistantを使ってウェブサイトを操作し、その操作を自動的に記録する方法を説明します。
今回は以下のような挙動を行うワークフローを、REC機能を用いて作成します。

  • オートロ株式会社のホームページトップから製品サイトのブログページへ移動
  • ブログページの検索欄で「RPA」と検索
  • 表示されたブログタイトルと掲載日時をスクレイピング
  • 既存のスプレッドシートに記入する

オートロ株式会社のホームページを開きます。

AUTORO Assistantのポップアップを表示し、RECボタンでレコーディングを開始します。

 

 

レコーディングしながら操作を行っていきます。実際の操作は、下の動画をご覧ください。

  • 何らかの操作を行いたい箇所で左クリックし、メニューからクリック、マウスオーバー、文字入力等を選択しつつ操作していきます
  • データを抽出する際の操作は、AUTORO AssistantのExtractData機能を使用したときとほとんど同様です。詳しい操作方法は当該記事をご覧ください
  • スプレッドシートに転記する際、上でデータ名に指定した語句が自動的にヘッダーになります
  • スプレッドシートに転記する値や範囲はピッカーから設定できますが、空白にしておき後から設定することも可能です
  • スクレイピングした情報をスプレッドシートに記入するところまで完了したら、■STOPで記録を終了します

すべて操作が終わったら記録を停止し、表示されているYAMLコードをコピーします。

AUTOROで新規ワークフローを作成し、エディタモードに切り替えてコピーしたコードを貼り付けます。

これでワークフローの大部分が完成しています。
ただし今回の場合、使用するスプレッドシートのプロバイダーIDは設定されていない状態です。こちらは削除し、ピッカーから適切なコネクションを設定してください。

スプレッドシートの範囲等、もし記録中に設定を省いた箇所があれば、ここで設定してください。
また、画面サイズや待機時間に不備がある場合も手動でご調整ください。

以上でワークフローは完成です。

抽出したブログタイトルと掲載日時が、スプレッドシートに転記できています。

 

# ブラウザを開く
+open_browser_1:
  action>: OpenBrowser
  url: 'https://autoro.io/'
  lang: 'ja-JP'
  headless: true
  confirm: true
  useShadowDomSelector: false
  private: false

# マウスオーバー
+hover_18bb37229f1:
  action>: Hover
  browser: +open_browser_1
  selector: '.l-header-nav__link--arrow'
  ignoreError: true
  private: false

# クリック
+click_18bb372385c:
  action>: Click
  browser: +open_browser_1
  selector: '.l-header-nav__inner-item:nth-child(3) .l-header-nav__inner-link'
  confirm: true
  ignoreError: true
  timeout: 30000
  private: false

# 文字入力
+type_text_18bb3725d3a:
  action>: TypeText
  browser: +open_browser_1
  selector: '.c-item-search__input'
  text: RPA
  clearValue: true
  ignoreError: true
  private: false

# クリック
+click_18bb372673f:
  action>: Click
  browser: +open_browser_1
  selector: '.c-item-search__submit-btn img'
  confirm: true
  ignoreError: true
  timeout: 30000
  private: false

# ページからデータを抽出
+extract_data_18bb372c726:
  action>: ExtractData
  browser: +open_browser_1
  extractor: '[{"name":"title","selectors":[".c-list-blog__item:nth-child(1) .c-list-blog__ttl",".c-list-blog__item:nth-child(2) .c-list-blog__ttl"]},{"name":"date","selectors":[".c-list-blog__item:nth-child(1) .c-txt-date__txt"]}]'
  format: csv
  multiple: true
  private: false

# 既存のスプレッドシートを取得
+get_spreadsheet_18bb3731e37:
  action>: GetSpreadsheet
  provider: ''
  spreadsheet_id: ''
  private: false
  meta:
    display:
      provider:
        type: chip
        label: 'Google Spreadsheet (xxx@xxxxx)'
        icon: googlespreadsheet

# セルの値を更新
+update_cells_18bb3731f2e:
  action>: UpdateCells
  spreadsheet: +get_spreadsheet_18bb3731e37
  range: ''
  values: +extract_data_18bb372c726
  private: false

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

オートロアシスタント

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