Automation Anywhere  Automation360  - HTML Parser パッケージ

#カスタムパッケージのHTTP Parserを使ってみる

通常は、Webサイトのコンテンツ取得はレコーダー機能を使って、
テキストフィールドの値だったり、テーブルデータの一括取得だったりをしますが、
よりプログラミング的にWebサイト内の値の取得をしたい場合もあるかと思います。
そういった場合に使えるのが、HTML Parserパッケージです。

##入手方法
Bot Storeからの入手となります。
https://botstore.automationanywhere.com/bot/a2019-html-parser-package/
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/615564/998ee2b0-36fc-8a0f-b301-a4aab5e4b47d.png)

##サンプル
一応、サンプルのタスクボットが付いていましたが。。。あまり親切な形にはなってません。
そして、Readmeファイルもあるのですが、ちょっと分かりづらいです。。。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/615564/b08561a3-b393-bf52-ec9c-e9abfae875c9.png)

そのサンプルイメージはこちら。
例えば、最初のステップは、Googleで"Mercedes"を検索したときの戻りhtmlを文字列に入れています。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/615564/83c49e81-4abd-a0a6-5f1d-d05e3305f949.png)

##使ってみる。
まぁ、とにかく使ってみましょう。
今回対象とするのは、オートメーション・エニウェアの日本語ページ。

↓は、トップページから少し下に下がったところなのですが、この「エンタープライズエコシステムのご紹介」という部分を切り出してみます。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/615564/94db0fcb-672a-1601-3ccf-f5d9b2786e05.png)

まず、最初にやる事なのですが、ページの構造をチェックします。
Chromeで目的のWebサイトを開いて、ファンクションキーのF12を押してください。
↓のような画面になります。
まず、この右側のペインで、Elementタブを指定し、Ctrl + Fを押して検索窓が表示されるようにします。
そこで、取りたい範囲のキーワード。例えば「Enterprise RPA」を入力して検索します。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/615564/f6bedb26-f3e1-7c88-9fa3-a8c0c69647c3.png)

検索結果はこちら。
この中から、該当部分を指定するのに利用できるタグ（\<Div>とかのこと）や、更に細かく指定しているIDやClass（\<DIV id=XXXX>とか）を探します。
今回は、少し上の、**\<section class="enterprise-ecosystem">**というのが利用できそうだと分かります。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/615564/0a4e58f4-31ad-0dc8-8ccf-492be8d258aa.png)

では、Botを組みます。

一つ目のアクションは、「HTML Parser: Get HTML Content」です。
このアクションで対象とするWebサイトのコンテンツ(HTML)を取得し文字列変数に格納します。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/615564/c313a97e-8041-7cdc-ad64-9faa9e09af94.png)

二つ目のアクションとしては、「HTML Parser: Simple Search for Elements」を使いました。
最初のパラメータには、一つ目のアクションで取得した文字列。
二つ目のパラメータは、先程確認したenterprise-ecosystemというクラス
三つ目のパラメータは、検索に利用するキーなので、クラスを選択しました。
尚、他にも、IDやTag、Text、Attributeでも検索することが出来るようです。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/615564/9a7d9497-43d5-9170-c196-36feeda1cb70.png)

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/615564/856acf4c-c1f3-7224-0d05-ff130f055888.png)

そして、ディクショナリ変数がリストになっているものが戻ってきていますので、
ここでは、下記の様に、結合した値をメッセージボックスで表示させています。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/615564/01c6f104-b6ef-4352-d70b-378186c41afb.png)

結果はこんな感じ。上手く取れています。
レコーダーも万能ではありませんので、ユースケースによっては、このようなHTML生データを利用した自動化も有効かと思います。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/615564/bdb17eae-b423-ff1a-f8f7-a5a496894cdb.png)


##残りのアクションも一応紹介
正規表現を利用した抽出。
例えば、発注番号とか型番といった、特定パターンにはまる文字列の抽出に使えると思います。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/615564/261f6239-c496-db9c-5fc5-111f8b9f2df7.png)

セレクターを使用した抽出。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/615564/acfd9173-fce6-7d3c-f91a-59401db9d8b7.png)
下記の例では、div.rのタグの下のaタグ部分を取るといったことが可能です。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/615564/dd67d9cd-4902-c36f-6d08-9a0cf0aed945.png)

そして、最後に、取得したHTMLをXML形式に変換。
外部のWebサービスにデータを渡すとに使えると思います。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/615564/09165467-2c32-975f-be18-704269687e04.png)