Djangoで作る初めてのウェブアプリケーション(番外編)お問い合わせ機能
本記事は、マガジン(『超入門』Djangoで作る初めてのウェブアプリケーション)で作成した、Djangoアプリを使用します。
今日は簡単にGmailを使用して、お問い合わせフォームを作り実際に送信します。
メールサーバーの設定
メールを送る際にはSMTPメールサーバーの設定が必要になります。
settings.pyを下のように編集します。
Django/blog/blog/settings.py
#省略
EMAIL_BACKEND = 'django.core.mail.backends.smtp.EmailBackend'
EMAIL_HOST = 'smtp.googlemail.com'
EMAIL_USE_TLS = True
EMAIL_PORT = 587
EMAIL_HOST_USER = 'あなたの@gmail.com'
EMAIL_HOST_PASSWORD = 'あなたのパスワード'
コード説明です。
EMAIL_BACKENDは、Djangoでは簡単にメール送信を行うことが可能なモジュールがあるのでこちらを使用します。
EMAIL_HOSTは、使用するメールの設定です。今回はgmailを使用するので、googlemail.comとしています。
EMAIL_USE_TLSは、送信中の文章を暗号化するようにTrueを設定します。
EMAIL_PORTは、サーバーに接続するport番号の指定です。各メールサービスによって異なります。gmailは587です。
EMAIL_HOST_USERは、使用する人のgmailアカウント(Googleアカウント)を登録したときに決めたgmailのアドレスです。
EMAIL_HOST_PASSWORDは、後ほどgoogleのセキュリティ設定で、発行します。
これでsettings.pyの設定は完了です。
お問い合わせ用のフォームを作る
お問い合わせページで使用するフォームをforms.pyに作ります。
/Users/takuya/Desktop/Django/blog/blog_app/forms.py
from django import forms
#省略
class ContactForm(forms.Form):
name = forms.CharField(label='お名前', max_length=50)
email = forms.EmailField(label='メールアドレス',)
message = forms.CharField(label='メッセージ', widget=forms.Textarea)
見ての通り使用するフォームは、3つ(名前、メールアドレス、メッセージ)でシンプルです。
お問い合わせページを作ろう
作業手順は、urls.py→views.py→contact.html→done.htmlです。
Django/blog/blog_app/urls.py
#省略
app_name = 'blog_app'
urlpatterns = [
path('', views.index, name='index'),
path('detail/<int:post_id>/', views.detail, name='detail'),
path('add/', views.add, name='add'),
path('edit/<int:post_id>/', views.edit, name='edit'),
path('delete/<int:post_id>/', views.delete, name='delete'),
#追加
path('contact/', views.contact, name='contact'), #お問い合わせページ
path('contact/done/', views.done, name='done'), #お問い合わせ後のページ ]
お問い合わせページと、送信後に遷移するページのpathの設定です。
path('contact/', views.contact, name='contact'),
path('contact/done/', views.done, name='done')
views.pyにお問い合わせ用の関数を追加
Django/blog/blog_app/views.py
#省略
#追加
from django.http import HttpResponse
from django.conf import settings
import textwrap
from django.core.mail import BadHeaderError, EmailMessage
# redirectがなくてエラーが出ると言うことがあったので一応追加しときます。
from django.shortcuts import render, get_object_or_404, redirect
#ContactFormのみ! PostAddFormは別のフォーム用です!
from .forms import PostAddForm, ContactForm
#省略
#お問い合わせ
def contact(request):
form = ContactForm(request.POST or None)
if form.is_valid():
name = form.cleaned_data['name']
message = form.cleaned_data['message']
email = form.cleaned_data['email']
subject = 'お問い合わせありがとうございます。'
contact = textwrap.dedent('''
※このメールはシステムからの自動返信です。
{name} 様
お問い合わせありがとうございます。
以下の内容でお問い合わせを受け付けました。
内容を確認させていただき、ご返信させていただきますので、少々お待ちください。
----------------------------------
・お名前
{name}
・メールアドレス
{email}
・メッセージ
{message}
-----------------------------------
株式会社 〇〇
〒000-0000
〇〇県〇〇市〇〇区〇〇1-0-0
TEL 123-456-7890
営業時間 8:00~17:00(月~金)
WEB: https://www.......com/
''').format(
name=name,
email=email,
message=message
)
to_list = [email]
bcc_list = [settings.EMAIL_HOST_USER]
try:
message = EmailMessage(subject=subject, body=contact, to=to_list, bcc=bcc_list)
message.send()
except BadHeaderError:
return HttpResponse('無効なヘッダが検出されました。')
return redirect('blog_app:done')
return render(request, 'blog_app/contact.html',{'form': form})
def done(request):
return render(request, 'blog_app/done.html')
コード説明です。
from django.core.mail import BadHeaderError は、HTTPヘッダ・インジェクションというサイバー攻撃を防ぐためのものです。
例として、お問い合わせフォームの内容に、任意の改行などを入れて誤作動を引き起こさせたりします。
textwrap.dedent は文字列中の余白、空白などを取り除いてくれます。
今回はメールの内容をviews.pyで入力しているので、textwrap.dedentで予め空白や余白を取り除いておきます。
これでviews.pyができました。
お問い合わせページを作ろう
contact.htmlとdone.htmlを作ります。
Django/blog/templates/blog_app/contact.html
{% extends 'base.html' %}
{% block content %}
<div class="container">
<h1 class="mt-5 pt-4 text-center">お問い合わせ</h1>
<form action="{% url 'blog_app:contact' %}" method="POST">
{% csrf_token %}
<label for="id_name" class="sr-only">お名前</label>
<input class="form-control mb-3" name="name" maxlength="50" required="" id="id_name" type="text" placeholder="お名前">
<label for="id_email" class="sr-only">メールアドレス</label>
<input type="email" name="email" required="" id="id_email" placeholder="メールアドレス" class="form-control mb-3">
<label for="id_message" class="sr-only">メッセージ:</label>
<textarea name="message" cols="40" rows="10" required="" id="id_message" placeholder="メッセージ" class="form-control mb-3"></textarea>
<button type="submit" class="btn btn-block btn-outline-success">送信する</button>
</form>
</div>
{% endblock %}
Bootstrapを使用して、フォームを装飾しています。
フォームデータの送信先はcontact関数です。(url 'blog_app:contact')
続いてお問い合わせ後のページです。
Django/blog/templates/blog_app/done.html
{% bootstrap_css %}
{% bootstrap_javascript jquery='full' %}
<div class="m-5 text-center">
<div class="card d-inline-block">
<div class="card-body p-4">
<h4 class="card-title">お問い合わせありがとうございます。</h4>
<hr>
<a href="{% url 'blog_app:index' %}"><button type="button" class="btn btn-primary">トップページへ</button></a>
</div>
</div>
</div>
特にコードに新しい内容はありません。
これでDjangoでメールを送信する準備が完了しました。
しかし、このままではまだ送信できないので、googleのセキュリティ設定を変更する必要があります。
Google側の設定変更
ここからGoogleでアプリ専用のパスワードを発行します。
手順は二段階認証①の設定→パスワードの取得②です。
まずはグーグルのトップ画面の右上のアイコンをクリックします。
Googleアカウントを管理に進みます。
管理画面左のセキュリティをクリックします。
すると下のように2段階認証プロセスとアプリパスワードが確認できます。
今回は既に行っており、自身のセキュリティの関連もあるのでここからは、Googleの指示に従うだけなので2段階認証と、アプリパスワードを設定してみてください。
アプリパスワードが取得できたら、settings.pyに貼り付けましょう。
#省略
EMAIL_BACKEND = 'django.core.mail.backends.smtp.EmailBackend'
EMAIL_HOST = 'smtp.googlemail.com'
EMAIL_USE_TLS = True
EMAIL_PORT = 587
EMAIL_HOST_USER = 'あなたの@gmail.com'
EMAIL_HOST_PASSWORD = 'ここに貼り付け'
実際にメールを送信してみよう
現在http://127.0.0.1:8000/contact/を確認すると下のように表示されます。
値を入力して正しく送信されるとhttp://127.0.0.1:8000/contact/done/にページ遷移します。
これでホスト(自身)と問い合わせたユーザーに同じ内容のメールが届きます。
お問い合わせページの完成です。
お疲れ様です!
この記事が気に入ったらサポートをしてみませんか?