Flask×Twitterでログイン機能実装①|前提知識編

2019-07-12

これから、Flaskでユーザー登録とログイン機能を実装する方法について、誰よりも丁寧に解説していこうと思います。

というのも、ユーザー登録とログインの機能を作るというのは、初心者にとって一つの大きな壁だからです。
かくいう僕も以前、自作のWEBサービスを作ろうと思った際に、ユーザー登録機能を実装できずに挫折した経験があります。

それから数ヶ月経ちまして、今回ようやくFlaskでユーザー登録機能を実装することに成功しましたので、その過程を記録しておきます。
これから同じ壁にぶつかった方の良きチュートリアルとなるような記事を目指して、丁寧に解説していきます。

第一回の今回は、ユーザー登録機能を作る上での前提知識についてまとめていきます。
少し退屈な話になりますが、ここを理解していなかったために、以前の僕は挫折してしまいました。

みなさんにはぜひ、ここを理解してから次のステップに進んでほしいと思います。

もくじ

  1. はじめに
  2. アカウントの種類
  3. 自前の入力フォームを用いたログイン認証
  4. 他サービスのアカウントを用いた認証
  5. 参考

はじめに

そもそも、普段当たり前のように使っている、ユーザー登録・ログイン機能とは、どのような仕組みで作られているのか。
基本的には、ユーザーごとに違う情報が見られる、鍵のかかった箱があるイメージです。

この箱がアカウント、鍵がパスワードです。
つまり、ユーザーアカウントの実装とは、この箱と鍵のペアをつくるということなのです。

鍵の種類

普段僕らが使っている鍵には、どのような種類があるでしょうか?

まずは最も一般的な、文字や数字によるパスワードがありますね。
パスワードは、PCやスマホ、SNSをはじめ、もっとも手軽かつ一般的に使われている鍵です。

では、他にはどのようなものがあるでしょう?
解読が現実的に不可能な暗号を用いた認証技術や、指紋や顔、網膜といった生体認証をログインの鍵とすることもあります。

今回は暗号化の技術については割愛しますが、興味のある人はこちらを読んでみてください。
2019年3月28日までのKindleのセールで、なんと40%引きで買うことができます。
僕も思わず買ってしまいました。

暗号化技術のすべて

有名な『ハッカーの教科書』の著者が書いた本で、高校数学とコンピューターの基礎知識があれば読める内容になっています。

さて、話を戻しましょう。
認証の技術は数あれど、Flaskを用いたWEBサービス開発で、素人の僕らが取れる選択肢は大きく2つに分かれます。

1つ目は、自前のパスワードの入力フォームを用いたログイン認証。

2つ目は、GoogleやTwitterなどのアカウントを用いた認証方法です。

ここからは、この2つの実装について詳しく見ていきます。

自前の入力フォームを用いたログイン認証

最も一般的な、メールアドレスやユーザーIDとパスワードを入力してログインする方法です。

基本的な仕組みとしては非常にシンプルです。

まず、ユーザーは事前にアカウントの登録を求められます。
このアカウント情報は、一意のIDとパスワードと紐づけられます。
そしてログインの際にユーザーが入力した情報が一致したときのみログインを許可します。
ここでログインを認められた場合には、そのログイン情報がユーザーのセッションやCookieに保存され、アカウントのページを見られるようになります。
セッションやCookieについては、実際にログイン機能の実装を解説するときの記事で詳しく書きますね。

以上が、ログイン認証の流れになります。
この一連の流れをFlaskで実装するには、最低限以下の3つの知識が必要になります。

・フォームを作り、ユーザーの入力した情報を、GETやPOSTメソッドで受け取る
・DBに入力された情報を保存したり、アカウント情報と一致するか調べたりする
・ログインに成功した場合、その情報をセッションやCookieに保存する

これに加えて、セキュリティ対策も必要です。
ハッシュを用いた認証や、バリデーション。
クロスサイトスクリプティング、SQLインジェクションetc…といった無数の攻撃手法に対する対策など。

独自のログイン認証を作るのは、初心者にとってはなかなかハードルの高いものになります。
もちろん、FlaskやDjango、Railsといったフレームワークには、これらの実装を簡単にする工夫がされてますので、そちらを利用するのも良いでしょう。

ですが、今回はより簡単で安全な方法として、他サービスの認証を用いてログイン機能を実装していきたいと思います。

他サービスのアカウントを用いた認証

というわけで、もう一つの認証方法として、他サービスのアカウントによる認証を紹介します。

こちらも今やすっかり一般的になってきました。
FacebookやGoogle、Amazon、Twitterといった有名サービスのアカウント連携機能を用いてログインする手法です。

この手法のメリットはたくさんありますが、そのうちのいくつかを挙げてみます。

・一つのアカウントでログインできるので、複数のパスワードを管理する必要がない
・登録済みの情報を使えるので、毎回登録情報を入力する必要がない
・GoogleやAmazonなどのサービスのセキュリティ対策は世界トップクラスなので、素人が自分でセキュリティ対策を行うより安全

などなど、実装が簡単なだけでなく、ユーザーにとってもメリットが大きいのです。

このような他サービスとの連携には、一般的にOAuthというプロトコルを用います。
OAuth(オーオウス)とは、一言で言えば、『認可サーバーとアクセストークンを用いて、特定の相手とだけ情報のやりとりを行う技術』です。

詳しくはこちらの記事が非常に参考になります。

一番分かりやすい OAuth の説明

さて、今回はここまでです。
次回以降は、Twitter連携を用いたログイン認証の実装について解説していきます。

参考

暗号化技術のすべて

一番分かりやすい OAuth の説明

次の記事
Flask×Twitterでログイン機能実装②|OAuth認証でTwitterと連携