XPathとは
XPath (XML Path Language)とは、XML形式の文書から、特定の部分を指定して抽出するための簡潔な構文(言語)です。HTMLもXMLの一種とみなすことができるため、HTML形式の文書にも対応します。Xpathは、WebスクレイピングでWebページの情報を取得する時によく利用します。
https://www.octoparse.jp/blog/essential-for-web-scraping-xpath-introduction/ アクセス日2021年5月15日
簡潔に言えば、XPathとは、サイト上の場所を特定するための住所のようなものです。
具体的にXPathは、以下のように表わされます。
/html/body/div/div/div/div/div/div/div[1]/div[2]/div[3]/div[1]/button/divまた、以下のような形のXPathを用いる場合もあります。
//*[@id="form-container"]/div/div/div/div/div[1]/div[2]/div[3]/div[1]/button/divどちらも、サイト上の一意の位置を表しているため、どちらを利用してもかまいません。
XPathの取得方法
XPathは、Chromeではディベロッパーツールを利用して取得するのが一番簡単だと思います。
Chromeの右上の×印の下の「・・・」をクリックして、[その他のツール]>[ディベロッパーツール]をクリックしてください。
次に、[Element]を押してから、四角形にアイコンのマークがくっついたマークをクリックして、自分が取得したいサイト上の要素をクリックします。
そうすると、右側のソースコードの一部がハイライト表示されます。
ハイライト表示されたソースコードを右クリックして[Copy]>[Copy XPath]を選択します。
そうすると、以下のようなものがコピーされました。(サイトや位置によってXPathは変化します。)
//*[@id="form-container"]/div/div/div/div/div[1]/div[2]/div[2]/div/div[1]/div/div[2]/div/div/inputこのようにしてXPathを手に入れることができました。
(例)FormsのXPathの取得方法
既に公開されている、【定時実行】MicrosoftFormsの自動回答botの作り方解説(python・selenium)という記事で、seleniumを用いたForms自動回答botの作り方を解説しています。
当該記事内にはFormsを自動実行させるためのソースコードが書かれていますが、その中でXPathを利用しています。
稀にMicrosoft側の仕様変更等により、XPathが変化することがあるため、その仕様変更が生じたとしてもソースコードのどこをどのように変えればよいかを解説します。
当該記事内で利用したソースコードを示します。
from selenium import webdriver
import time
driver = webdriver.Chrome("c:/selenium/chromedriver.exe")
driver.get("https://forms.office.com/Pages/ResponsePage.aspx?id=DQSIkWdsW0yxEjajBLZtrQAAAAAAAAAAAAMAANfJPNxURDNNOTAxOFFOM0pGOVJNREU2NDZZRlNURy4u")
time.sleep(5)
#名前
element = driver.find_element_by_xpath('//*[@id="form-container"]/div/div/div/div/div[1]/div[2]/div[2]/div/div[1]/div/div[2]/div/div/input')
text = '山田太郎'
element.send_keys(text)
#クラス
element = driver.find_element_by_xpath('//*[@id="form-container"]/div/div/div/div/div[1]/div[2]/div[2]/div/div[2]/div/div[2]/div/div[1]/div/label/input')
element.click()
#出席番号
element = driver.find_element_by_xpath('//*[@id="form-container"]/div/div/div/div/div[1]/div[2]/div[2]/div/div[3]/div/div[2]/div/div/input')
text = '7'
element.send_keys(text)
#体温
element = driver.find_element_by_xpath('//*[@id="form-container"]/div/div/div/div/div[1]/div[2]/div[2]/div/div[4]/div/div[2]/div/div/input')
text = '36'
element.send_keys(text)
time.sleep(2)
#送信
element = driver.find_element_by_xpath('//*[@id="form-container"]/div/div/div/div/div[1]/div[2]/div[3]/div[1]/button/div')
element.click()
time.sleep(3)
driver.close()この中の、5か所でXPathが利用されていることが分かると思います。
その5か所を抜き出すと、
#名前
element = driver.find_element_by_xpath('//*[@id="form-container"]/div/div/div/div/div[1]/div[2]/div[2]/div/div[1]/div/div[2]/div/div/input')
#クラス
element = driver.find_element_by_xpath('//*[@id="form-container"]/div/div/div/div/div[1]/div[2]/div[2]/div/div[2]/div/div[2]/div/div[1]/div/label/input')
#出席番号
element = driver.find_element_by_xpath('//*[@id="form-container"]/div/div/div/div/div[1]/div[2]/div[2]/div/div[3]/div/div[2]/div/div/input')
#体温
element = driver.find_element_by_xpath('//*[@id="form-container"]/div/div/div/div/div[1]/div[2]/div[2]/div/div[4]/div/div[2]/div/div/input')
#送信
element = driver.find_element_by_xpath('//*[@id="form-container"]/div/div/div/div/div[1]/div[2]/div[3]/div[1]/button/div')
となります。
その5か所は上からFormsの「名前欄」「クラスの選択欄」「出席番号の入力欄」「体温の入力欄」「送信ボタン」の位置を示しています。
基本的には、この記事で紹介したXPathの取得方法を用いて、入力欄や選択物のXPathを手に入れていただければ大丈夫です。
ただし注意していただきたいのは、XPathの末尾です。このFormsを利用しており、私のサイト上のソースコードを利用している場合、XPathの末尾は、input若しくはbutton/divとなります。それ以外にはなりえないので注意してください。
また、Formsのクラスの選択欄のXPathは、右側の丸いボタンのXPathを手に入れる必要があります。画像で示すと、こんな感じです。
右側の「1組」などのラベルの部分を選択する訳ではありませんので注意してください。
まとめ
XPathの取得方法についてまとめましたがいかがでしたでしょうか。
この記事を使えば、Microsoft側の仕様変更があっても、自分でソースコードを直して、Formsの自動回答botを利用できると思います。
XPathとseleniumを利用すれば、いろいろなことができるのでぜひ利用してみてください。
コメント