摘要：本教程內(nèi)容已過時(shí)，更新版教程請?jiān)L問博客開發(fā)入門教程。我們的評論表單放在中，評論成功后返回到原始提交頁面。學(xué)習(xí)小組簡介學(xué)習(xí)小組是一個(gè)促進(jìn)新手互相學(xué)習(xí)互相幫助的組織。

本教程內(nèi)容已過時(shí)，更新版教程請?jiān)L問： django 博客開發(fā)入門教程。

通過前四周的時(shí)間我們開發(fā)了一個(gè)簡單的個(gè)人 Blog，前幾期教程地址：

第一周：Django 學(xué)習(xí)小組：博客開發(fā)實(shí)戰(zhàn)第一周教程 —— 編寫博客的 Model 和首頁面

第二周：Django 學(xué)習(xí)小組：博客開發(fā)實(shí)戰(zhàn)第二周教程 —— 博客詳情頁面和分類頁面

第三周：Django 學(xué)習(xí)小組：博客開發(fā)實(shí)戰(zhàn)第三周教程 —— 文章列表分頁和代碼語法高亮

番外：Django 學(xué)習(xí)小組：基于類的通用視圖詳解（一）

第四周：Django 學(xué)習(xí)小組：博客開發(fā)實(shí)戰(zhàn)第四周——標(biāo)簽云與文章歸檔

本周我們將實(shí)現(xiàn) blog 文章的評論功能。

提示：在閱讀教程的過程中，如有任何問題請?jiān)L問我們項(xiàng)目的 GithHub 或評論留言以獲取幫助，本教程的相關(guān)代碼已全部上傳在 Github。如果你對我們的教程或者項(xiàng)目有任何改進(jìn)建議，請您隨時(shí)告知我們。更多交流請加入我們的郵件列表[email protected] 和關(guān)注我們在 GithHub 上的項(xiàng)目。
本文首發(fā)于編程派微信公眾號：編程派（微信號：codingpy）是一個(gè)專注Python編程的公眾號，每天更新有關(guān)Python的國外教程和優(yōu)質(zhì)書籍等精選干貨，歡迎關(guān)注。

首先需要為評論（Comment）設(shè)計(jì)一個(gè)數(shù)據(jù)庫表，并編寫相應(yīng)的 Model，將評論與文章關(guān)聯(lián)，再編寫發(fā)表評論的視圖，設(shè)置相應(yīng)的 url 即可。

blog/models.py

class BlogComment(models.Model):
    user_name = models.CharField("評論者名字", max_length=100)
    user_email = models.EmailField("評論者郵箱", max_length=255)
    body = models.TextField("評論內(nèi)容")
    created_time = models.DateTimeField("評論發(fā)表時(shí)間", auto_now_add=True)
    article = models.ForeignKey("Article", verbose_name="評論所屬文章", on_delete=models.CASCADE)

    def __str__(self):
        return self.body[:20]

參照大部分博客評論的樣式，我們的 BlogComment Model 包含這些字段：

user_name：用戶在評論前先要填寫他們想使用的昵稱

user_email：用戶在評論前先要填寫他們想使用的郵箱

body：用戶提交的評論內(nèi)容

created_time：評論提交時(shí)間

article：評論關(guān)聯(lián)的文章，因?yàn)橐粋€(gè)評論只能關(guān)聯(lián)某一篇文章，而一篇文章下可能有多個(gè)評論，因此是一對多的關(guān)系，使用 ForeignKey

表單用來給服務(wù)器后臺提交用戶填寫的數(shù)據(jù)，例如平時(shí)我們看到的填寫登錄、注冊信息的頁面就是一個(gè)登錄、注冊表單，用戶填寫表單信息后，點(diǎn)擊提交按鈕，表單中填寫的內(nèi)容就會打包發(fā)送給服務(wù)器后臺。我們需要為用戶填寫評論設(shè)置一個(gè)表單，django 的 form 模塊為我們提供了自動生成表單的功能，如果對表單不熟悉請參閱：官方文檔：表單概述 ，以了解基本的表單使用方法（如果你對表單感覺很陌生的話）。下面我們使用 Django 的 ModelForm （ django ModelForm 介紹 ）類為我們自動生成表單。首先在 blog 目錄下新建一個(gè) forms.py （和 models.py 同一目錄）文件用來存放 form 的代碼：

blog/forms.py

from django import forms
from .models import Article, BlogComment


class BlogCommentForm(forms.ModelForm):
    class Meta:
        """指定一些 Meta 選項(xiàng)以改變 form 被渲染后的樣式"""
        model = BlogComment # form 關(guān)聯(lián)的 Model
        
        fields = ["user_name", "user_email", "body"]
        # fields 表示需要渲染的字段，這里需要渲染user_name、user_email、body
        # 這樣渲染后表單會有三個(gè)文本輸入框，分別是輸入user_name、user_email、body的輸入框
        
        widgets = {
            # 為各個(gè)需要渲染的字段指定渲染成什么html組件，主要是為了添加css樣式。
            # 例如 user_name 渲染后的html組件如下：
            # 
            
            "user_name": forms.TextInput(attrs={
                "class": "form-control",
                "placeholder": "請輸入昵稱",
                "aria-describedby": "sizing-addon1",
            }),
            "user_email": forms.TextInput(attrs={
                "class": "form-control",
                "placeholder": "請輸入郵箱",
                "aria-describedby": "sizing-addon1",
            }),
            "body": forms.Textarea(attrs={"placeholder": "我來評兩句~"}),
        }

這里我們一如既往堅(jiān)持使用基于類的通用視圖，由于涉及到評論表單的提交處理，因此我們使用 FormView。這里對 FormView 的使用稍作講解。

在 Django 的基于函數(shù)的視圖中，涉及表單的處理的視圖其邏輯一般是這樣的：

def post_comment(request):
    if request.method =="POST":
        form = BlogCommentForm(request.POST)
        if form.is_valid():
            ...
        else:
            ...
     else:
        ...

即，首先判斷用戶是否通過表單 POST 了數(shù)據(jù)過來，如果是，則根據(jù) POST 過來的數(shù)據(jù)構(gòu)建一個(gè)表單，如果數(shù)據(jù)驗(yàn)證合法（form.is_valid），則創(chuàng)建評論，否則返回表單提交頁。如果沒有 POST 數(shù)據(jù)，則做其他相應(yīng)的事情。FormView 把這些邏輯做了整合，無需寫那么多 if else 語句：

blog/views.py

from django.views.generic.edit import FormView

...

class CommentPostView(FormView):
    form_class = BlogCommentForm # 指定使用的是哪個(gè)form
    template_name = "blog/detail.html" 
    # 指定評論提交成功后跳轉(zhuǎn)渲染的模板文件。
    # 我們的評論表單放在detail.html中，評論成功后返回到原始提交頁面。

    def form_valid(self, form):
        """提交的數(shù)據(jù)驗(yàn)證合法后的邏輯"""
        # 首先根據(jù) url 傳入的參數(shù)（在 self.kwargs 中）獲取到被評論的文章
        target_article = get_object_or_404(Article, pk=self.kwargs["article_id"])
        
        # 調(diào)用ModelForm的save方法保存評論，設(shè)置commit=False則先不保存到數(shù)據(jù)庫，
        # 而是返回生成的comment實(shí)例，直到真正調(diào)用save方法時(shí)才保存到數(shù)據(jù)庫。
        comment = form.save(commit=False)
        
        # 把評論和文章關(guān)聯(lián)
        comment.article = target_article
        comment.save()
        
        # 評論生成成功，重定向到被評論的文章頁面，get_absolute_url 請看下面的講解。
        self.success_url = target_article.get_absolute_url()
        return HttpResponseRedirect(self.success_url)

    def form_invalid(self, form):
        """提交的數(shù)據(jù)驗(yàn)證不合法后的邏輯"""
        target_article = get_object_or_404(Article, pk=self.kwargs["article_id"])
        
        # 不保存評論，回到原來提交評論的文章詳情頁面
        return render(self.request, "blog/detail.html", {
            "form": form,
            "article": target_article,
            "comment_list": target_article.blogcomment_set.all(),
        })

為了方便地重定向回原來提交評論的文章詳情頁面，我們?yōu)槲恼拢ˋrticle）的模型新增一個(gè)方法：get_absolute_url，調(diào)用該方法將得到該 Article 對應(yīng)的 url，例如這是文章 1 的 url：http://localhost:8000/article/1，則調(diào)用后返回 /article/1，這樣調(diào)用 HttpResponseRedirect 后將返回該 url 下的文章詳情頁。

blog/models.py

from django.core.urlresolvers import reverse

class Article(models.Model):
    STATUS_CHOICES = (
        ("d", "Draft"),
        ("p", "Published"),
    )

    ...
    
    class Meta:
        ordering = ["-last_modified_time"]

    # 新增 get_absolute_url 方法
    def get_absolute_url(self):
        # 這里 reverse 解析 blog:detail 視圖函數(shù)對應(yīng)的 url
        return reverse("blog:detail", kwargs={"article_id": self.pk})

同時(shí)為了在詳情頁渲染一個(gè)評論表單，稍微修改一下 ArticleDetailView 的視圖函數(shù)，把評論表單 form 插入模板上下文中：

blog/views.py

class ArticleDetailView(DetailView):
    model = Article
    template_name = "blog/detail.html"
    context_object_name = "article"
    pk_url_kwarg = "article_id"

    def get_object(self, queryset=None):
        obj = super(ArticleDetailView, self).get_object()
        obj.body = markdown2.markdown(obj.body, extras=["fenced-code-blocks"], )
        return obj

    # 新增 form 到 context
    def get_context_data(self, **kwargs):
        kwargs["comment_list"] = self.object.blogcomment_set.all()
        kwargs["form"] = BlogCommentForm()
        return super(ArticleDetailView, self).get_context_data(**kwargs)

urlpatterns = [
    url(r"^$", views.IndexView.as_view(), name="index"),
    ...
    # 設(shè)置評論視圖對應(yīng)的 url
    url(r"^article/(?Pd+)/comment/$", views.CommentPostView.as_view(), name="comment"),
]

新增了一個(gè) comment.html 文件以渲染評論表單和評論列表，并且修改了 detail.html 文件以在文章詳情頁顯示評論表單和評論列表，修改了blog/tatic 下的 style.css 為評論添加樣式，由于代碼比較多，就不貼出來了，主要是 html 和 css 的前端相關(guān)代碼，請到 GitHub 倉庫 更新相關(guān)的模板和靜態(tài)資源文件。

至此，整個(gè)評論功能的框架做好了，顯示效果如下：

當(dāng)然這只是一個(gè)評論的框架，很多細(xì)節(jié)有待處理和完善，但無論如何，用戶可以為我們的文章發(fā)表評論意見了。

django學(xué)習(xí)小組是一個(gè)促進(jìn) django 新手互相學(xué)習(xí)、互相幫助的組織。

小組在一邊學(xué)習(xí) django 的同時(shí)將一起完成幾個(gè)項(xiàng)目，包括：

一個(gè)簡單的 django 博客，用于發(fā)布小組每周的學(xué)習(xí)和開發(fā)文檔；

django中國社區(qū)，為國內(nèi)的 django 開發(fā)者們提供一個(gè)長期維護(hù)的 django 社區(qū)；

上面所說的這個(gè)社區(qū)類似于 segmentfault 和 stackoverflow ，但更加專注（只專注于 django 開發(fā)的問題）。

更多的信息請關(guān)注我們的?github 組織，本教程項(xiàng)目的相關(guān)源代碼也已上傳到 github 上。

同時(shí)，你也可以加入我們的郵件列表[email protected]?，隨時(shí)關(guān)注我們的動態(tài)。我們會將每周的詳細(xì)開發(fā)文檔和代碼通過郵件列表發(fā)出。

如有任何建議，歡迎提 Issue，歡迎 fork，pr，當(dāng)然也別忘了 star 哦！