Django2 でユーザー認証(ログイン認証)を実装するチュートリアル -3- ブログアプリへの実装

1 環境構築とアプリ雛形の作成 および 2 サインアップとログイン・ログアウトの続きです。前回の記事ではユーザー認証とユーザー登録(サインアップ)についての実装を行いました。

今回はDjango 2 によるユーザー認証(ログイン認証)と CRUD の総仕上げです。第1回で作成したダミー状態のブログアプリについて、記事一覧表示・記事作成・編集・削除機能を仕上げていきましょう。

今回はこれまでのチュートリアルの復習です。新しく学ぶことはあまりないので、詳細はGithubのソースコードとデモサイトにまかせ、このコラムでは簡単な補足説明のみとします。

ソースコードとデモサイト

下記よりチュートリアルの最終的なソースコードとデモサイトをチェックできます。

ソースコード
https://github.com/toksan/django2_tutorial_blog_with_auth

デモサイト
https://tutorialauth.it-engineer-lab.com

ブログアプリのCRUDと認証の実装

1 環境構築とアプリ雛形の作成で作成したブログアプリ(blogs)に、汎用クラスベースビューを使ってCRUD処理を実装していきます。

もし汎用クラスベースビューによる CRUD 処理がはじめての方はDjango2 入門チュートリアル – CRUDの基本を簡単なサンプルで学ぶ – 4 – 汎用クラスベースビューによるCRUDの実装を参照ください。

 

Django の典型的なワークフロー

Djangoによるアプリ開発は公式チュートリアルのワークフローのように

  1. モデル作成とマイグレーション(models.py, migration)
  2. URL設計・ルーティング(urls.py)
  3. ビューの作成(views.py)
  4. テンプレートの作成(templates)
  5. 静的ファイルの作成と設置(static files)

の順で進めるとスムーズです。このワークフローに沿って進めていきます。

 

1. モデル作成とマイグレーション(models.py, migration)

こちらは第1回で実施済みにつき、1 環境構築とアプリ雛形の作成を参照ください。

 

2. URL設計・ルーティング(URLConf)

もはや聞き飽きたかもしれませんが、Django のルーティングはアプリレベルのURL設定とプロジェクトレベルのURL設計の2段階です。

まずはアプリレベルのURL設定です。myblog/blogs/urls.py を下記のように編集しましょう。※ビューはこの後すぐに実装しますが、とりあえずURL設定だけ済ませておきます。

 

次に myblog/myblog/urls.py を編集します。※第1回で済ませているので、順を追って読み進めている場合には不要です。

 

3. ビューの作成(views.py)

汎用クラスベースビューを用いてビューを作成します。ソースコードを記事内に書くと非常に煩雑になってしまうので、myblog/blogs/views.py のソースコードは下記Githubよりご覧ください。

https://github.com/toksan/django2_tutorial_blog_with_auth/blob/master/myblog/blogs/views.py

Django が標準提供している汎用クラスベースビュー  generic.ListView / generic.DetailView / generic.edit.CreateView / generic.edit.UpdateView / generic.edit.DeleteView を継承している点はCRUDの入門チュートリアルと全く同じです。

ただし、今回はログインしていないユーザーからのアクセスをブロックするため、Create / Update / Delete の処理には LoginRequiredMixin を継承しています。※Python は多重継承が可能なプログラミング言語です。

 

4. テンプレートの作成(templates)

テンプレートのソースコードは下記より確認できます。

https://github.com/toksan/django2_tutorial_blog_with_auth/tree/master/myblog/blogs/templates/blogs

あまり学ぶことはありませんが、テンプレート上でユーザー認証が関係する処理について2点だけ補足します。

user.is_authenticated
myblog/blogs/templates/blogs/post_list.html の7行目〜

{% if user.is_authenticated %}  〜〜〜  {% endif %} で囲んだ箇所は、ログイン中のユーザーにのみ表示されます。とても重要なので覚えておきましょう。

 

request.user.id
myblog/blogs/templates/blogs/post_detail.html の15行目〜

テンプレート中でログインしているユーザーの id を取得するには request.user.id を使います。とても重要なので覚えておきましょう。

{% if request.user.id == object.author_id %} 〜〜〜 {% endif %}はログイン中のユーザーIDと記事投稿者のIDが同じ場合、つまり、記事を書いた本人にのみ表示するための条件分岐です。

 

5. 静的ファイルの作成と設置(static files)

本チュートリアルで必要な静的ファイルは、デザインを整えるだけの簡単なcssファイルのみです。静的ファイルの設置場所は自由ですが、今回は blogs アプリとaccounts アプリの両方で共通デザインとするため、下記の位置に静的ファイルを設置してみます。

 

myblog/static ディレクトリは勝手に設置したので、Django は把握できません。Django に「ここに静的ファイル用ディレクトリを設置したよ!」と教えるため、プロジェクトの設定ファイル( myblog/myblog/settings.py )に STATICFILES_DIRS という設定項目を追加します。

 

上記設定が終われば、あとは style.css を作成するだけです。style.css は特別なことはありません。最低限のデザインを整えるだけの単純なCSSファイルです。

書きなぐりのCSSですが sytle.css の内容は下記より確認できます。

https://github.com/toksan/django2_tutorial_blog_with_auth/blob/master/myblog/static/css/style.css

style.css を作成したら、共通テンプレート myblog/templates/base.html の<head>タグ内で読み込みましょう。

 

以上でDjango2 でユーザー認証(ログイン認証)を実装するチュートリアルは完了です。お疲れ様でした!

このチュートリアルのソースコードとデモサイトは下記より参照可能です。

 

ソースコード
https://github.com/toksan/django2_tutorial_blog_with_auth

 

デモサイト
https://tutorialauth.it-engineer-lab.com

 

この記事が役に立ったら是非シェアください!

 

2 Comments

hogemaru

素晴らしい記事ありがとうございます!
誤字(?)脱字?を見つけたので..!

1 環境構築とアプリ雛形の作成で作成したブログアプリ(blos)に、汎用クラスベースビューを使ってCRUD処理を実装していきます。

>blos
の部分がblogsかと

返信する

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です