BETA

Python でスクレイピング(ソーシャルログイン編)

投稿日:2020-07-08
最終更新:2020-07-11

はじめに

Python で Qrunch の記事のバックアップを取る プログラムを書く際に、Python によるスクレイピングの手法について学びました。
実装したプログラムの中で最も学習に時間を要したソーシャルログインについての手法について書き残します。
タイトルにはソーシャルログイン編と書いていますが、Qrunch に特化していて汎用的な内容ではありません。
また、途中で色々と詳細を省いているので、書いたプログラムを参照しながら見ていただけると幸いです。

ソーシャルログインとは?

ソーシャルログインとは、Google や Twitter を始めとしたサービスのアカウントで、別のサービスにログインできる仕組みのことです。
ユーザの利点としては、複数サービスに ID, Password を登録しなくて良いとか、氏名、住所、電話番号など細かいデータの入力が省けるといったものがあります。

環境

Chrome の検証機能が便利なので、Chrome の利用を想定しています。

実装方法

Qrunch で Hatena を利用したログインを一例に、スクレイピングでソーシャルログインを行う方法について解説していきます。

Hatena にログイン

まず、Qrunch のログインページにアクセスします。
ソーシャルログイン用のボタンが並んでいるので、 Hatena のアイコンを右クリックして検証を押します。
そうすると、アイコンに仕込まれている URL のあたりの HTML が表示されるので、https://qrunch.net/users/auth/hatena という URL を入手できます。

このリンクは、Qrunch が Hatena のユーザ情報が欲しいというリクエストを送るためのものです。

次に、 Session.get('URL') で、先程入手したページの HTML を取得します。
実際にブラウザで https://qrunch.net/users/auth/hatena を開くと、ログインページが開かれます。
Session.get('リンク')で得られた HTML はこれと同じものです。
ブラウザ上で、次ステップというボタン上で右クリック検証をします。
そうすると、こんな感じの HTML の場所に飛べます。

<form action="/login" method="post">  
    <p class="oauth-caption"> アクセスを許可するにはログインする必要があります。<br>  
    はてなのアカウントをお持ちでない場合は、<a href="/registerlocation=https%3A%2F%2Fwww.hatena.nejp%2Foauth%2Fauthorize%3Foauth_token%3~~~~~~~~~~~~~~~~~~~~">ユーザー登録<a> してください。  
    </p><div class="input-item">  
      <div class="input-item-inner">  
        <input type="text" name="name" value="" class="text" id="username-input" placeholder="はてなID または メールアドレス" required="">  
      </div>  
    </div>  
    <div class="input-item">  
      <div class="input-item-inner">  
        <input type="password" name="password" value="" class="password" placeholder="パスワード" required="">  
      </div>  
    </div>  
    <div id="option" class="config-button">  
      <div class="auto-login">  
        <a href="#" class="checkbox-tab">  
          <label for="auto_login"></label>  
        </a>  
        <div class="checkbox-item">  
          <input type="checkbox" name="persistent" value="1" checked="checked" id="auto_login" class="checkbox on">  
          <label for="auto_login" class="checkbox-text">次回から自動的にログイン</label>  
        </div>  
      </div>  
      <input type="hidden" name="location" value="https://www.hatena.ne.jp/oauth/authorize?oauth_token=~~~~~~~~~~~~~~~~~~~~">  
      <input type="submit" value="次ステップ" class="submit-button">  
    </div>  
    <p id="alternate-message"><span>もしくは</span></p>  
    <div class="to-register">  
      <div class="to-register-btn"><a href="/register?location=https%3A%2F%2Fwww.hatena.ne.jp%2Foauth%2Fauthorize%3Foauth_token%~~~~~~~~~~~~~~~~~~~~">はてなユーザー登録</a></div>  
    </div>  
</form>  

これは、Hatena へのログインに必要な情報を入力するフォームの HTML です。

<form action="/login" method="post"> は、ログイン情報を送る先です。
hatena の場合、https://www.hatena.ne.jp/login が URL になります。

input type="なんちゃら" ~ が、ログインに必要な情報です。
これらの情報をディクショナリに詰めて、さっきのアドレスに post するとログイン出来ます。

Qrunch に Hatena ユーザ情報の利用を認可

ログインに成功すると、リダイレクトページに飛びます。
そこから頑張ってリダイレクト用の URL を入手して、再び Session.get('URL') で、Qrunch に Hatena ユーザ情報の利用を認可するページが取得できます。

このページで行うことも、Hatena ログイン時に行ったことと同じです。
許可するボタンを右クリック検証すると、下記の HTML が出てきます。

<form action="/oauth/authorize" method="post">  
      <input type="hidden" name="rkm" value="~~~~~~~~~~~~~~~~~~~~">  
      <input type="hidden" name="oauth_token" value="~~~~~~~~~~~~~~~~~~~~">  
      <input class="oauth-btn btn-yes" type="submit" name="name" value="許可する">  
    </form>  

rkm, oauth_token をディクショナリに詰めて、https://www.hatena.ne.jp/oauth/authorize に post です。
ログインチェック用のプログラム(自作)を走らせて、ログイン成功と出てきたら成功です。
ちなみにこれは、ログインが成功していないと出てこない文言で判定しています。

# ログイン確認  
res = session.get('https://qrunch.net/dashboard/')  

# parse  
soup = BeautifulSoup(res.text, 'lxml')  

if str.find(soup.text, '今日のアクセス数') != -1:  
    print('ログイン成功')  
else:  
    print('ログイン失敗')  

<input type="hidden"> の要素達について

ソーシャルログインには、OAuth2.0 という技術が関係しています。
OAuth2.0 とは、簡単に言えばサイト A で利用している情報や権限を安全にサイト B に渡すための仕組みです。
OAuth2.0 についての詳細は、OAuth / OpenID Connectを中心とするAPIセキュリティについて というスライドが分かりやすいです。

この hidden 要素は、認可コードやアクセストークンにあたるものです。

ログインまでの手順の間で注意する点

本題とは脱線してしまいますが、注意点をいくつか述べておきます。

  • ID, パスワードなど、見られて困る情報を使ってアクセスする場合は GET ではなく POST を利用する。
    • GET だと、URL の後ろに見れる状態で ID やパスワードがくっついています。
  • https など暗号化されたサイトを利用する。http の所は利用しない。
    • パケットを監視すると、http のサイト相手の通信はパスワード等が暗号化されていない状態で見れてしまう。
  • もし書いたプログラムを GitHub 等に上げるなら、ID, パスワード等の情報削除は忘れずに

おわり

十分に調査を行ってから記載を行っているつもりですが、誤りや必要な情報等ございましたら教えていただけると幸いです。
それではよいスクレイピングライフを!

技術ブログをはじめよう Qrunch(クランチ)は、プログラマの技術アプトプットに特化したブログサービスです
駆け出しエンジニアからエキスパートまで全ての方々のアウトプットを歓迎しております!
or 外部アカウントで 登録 / ログイン する
クランチについてもっと詳しく

この記事が掲載されているブログ

気になった技術や、開発を楽にするテクニックなどについて書きます。 基本的に備忘録として記事を投稿します。

よく一緒に読まれる記事

0件のコメント

ブログ開設 or ログイン してコメントを送ってみよう