本ページには PR が含まれます。

スクレイピングでログインを自動化するには
どうしたらいいの?
今回はseleniumライブラリを使って、Webサービスへのログインを自動化する方法を紹介します。
サンプルコードをコピペしながらサクサク処理を試せるので、ぜひ参考にしてみてください。
seleniumライブラリの基本的な使い方を知りたい方はこちら


Pythonの実践的なWebスクレイピング技術について学びたいという方に向けてUdemy学習コースを公開しています。
\10/27(金)までの 90%OFFクーポンで Webスクレイピングを学べる!!/
30日間返金保証!
すぐにでもスクレイピング技術を活かせるようになりますよ!
ライブラリのインストール
はじめにWebスクレイピングに必要なseleniumライブラリをインストールします。
コマンドプロンプト(Windows)もしくはターミナル(macOS)で以下を実行します。
pip install selenium
コンソールの最終行に「Successfully Installed 〜〜〜」と表示されていればインストールは成功です。
Chromeドライバーのダウンロード
seleniumによるWebスクレイピングでは、Webブラウザを操作するために「Chromeドライバー」のダウンロードが必要です。
ダウンロード方法は以下の通り。
- Google Chromeのバージョン確認
- バージョンを指定してダウンロードサイトからダウンロード
Google Chromeのバージョン確認
ChromeDriverをダウンロードする前にご自身の使用するGoogle Chromeのバージョンを確認します。
ChromeDriverとGoogle Chromeのバージョンが一致していないとエラーが発生する可能性があります。
Google Chromeを起動して、右上のメニューマークをクリックします。


「ヘルプ」から「Google Chromeについて」をクリックするとバージョンを確認できます。




のちほどChromeのバージョン情報を指定してChromeドライバーをダウンロードします。
ダウンロードサイトからインストール
Google Chromeのバージョンが確認できたら、さっそくChromeドライバーをインストールしましょう。
こちらのサイトから無料でダウンロードできます。
先ほど確認したバージョンと一致するものを選択し、PCのOSに合ったダウンロードリンクをクリックします。




ダウンロードされたzipファイルをダブルクリックで解凍します。


Chromeドライバーをインストールできたら、Webスクレイピングの準備は完了です。
seleniumでWebページにアクセス
ここでは技術ブログQiita(キータ)のアカウントページにログインしてみましょう。
seleniumライブラリを使ったWebページへのアクセス方法
dirver.get(url="アクセス先のURL")
サンプルコード
from selenium import webdriver
from selenium.webdriver.common.by import By
from selenium.webdriver.chrome import service as fs
# chromedriverのパスを指定
driver_path = "/Users/「PCのユーザ名」/Downloads/chromedriver"
chrome_service = fs.Service(executable_path=driver_path)
driver = webdriver.Chrome(service=chrome_service)
# Qiitaトップページにアクセス
url = "https://qiita.com/"
driver.get(url=url)


このようにWebブラウザでQiitaのトップページにアクセスできました。
seleniumでログインボタンをクリック
続いてQiitaのトップページ右上にある「ログイン」ボタンをクリックする処理を作りましょう。


まずはChromeの「検証」機能を使って「ログインボタン」のHTMLを調べます。
ブラウザをアクティブにして「F12」キーを押下します。


これで「ログインボタン」のHTML構造を参照できます。
続いて参照されたHTMLの部分を右クリック。そのまま「Copy」→「Copy selector」を選択します。


このCSSセレクタをつかってseleniumで「ログインボタンを探索」→「クリック」させます。
CSSセレクタからWeb要素を探索する方法
driver.find_element(by=By.CSS_SELECTOR, value="CSSセレクタの値")
seleniumをつかったWeb要素のクリック
web要素.click()
※ もしくはdriver.execute_script("arguments[0].click();", web要素)
サンプルコード
from selenium import webdriver
from selenium.webdriver.common.by import By
from selenium.webdriver.chrome import service as fs
# chromedriverのパスを指定
driver_path = "/Users/「PCのユーザ名」/Downloads/chromedriver"
chrome_service = fs.Service(executable_path=driver_path)
driver = webdriver.Chrome(service=chrome_service)
# Qiitaトップページにアクセス
url = "https://qiita.com/"
driver.get(url=url)
############### ここからログインボタンをクリックする処理 ###############
# コピーしたCSSセレクタを文字列に格納
css_selector = "#New2GlobalHeader-react-component-de90262e-71d7-4bea-9993-96ddaee09cb1 > header > div > div.st-NewHeader_end > a.st-NewHeader_loginLink"
login_button_element = driver.find_element(by=By.CSS_SELECTOR, value=css_selector)
# ログインボタンを構成するHTMLタグを出力
print(login_button_element.get_attribute(name="outerHTML"))
# ログインボタンをクリック
login_button_element.click()
# 別のクリック方法(JavaScriptにクリック処理をさせる。処理が安定しています。)
# driver.execute_script("arguments[0].click();", login_button_element)
出力結果
<a class="st-NewHeader_loginLink" href="/login?redirectTo=%2F" rel="nofollow">ログイン</a>


このようにログインボタンをクリックして、ログイン画面へ遷移できました。
seleniumでログイン情報の入力
つづいてseleniumを使ってログイン用の入力ボックスに情報を入力させます。
入力ボックスのCSSセレクタからWeb要素を特定します。もう一度「F12」キーでHTMLを参照しましょう。


参照された入力ボックスのHTMLからCSSセレクタをコピーします。


# コピーした「ユーザー名 または メールアドレス」入力欄のCSSセレクタを文字列に格納
input_user_selector = "#identity"
同じようにして「パスワード」入力欄のCSSセレクタもコピーします。


参照された「パスワード」入力ボックスのHTMLからCSSセレクタをコピーします。


# コピーした「パスワード」入力欄のCSSセレクタを文字列に格納
input_password_selector = "#password"
さっそくseleniumでログイン情報を入力させてみましょう。
seleniumで入力ボックスにテキストを入力
web要素.send_keys("入力する文字列")
サンプルコード
from selenium import webdriver
from selenium.webdriver.common.by import By
from selenium.webdriver.chrome import service as fs
# chromedriverのパスを指定
driver_path = "/Users/「PCのユーザ名」/Downloads/chromedriver"
chrome_service = fs.Service(executable_path=driver_path)
driver = webdriver.Chrome(service=chrome_service)
url = "https://qiita.com/"
driver.get(url=url)
css_selector = "#New2GlobalHeader-react-component-de90262e-71d7-4bea-9993-96ddaee09cb1 > header > div > div.st-NewHeader_end > a.st-NewHeader_loginLink"
login_button_element = driver.find_element(by=By.CSS_SELECTOR, value=css_selector)
login_button_element.click()
############### ここからログイン情報を入力する処理 ###############
# コピーした「ユーザー名 または メールアドレス」入力欄のCSSセレクタを文字列に格納
input_user_selector = "#identity"
# コピーした「パスワード」入力欄のCSSセレクタを文字列に格納
input_password_selector = "#password"
input_user_element = driver.find_element(by=By.CSS_SELECTOR, value=input_user_selector)
# 「ユーザー名 または メールアドレス」を入力
input_user_element.send_keys("あなたのユーザ名")
input_password_element = driver.find_element(by=By.CSS_SELECTOR, value=input_password_selector)
# 「パスワード」を入力
input_password_element.send_keys("あなたのパスワード")
実行結果


seleniumでログイン情報をPOST・送信
最後にseleniumでログインを実行しましょう。
ログイン情報の送信手段は以下二つのいずれかです。どちらでもログイン可能です。
- 「Qiitaにログイン」ボタンをseleniumでクリック
- 入力済みのinputタグのWeb要素に
submit()
メソッドを利用
①の方法は「CSSセレクタを特定→クリック」でこれまでと同じ方法ですので、
②の方法で実装してみましょう。②の方がシンプルです。
サンプルコード
from selenium import webdriver
from selenium.webdriver.common.by import By
from selenium.webdriver.chrome import service as fs
# chromedriverのパスを指定
driver_path = "/Users/「PCのユーザ名」/Downloads/chromedriver"
chrome_service = fs.Service(executable_path=driver_path)
driver = webdriver.Chrome(service=chrome_service)
url = "https://qiita.com/"
driver.get(url=url)
css_selector = "#New2GlobalHeader-react-component-de90262e-71d7-4bea-9993-96ddaee09cb1 > header > div > div.st-NewHeader_end > a.st-NewHeader_loginLink"
login_button_element = driver.find_element(by=By.CSS_SELECTOR, value=css_selector)
login_button_element.click()
input_user_selector = "#identity"
input_password_selector = "#password"
input_user_element = driver.find_element(by=By.CSS_SELECTOR, value=input_user_selector)
input_user_element.send_keys("あなたのユーザ名")
input_password_element = driver.find_element(by=By.CSS_SELECTOR, value=input_password_selector)
input_password_element.send_keys("あなたのパスワード")
############### ここからログイン情報を送信POSTする処理 ###############
input_password_element.submit()
# 以下でも可
# input_user_element.submit()
実行結果


まとめ
この記事ではseleniumライブラリを使ったスクレイピングで「ログイン処理」を実装する方法をご紹介しました。
Webスクレイピングをマスターすると、情報収集が圧倒的にラクになります。
- 仕事で毎日行うデータ収集
- 予約サービスへの自動登録・応募
- ショッピングサイトの価格監視
などなど、さまざまな分野で応用できます。
PythonのWebスクレイピング技術を体系的に学びたい、という方に向けてUdemyで動画学習コースを公開しているので、ぜひ活用してみてください!!
\Webスクレイピング技術を動画で一気に学べる!!/
Webスクレイピングで日々の作業を自動化し、より有意義な時間を増やしましょう!!
他にもPythonのWebスクレイピング技術の活用方法を紹介しているので、ぜひ参考にしてみてください。





