XPathとは
XPathとはざっくりいうと、Webページ上のボタンや入力欄を見つけるための「住所」のことです。RPAロボはこの住所を元に、処理対象の要素を見つけ出します。
Chrome(クローム)、Edge(エッジ)、Firefox(ファイアフォックス)といったウェブブラウザの操作をWinActorで自動化する際に必要となります。
![](https://dietwork.net/wp-content/uploads/2020/02/XPathでボタンを見つける.png)
![RPAロボ](https://dietwork.net/wp-content/uploads/2019/09/ai_computer_sousa_robot.png)
XPthは「~~」だから、Webページのこのボタンをクリックすればいいんだな!
XPathをより深く知ろう
![RPAネコ](https://dietwork.net/wp-content/uploads/2019/10/piso20191007204630.png)
このトピックは読まなくても問題ありません。軽い気持ちでご覧ください。
XPathをより深く理解するにはHTMLについても知っておく必要があります。
HTMLはウェブページを作成するためのプログラミング言語です。ほぼ必ずと言っていい程、ウェブページはHTMLで出来ています。
![](https://dietwork.net/wp-content/uploads/2019/10/HTML解説2-1024x421.png)
例えば、↑の画像の左側のウェブページは、右側のHTMLコードで出来ています。矢印で結んだ部分は、画面上の要素と対応するHTMLコードです。
RPAロボはこのHTMLコードの中から処理対象を見つけ出して処理を行っています。つまりXPathとは、膨大なHTMLコードから処理対象を見つけるための住所なのです。
![](https://dietwork.net/wp-content/uploads/2019/10/HTML解説3-1024x776.png)
![RPAネコ](https://dietwork.net/wp-content/uploads/2019/10/piso20191007204630.png)
HTMLの全文を理解する必要は全くありません。ウェブページはHTMLコードで出来ている、というイメージだけ掴んでください。
ぶっちゃけHTMLを理解しなくてもXPathを用いたシナリオ作りは出来ます。ですが、理解していた方が困ったときに便利です。
気になる方は、WinActorで役立つHTML知識をカンタンにまとめた記事も合わせてご覧ください。
XPathの取得方法
Chrome(クローム)でXPathを取得する方法
1.XPathを取得したい画面で「F12」または「Fn+F12」を押します。赤枠部分のようなデベロッパーツール画面が開けば成功です。
![](https://dietwork.net/wp-content/uploads/2020/02/chromeデベロッパーツール.png)
2.デベロッパーツール画面の左上のボタンをクリックします。
![](https://dietwork.net/wp-content/uploads/2020/02/chromeデベロッパーツール2.png)
3.処理対象のボタンや入力フォームをクリックします。
![](https://dietwork.net/wp-content/uploads/2020/02/chromeで要素を選択2.png)
4.対応するHTMLコードが選択状態になるので右クリックします。
![](https://dietwork.net/wp-content/uploads/2020/02/chromeで要素のHTMLコードを選択.png)
5.Copy > Copy XPathを選択します。
![](https://dietwork.net/wp-content/uploads/2020/02/chromeでXPathを取得2.png)
6.クリップボードにXPathがコピーされるので、WinActorノード設定欄にCtrl+Vを押して貼り付けます。
Firefox(ファイアフォックス)でXPathを取得する方法
1.XPathを取得したい画面で「F12」または「Fn+F12」を押します。赤枠部分のようなデベロッパーツール画面が開けば成功です。
![](https://dietwork.net/wp-content/uploads/2020/02/Firefoxデベロッパーツール.png)
2.デベロッパーツール画面の左上のボタンをクリックします。
![](https://dietwork.net/wp-content/uploads/2020/02/Firefoxデベロッパーツール2.png)
3.処理対象のボタンや入力フォームをクリックします。
![](https://dietwork.net/wp-content/uploads/2020/02/firefoxで要素を選択2.png)
4.対応するHTMLコードが選択状態になるので右クリックします。
![](https://dietwork.net/wp-content/uploads/2020/02/firefoxで要素のHTMLコードを選択-1024x633.png)
5.コピー > XPath(X)を選択します。
![](https://dietwork.net/wp-content/uploads/2020/02/firefoxでXPathを取得2-1024x610.png)
6.クリップボードにXPathがコピーされるので、WinActorノード設定欄にCtrl+Vを押して貼り付けます。
Edge(エッジ)でXPathを取得する方法
調べた限り、EdgeにはXPathを取得する機能は無いようです。なので、自力でXPathを生成する必要があります。
XPathの生成方法については下記の記事を参考にしてください。
WinActorによるEdge操作はいくつか制限事項があるのでご注意ください。
- 複数画面起動することはできません。
- 手動で起動したEdgeに対して、WinActorが操作をすることはできません。
- 次のライブラリは利用できません。
- ファイル選択
- マルチリスト選択
- マルチリスト選択解除
- マルチリスト全選択解除
![RPAネコ](https://dietwork.net/wp-content/uploads/2019/10/piso20191007204630.png)
Edgeでの操作は制限事項が多いです。特に理由が無ければウェブブラウザはIE、Chrome、Firefoxを利用した方がいいですね!
▼本気でWinActorをマスターしたいならこちらをチェック
- WinActorの使い方 入門 6つだけ覚えればOK!(詳細)
- WinActorノードやライブラリの使い方 一覧(詳細)
- WinActor開発スキルアップ記事まとめ(詳細)
- WinActor勉強方法 独学から研修まで幅広くご紹介(詳細)
![Digiprove seal](https://dietwork.net/wp-content/plugins/digiproveblog/dp_seal_trans_16x16.png)