【Django】メッセージフレームワークの実装について
アプリの投稿などアクションの結果をメッセージとして表示させる為の機能として、メッセージフレームワークというものがあります。今回はメッセージフレームワークの実装について書いていきます。
1.setting.pyの確認・設定
setting.py
INSTALLED_APPS = [
...
'django.contrib.messages',
...
]
TEMPLATES = [
{
...
'OPTIONS': {
'context_processors': [
...
'django.contrib.messages.context_processors.messages',
],
},
},
]
INSTALLED_APPS、MIDDLEWAREはデフォルトの状態で上記のようになっています。
MESSAGE_STORAGEの設定はパフォーマンスに優れたCookieStorageやCookieStoragenとSessionStorageの適位切替の設定（FallbackStorage、デフォルト設定）がありますが、一部うまく表示されないことがあるそうです。
2.view.pyの設定
viewでは主にmessagesのインポートと関数にメッセージ文を組み込みます。
#messagesのインポート
from django.contrib import messages
#メッセージのタイプは以下の通りタイプによってテンプレートのhtmlのclassが変わります。
messages.info(self.request, "メッセージ内容")
messages.success(self.request, "メッセージ内容")
messages.warning(self.request, "メッセージ内容。")
messages.error(self.request, "メッセージ内容")
messages.debug(self.request, "メッセージ内容")
自分の使用例
view.py
from django.contrib.auth.mixins import UserPassesTestMixin, LoginRequiredMixin
from django.views.generic import UpdateView
from django.contrib import messages
from .forms import UserUpdateForm
class UserUpdateView(UpdateView, UserPassesTestMixin, LoginRequiredMixin):
model = CustomUser
form_class = UserUpdateForm
template_name = 'user_info.html'
success_url = '/'
def form_valid(self, form):
form.instance.custom_user = self.request.user
messages.info(self.request, "プロフィールを更新しました。")
return super().form_valid(form) #formのrequestのメッセージとしてreturn
また、messages.success(self.request, "メッセージ内容")の内容であれば、
以下のSuccessMessageMixinのインポートとsuccess_message = "メッセージ内容"で実装できます。以下はログイン時のメッセージ導入の場合。
view.py
class LogInView(SuccessMessageMixin, LoginView):
template_name = 'account/index.html'
success_url = '/userpage'
success_message = "ログインしました。"
汎用view(django.views.generic)であれば、CreateView, UpdateView, DeleteViewなどで使えるそうです（自分では未検証）。
3.templateファイル
{% if messages %}
{% for message in messages %}
<div class="alert alert-{{ message.tags }}"> #メッセージのタイプによってclass名が変わる
<div class="message-body">
{{ message }}
</div>
</div>
{% endfor %}
{% endif %}
実装の様子
字が小さいですがメッセージの導入が完了しました。
このままでは見た目がアレなので、次回はフロントエンド側について書いていきます。
