Djangoでログイン認証機能を自作する方法を分かりやすく解説する

スポンサーリンク

この記事では、Django のユーザ認証と、そのためのすべての基本を学びます。

しかし、その前に Web サイトについて少し勉強しておきましょう。

スポンサーリンク

静的なWebサイトと動的なWebサイト

静的なウェブサイトと動的なウェブサイトの違いを簡単に見てみましょう。

| 静的なウェブサイト|動的なウェブサイト
| — | — |
| 静的なウェブサイトはユーザーに固定情報を表示する | 動的なウェブサイトは閲覧者に応じて異なる情報を表示することができる
| クライアントとサーバーの相互作用がない | ユーザーとサーバーの間で多くのデータ交換がある
| 頻繁にデータを更新する必要がない場合、より速く、より安く、より簡単にメインとなる|ユーザーがウェブサイトと相互作用する必要がある場合に重要です。

動的なウェブサイトは、適切なCMSを使用することで、高速かつ簡単に維持することができます。

| HTML、JS、CSSファイルをレンダリングし、サーバーにあるものを直接表示します。

| ユーザーのために保存されたデータベースに基づいて、フロントエンドを表示します。

ユーザー認証

今日、ほとんどすべてのウェブサイトは、手動またはGoogleやFacebookのアカウントIDを介してアカウントを作成するユーザー認証プロセスを持っています。

典型的なユーザー認証のページは次のようなものです。

user = authenticate(request=None , credentials)

ユーザ認証は、特定のユーザだけがアクセスできるように、全てのユーザコンテン ツを保護するための重要なプロセスです。

Django では、これは django.contrib.auth ライブラリを使って行われます。

また、可能な役割と権限に基づいて、異なるタイプのユーザが存在します。

ユーザーの種類

ユーザーは多くのカテゴリーとタイプに分けられますが、ユーザーの役割は大きく2つに分けられます。

ウェブサイトの編集権限を持つユーザーと、そうでないユーザーです。

スーパーユーザー

管理サイトの記事で、スーパーユーザーに遭遇しましたね。

スーパーユーザは、プロジェクトの最上位の管理者で、管理サイトのすべてのコンテンツにアクセスすることができます。

また、他の一般ユーザーを削除することもできます。

一般ユーザー

サイトを訪問する人がこのタイプのユーザーアカウントを作成することができます。

例えば、すべてのFacebookやGoogleのアカウントは、このタイプのユーザーに該当します。

ユーザーの権限は、ユーザーが果たす役割の種類によって異なります。

スーパーユーザー/管理者は、各ユーザーに割り当てる権限を決定します。

例えば、教室用アプリでは、生徒は異なる権限を持ち、教師は他の追加権限を持つことになります。

認証を使用するための Django.contrib.auth ライブラリの使用

Django フレームワークは、認証フレームワークを提供するために django.contrib.auth ライブラリとして知られる完全な認証ライブラリを内蔵しています。

したがって、この記事では、内蔵された .auth ライブラリそのものを扱います。

これから、このライブラリが提供する重要な属性について見ていきます。

1)認証

基本的な構文は

user = authenticate(username = "<username>", password = "<pasword>")

authenticate 属性は、サインアップビューとサインインビューで構文が少し異なります。

サインアップビューでは、リクエストの認証情報のみを引数として受け取ります。

user = authenticate(request, username="<stored_username>",password ="<stored_password>")

注意: ユーザー名とパスワードは、リクエスト自体から取得した認証情報です。

  • サインインビューでは、保存されているユーザー名とパスワードに加えて、 リクエストの認証情報 (ユーザー名、パスワード) を受け取ります。
login(request,user)

ここでは、”request “に含まれるリクエストの信用情報が、DBに保存されているユーザー名とパスワードの信用情報とマッチングされる。

クレデンシャルが一致した場合にのみ、ユーザは認証されます。

2) login(request,user_information)

ログイン関数は、ユーザをWebサイトにログインさせるために使用されます。

構文は以下の通り。

user = authenticate(username,password)

ここで、ユーザは

logout(request)

3) logout(リクエスト)

logout属性は、現在ログインしているユーザーを単にログアウトさせるものです。

構文は以下の通りです。

from django.shortcuts import render
def books(request):
    if request.user.is_authenticated:
        return render(request, 'itemsapp/books.html')
    else:
        return redirect('/books/signin')

4) AuthenticationForm (認証フォーム)

AuthenticatioForm は django.contrib.auth.forms に存在する、あらかじめ作られたフォームです。

このフォームは、Web アプリケーションの Django サインインページに表示されます。

存在するフィールドは以下の通りです。

  • ユーザ名
  • パスワード

5) CreateAuthenticationForm

django.contrib.auth.forms にあるこの組み込み済みフォームは、Django のサインアップ ページに表示されます。

フォームに存在するフィールドは以下の通りです。

  • ユーザ名
  • パスワード1
  • パスワード2(パスワード確認フィールド)

さて、auth ライブラリが何を保持しているかが分かったので、コーディング部分に飛び込んでみましょう!

Django のユーザ認証のハンズオン

よし! 読むのはもういいとして、手を動かしてみましょう。

ユーザがログインしたら、何か表示する必要がありますよね! では、簡単なビューとテンプレートを作ってみましょう

1) サンプルビューのコード

シンプルな BookView のコードを views.py ファイルに追加します。

<h> Welcome to the Book Website</h>
 
<h2>List of Books</h2>
<ul><h3> The Prodigal Daughter</h3></ul><br>
<ul><h3> Deception Point</h3></ul><br>
<ul><h3> Washington Times</h3></ul><br>
<ul><h3> Sherlock Holmes</h3></ul><br>
<ul><h3> The Cooper Intrigue</h3></ul><br>
 
<a href = "{% url 'logout' %}">Logout here</a>

2) サンプルテンプレートのコード

書籍の一覧を表示するサンプルテンプレートを作成します。

from django.contrib.auth import authenticate,login
from django.contrib.auth.forms import UserCreationForm
 
def signup(request):
 
    if request.user.is_authenticated:
        return redirect('/books')
     
    if request.method == 'POST':
        form = UserCreationForm(request.POST)
 
        if form.is_valid():
            form.save()
            username = form.cleaned_data['username']
            password = form.cleaned_data['password1']
            user = authenticate(username = username,password = password)
            login(request, user)
            return redirect('/books')
         
        else:
            return render(request,'itemsapp/signup.html',{'form':form})
     
    else:
        form = UserCreationForm()
        return render(request,'itemsapp/signup.html',{'form':form})

3) サインアップビューの作成

Views.py にサインアップビューのコードを追加します。

<form method ='post'>
    {% csrf_token %}
    {{form.as_p}}
    <input type="submit" value = "Submit">
</form>
 
<h3>Already Have an Account??</h3>
<a href = "{% url 'login' %}">Sign In Here</a>

ウェブページの Sign-up Template は次のようになります。

from django.contrib.auth import authenticate,login
from django.contrib.auth.forms import AuthenticationForm
 
def signin(request):
    if request.user.is_authenticated:
        return redirect('/books')
     
    if request.method == 'POST':
        username = request.POST['username']
        password = request.POST['password']
        user = authenticate(request, username =username, password = password)
 
        if user is not None:
            login(request,user)
            return redirect('/books')
        else:
            form = AuthenticationForm()
            return render(request,'itemsapp/signin.html',{'form':form})
     
    else:
        form = AuthenticationForm()
        return render(request, 'itemsapp/signin.html', {'form':form})

4) サインインビューの作成

サインアップビューの下に、以下の Sign-in View を views.py に追加します。

<form method = 'post'>
    {% csrf_token %}
    {{form.as_p}}
    <input type = "submit" value = "Submit">
</form>
 
<h3>Dont have an account??</h3><br>
<a href = "{% url 'signup' %}">SignUp Here</a>

Web ページの Sign-in Template は次のようになります。

from django.contrib.auth import logout
 
def signout(request):
    logout(request)
    return redirect('/books/signin/')

5) ログアウトビューの作成

最後に、Logout View のコードを views.py ファイルに追加します。

path('books/signup/', signup, name ='signup'),
path('books/signin/', signin, name = 'login'),
path('books/signout/', signout, name = 'logout'),

6) URLとViewsの対応付け

上記のセクションでコーディングされたViewsのURLパスは次のようになります。

from django.shortcuts import render,redirect
from django.contrib.auth import authenticate,login,logout
from django.contrib.auth.forms import AuthenticationForm,UserCreationForm
 
def signup(request):
 
    if request.user.is_authenticated:
        return redirect('/books')
     
    if request.method == 'POST':
        form = UserCreationForm(request.POST)
 
        if form.is_valid():
            form.save()
            username = form.cleaned_data['username']
            password = form.cleaned_data['password1']
            user = authenticate(username = username,password = password)
            login(request, user)
            return redirect('/books')
         
        else:
            return render(request,'itemsapp/signup.html',{'form':form})
     
    else:
        form = UserCreationForm()
        return render(request,'itemsapp/signup.html',{'form':form})
 
 
def signin(request):
    if request.user.is_authenticated:
        return redirect('/books')
     
    if request.method == 'POST':
        username = request.POST['username']
        password = request.POST['password']
        user = authenticate(request, username =username, password = password)
 
        if user is not None:
            login(request,user)
            return redirect('/books')
        else:
            form = AuthenticationForm()
            return render(request,'itemsapp/signin.html',{'form':form})
     
    else:
        form = AuthenticationForm()
        return render(request, 'itemsapp/signin.html', {'form':form})
 
 
def signout(request):
    logout(request)
    return redirect('/books/signin/')

コードの実装

個々のセクションのコードを見てきましたが、views.py ファイルの最終的なコードは以下のとおりです。

from django.contrib import admin
from django.urls import path,include
from .views import signup,signin,signout,books
 
urlpatterns = [
    path('books/', books),
    path('books/signup/', signup, name ='signup'),
    path('books/signin/', signin, name = 'login'),
    path('books/signout/', signout, name = 'logout'),
]

そして urls.py の最終的なコードは、次のようになります。

Facebook User Authentication Page
Facebook User Authentication Page

以上です! サーバーを起動して、”/books “に移動します。

エンドポイント “books/” にアクセスしたとき、もしあなたが認証されていなければ、最初にサインインウェブページにリダイレクトされます。

Books Website
Books Website

アカウントをお持ちでない場合は、以下のリンクをクリックすると、サインアップウェブページが表示されます。

Sign Up
Sign Up

必要事項を入力し、Enterキーを押すと、書籍のページに戻ります。

認証が完了すると、書籍リストが表示されます。

Books Webpage
Books Webpage

ログアウトを押すと、再びログインページに戻ります。

完了です。

まとめ

以上です。

以上、ユーザー認証とその実装方法についてでした。

この記事がユーザー認証に関する知識を得るのに役立てば幸いです。

では、また次の記事でお会いしましょう! では、また次回。

タイトルとURLをコピーしました