Warning: Trying to access array offset on value of type bool in /home/xs978406/chiekoblog.site/public_html/wp-content/plugins/internal-link-building-plugin/internal_link_building.php on line 86
Warning: Trying to access array offset on value of type bool in /home/xs978406/chiekoblog.site/public_html/wp-content/plugins/internal-link-building-plugin/internal_link_building.php on line 105
こんにちは！ひっきーです。今回はPowerAutomateDesktopのブラウザをスクレイピングをする際に、UI要素取得の失敗を解決する方法をお伝えします。
ブラウザのUI要素を取得するには、主に3種類の方法があります。
- 要素の詳細を取得
- ブラウザの検証から取得
- Webページからデータを抽出する
これ以外にもあるかもしれませんが、私はこの方法でほとんどのUI要素の取得に成功しています。
それでは詳しく解説していきましょう！
PowerAutomateDesktopでUI要素が認識しない問題を解決する3つの方法
まず前提として「Webぺージの要素を取得する」理由は以下があると思います。
- ボタンをクリックさせたい
- テキストを抽出したい
- 要素があるか確認したい
など、他にもたくさんありますが、今回はテキストの抽出方法をお伝えします。
しかし要素の抽出ができれば上記でやりたいことはすべて可能です。
それでは1つ目から
方法1：Webページ上の要素の詳細を取得
これは通常行う方法です。おそらくこのページにたどり着いたあなたは、この方法が使えないため悩んでいるのではないでしょうか。
なのでサクッっと解説していきます。
以下の「Yahoo！JAPAN」というタイトルの文字を取得する場合
① ブラウザーのインスタンスを設定します。
ここではブラウザーは「Google」で生成された変数を「Browser」とします。
すでに開いているページを使ってTRY＆エラーを繰り返す時は次の方法もあります。
こちらの場合は実行するたびにブラウザーを起動しなくても、すでに開いているページを使って「途中から実行（ここから実行）」させることができます。
ただし「途中から実行」をしすぐにマウスでブラウザーをクリックして認識させる必要があることは覚えておいてください。
② アクションから「Webぺージ上の要素の詳細を取得」をドラッグ＆ドロップでフローに移動させます。
③ UI要素の空白をクリックし「UI要素の追加」をクリックします。
④ Yahoo!JAPANのロゴで「CTRL」+左クリックで設定します。
以下のように「Anchtor」と表示された状態で「CTRL」+左クリックです。
⑤ UI要素に文字が入力されれば完了です。
「保存」をクリックして完了させてください。
フローを実行すると変数「AttributeValue」に「Yahoo!JAPAN」が記録されるはずです。
この方法でうまくいかない場合は次の「ブラウザの検証から取得」で試してみて下さい。
方法2：ブラウザの検証から取得
方法1でセットしたアクション「Webページ上の要素の詳細を取得」を編集して行います。
その前に以下の手順で要素の元となるセレクターと呼ばれる文字（コード）を取得します。
① Yahoo!JAPANのロゴでマウスを右クリックし「検証」を選ぶ
② 検証画面からYahoo!JAPANが選択される部分を探し右クリック→「Copy」にマウスを合わせ→「Copy selector」で左クリック
これでクリップボードに要素コードが保存されました。
③ 方法1でセットしたアクションをWクリックします。
④ UI要素の鉛筆アイコンをクリックします。
⑤ テキストエディタのスイッチをクリックしてONにします。
➅ 表示されたコードを削除します。
⑦ 「CTRL」+「V」でクリップボードのコードを貼り付け「保存」します。
これで方法1でも出来なかったUI要素が取得できるようになります。
方法3：アクション「Webページからデータを抽出する」を使う
方法2でもUI要素が取得できない場合はこちらの方法を試してください。
① アクションから「Webページからデータを抽出する」をフローにドラッグ＆ドロップします。
場所はどこでもOK！このアクションは要素抽出のために使うのであとで削除します。
② ブラウザーのどこかをクリックすると赤い枠が出てきます。
③ 赤い枠を「Yahoo!JAPAN」に合わせ右クリック→「要素の値を抽出」にマウスを合わせ→テキスト（Yahoo!JAPAN）で左クリック
④ 次にPADの小窓が開いているので「詳細設定」をクリックします。
⑤ ウインドウが開くので「CSSセレクター」に入力されているコードをすべてクリップボードにコピーします。
ショートコードが楽です。
「CTRL」+「A」
⇩
「CTRL」+「C」
➅ 「Webページからデータを抽出する」のウインドウをすべて閉じます。（キャンセルしていく）
⑦ 方法1でセットしたアクションをWクリックします。
⑧ UI要素の鉛筆アイコンをクリックします。
⑨ テキストエディタのスイッチをクリックしてONにします。
⑩ 表示されたコードを削除します。
⑪ クリップボードのコードを貼り付けて「保存」します。
これで方法2でも出来なかったUI要素が取得できるようになります。
まとめ
PowerAutomateDesktopのブラウザでUI要素の取得ができないことは多々あります。
そんな時は、ここで紹介した方法を1から順に試してみて下さい。
もしこれでもダメな場合は「マウスを画像に合わせる」や「マウスの移動」で強制的に設定するしか方法がありません。
（ひょっとしたらもっとあるかも・・）
以上、UI要素の取得方法の解説でした。
最後までお読みいただきありがとうございました。