Usaoの部屋

”自分の気づきは、きっと誰かのためになる”というスタンスで日々更新します。

【Pynavi】Webブラウザ操作を自動化しよう!〜Python&Selenium&Chrome〜

今回のSTUDYは"Webブラウザ操作の自動化"です。

Webブラウザは、Google ChromeやFirefox、Safariなど様々ですが、基本の操作は同じかと思います。

  1. ブラウザを起動する
  2. テキスト記入欄に"検索ワード" or "URL"を打ち込む
  3. "Enter"で検索
  4. 気になる記事を"クリック"

普段何気なく行なっている作業ですが、言葉にしてみるとそこそこ段階を踏んでいます。
今回は、こんなブラウザ上でいつもやっている作業を自動化することを目指します。
※単純に欲しいサイトを訪問するだけならブックマークで十分ですが、クリック操作も併用して記述できる点が強みです!
今回は、Google Chromeの操作を自動化するために、PythonとSeleniumを用いていきます。

PyhonとSelenium

Python環境の構築と、実行するためのIDEの情報は下記リンクにまとめています。
pillowback.hateblo.jp

Seleniumについて
Webアプリケーション用テストツールです。
例えば何かしらのWebアプリケーションを作った際に、きちんと動くかテストすると思います。
その際に、人が手動でぽちぽちクリックしたり、テキストを打ち込んだりすることは面倒です。
Seleniumは、この人の行う作業を自動化できるツールです。
ブラウザ上で行う操作(マウス操作やフォームの入力など)を、一通りできるのでとても便利です。

SeleniumとWebDriverの準備

今回の目的であるブラウザ上の操作を行うために、SeleniumのインストールとWebDriverの取得が必要です。
Seleniumのインストールは、ターミナル(windowsならコマンドプロンプト)で次のpipコマンドを打ちます。

$ pip install selenium

WebDriverもブラウザを操作する際に必要です。
このWebDriverはブラウザの種類に応じて、それぞれ準備する必要があります。
ここではGoogleChromeのWebDriverを取得します。
次のリンクより、Latest Releaseとなっているものをダウンロードします。
Downloads - ChromeDriver - WebDriver for Chrome

Zipファイルを展開してchromedriverを得ます。
後述しますが、このchromedriverは任意の場所に置いて動きます。
ただし、プログラム内でパスを通してやらないとエラーが出ます。(ここで結構ハマりました...)

ここまでで、下準備完了です。

Seleniumの動作テスト

それでは、実際にPythonスクリプトを実行してGoogleChromeの自動操作を実現したいと思います。
ここではPyCharmを用いてスクリプトの作成、及び実行を行います。

#ブラウザ動作の待機時間を設けるために用います。
import time
#pipでインストールしたseleniumライブラリから、webdriverをインポートします。
from selenium import webdriver
#別途ダウンロードしたchromedriverを指定します。
driver = webdriver.Chrome("chromedriverがあるパス")
#ChromeのURLを指定します。
driver.get('https://www.google.com/')
#ブラウザの実行が操作に追いつかない場合があるので、待機時間を入れます。
time.sleep(5)
#テキストBoxを指定します。
search_box = driver.find_element_by_name("q")
#"ChromeDriver"と打ち込みます。
search_box.send_keys('ChromeDriver')
#テキスト内容を検索します。
search_box.submit()

簡単な動作ですが、Webブラウザの操作を自動化することができました。
コマンドの種類や、キーワードの指定についてまとめられているサイトを紹介します。
https://kurozumi.github.io/selenium-python/locating-elements.html

自分の勉強不足ですが、そもそもページ内の要素を指定することが困難でした。
要素が何を示すのかピンときていない。。。
しかも要素を指定しているはずなのに、上手く動作しないこともしばしばです。

XPathを用いた要素指定

次は、要素が上手く指定できない場合や、そもそも要素が見当たらない場合にも有効な手法を記述します。
XPathを用いた要素の指定が便利です。
具体的に方法を示します。
自動化したいアイコン上で右クリック→検証を選択。(今回はテキストBoxの上)
f:id:pillowback:20190216221204p:plain
青色背景で選択されている該当箇所を右クリック→XPathのコピー。
f:id:pillowback:20190216221303p:plain
XPathは次の様に指定します。
driver.find_element_by_xpath("コピーしたXPath")
※XPath内のダブルクォーテーションはシングルクォーテーションに変更する必要があります。

アイデア次第でかなり便利になるツールです。
プライベートやビジネスのWeb操作を自動化に是非ご活用ください。

執筆時の環境
    ・MacBookPro (Early2015)
    ・OS: Mojave (バージョン10.14.2)
・Anaconda(4.5.12)
・Python(3.7.2)
・IDE: PyCharm CE
・Google Chrome 71.0.3578.98(Official Build) (64 ビット)