第 14 篇：交流的桥梁“评论功能”—— HelloDjango 系列教程

时间 2019-11-30

标签交流桥梁评论功能 hellodjango 系列教程繁體版

原文原文链接

做者：HelloGitHub- 追梦人物

文中涉及的示例代码，已同步更新到 HelloGitHub-Team 仓库html

截止到目前为止咱们的 django blog 文章展现部分，已经实现的“八九不离十”了。你觉得本系列文章就要结束了吗？不可以！新的征程才刚刚开始，HelloDjango 系列文章刚刚过半，后面的文章你将接触更多博客系统的细节。向着一个小而全的博客系统前进、前进、前进，你定会收获颇多。前端

今天咱们就来开启博客的评论功能，建起和读者的沟通桥梁。python

建立评论应用

相对来讲，评论是另一个比较独立的功能。Django 提倡，若是功能相对比较独立的话，最好是建立一个应用，把相应的功能代码组织到这个应用里。咱们的第一个应用叫 blog，它里面放了展现博客文章列表和详情等相关功能的代码。而这里咱们再建立一个应用，名为 comments 这里面将存放和评论功能相关的代码。首先进入到项目根目录，而后输入以下命令建立一个新的应用：git

> pipenv run python manage.py startapp comments
复制代码

能够看到生成的 comments 应用目录结构和 blog 应用的目录是相似的（关于建立应用以及应用的目录结构在 "空空如也"的博客应用中已经有过详细介绍）。github

建立新的应用后必定要记得在 settings.py 里注册这个应用，django 才知道这是一个应用。shell

blogproject/settings.py

...
INSTALLED_APPS = [
    ...
    'blog.apps.BlogConfig',  # 注册 blog 应用
    'comments.apps.CommentsConfig',  # 注册 comments 应用
]v
...
复制代码

注意这里注册的是 CommentsConfig 类，在博客从“裸奔”到“有皮肤” 中曾经讲过如何对应用作一些初始化配置，例如让 blog 应用在 django 的 admin 后台显示中文名字。这里也对评论应用作相似的配置：数据库

comments/app.py

from django.apps import AppConfig


class CommentsConfig(AppConfig):
    name = 'comments'
    verbose_name = '评论'
复制代码

设计评论的数据库模型

用户评论的数据必须被存储到数据库里，以便其余用户访问时 django 能从数据库取回这些数据而后展现给访问的用户，所以咱们须要为评论设计数据库模型，这和设计文章、分类、标签的数据库模型是同样的，若是你忘了怎么作，再回顾一下建立 Django 博客的数据库模型中的作法。咱们的评论模型设计以下（评论模型的代码写在 comments\models.py 里）：django

comments/models.py

from django.db import models
from django.utils import timezone


class Comment(models.Model):
    name = models.CharField('名字', max_length=50)
    email = models.EmailField('邮箱')
    url = models.URLField('网址', blank=True)
    text = models.TextField('内容')
    created_time = models.DateTimeField('建立时间', default=timezone.now)
    post = models.ForeignKey('blog.Post', verbose_name='文章', on_delete=models.CASCADE)

    class Meta:
        verbose_name = '评论'
        verbose_name_plural = verbose_name

    def __str__(self):
        return '{}: {}'.format(self.name, self.text[:20])
复制代码

评论会保存评论用户的 name（名字）、email（邮箱）、url（我的网站，能够为空），用户发表的内容将存放在 text 字段里，created_time 记录评论时间。最后，这个评论是关联到某篇文章（Post）的，因为一个评论只能属于一篇文章，一篇文章能够有多个评论，是一对多的关系，所以这里咱们使用了 ForeignKey。关于 ForeignKey 咱们前面已有介绍，这里再也不赘述。编程

此外，在博客从“裸奔”到“有皮肤” 中提过，全部模型的字段都接受一个 verbose_name 参数（大部分是第一个位置参数），django 在根据模型的定义自动生成表单时，会使用这个参数的值做为表单字段的 label，咱们在后面定义的评论表单时会进一步看到其做用。bootstrap

建立了数据库模型就要迁移数据库，迁移数据库的命令也在前面讲过。在项目根目录下分别运行下面两条命令：

> pipenv run python manage.py makemigrations
> pipenv run python manage.py migrate
复制代码

注册评论模型到 admin

既然已经建立了模型，咱们就能够将它注册到 django admin 后台，方便管理员用户对评论进行管理，如何注册 admin 以及美化在博客从“裸奔”到“有皮肤” 有过详细介绍，这里给出相关代码：

comments/admin.py

from django.contrib import admin
from .models import Comment


class CommentAdmin(admin.ModelAdmin):
    list_display = ['name', 'email', 'url', 'post', 'created_time']
    fields = ['name', 'email', 'url', 'text', 'post']


admin.site.register(Comment, CommentAdmin)
复制代码

设计评论表单

这一节咱们将学习一个全新的 django 知识：表单。那么什么是表单呢？基本的 HTML 知识告诉咱们，在 HTML 文档中这样的代码表示一个表单：

<form action="" method="post">
  <input type="text" name="username" />
  <input type="password" name="password" />
  <input type="submit" value="login" />
</form>
复制代码

为何须要表单呢？表单是用来收集并向服务器提交用户输入的数据的。考虑用户在咱们博客网站上发表评论的过程。当用户想要发表评论时，他找到咱们给他展现的一个评论表单（咱们已经看到在文章详情页的底部就有一个评论表单，你将看到表单呈现给咱们的样子），而后根据表单的要求填写相应的数据。以后用户点击评论按钮，这些数据就会发送给某个 URL。咱们知道每个 URL 对应着一个 django 的视图函数，因而 django 调用这个视图函数，咱们在视图函数中写上处理用户经过表单提交上来的数据的代码，好比验证数据的合法性而且保存数据到数据库中，那么用户的评论就被 django 处理了。若是经过表单提交的数据存在错误，那么咱们把错误信息返回给用户，并在前端从新渲染表单，要求用户根据错误信息修正表单中不符合格式的数据，再从新提交。

django 的表单功能就是帮咱们完成上述所说的表单处理逻辑，表单对 django 来讲是一个内容丰富的话题，很难经过教程中的这么一个例子涵盖其所有用法。所以咱们强烈建议你在完成本教程后接下来的学习中仔细阅读 django 官方文档关于表单的介绍，由于表单在 Web 开发中会常常遇到。

下面开始编写评论表单代码。在 comments\ 目录下（和 models.py 同级）新建一个 forms.py 文件，用来存放表单代码，咱们的表单代码以下：

comments/forms.py

from django import forms
from .models import Comment


class CommentForm(forms.ModelForm):
    class Meta:
        model = Comment
        fields = ['name', 'email', 'url', 'text']
复制代码

要使用 django 的表单功能，咱们首先导入 forms 模块。django 的表单类必须继承自 forms.Form 类或者 forms.ModelForm 类。若是表单对应有一个数据库模型（例如这里的评论表单对应着评论模型），那么使用 ModelForm 类会简单不少，这是 django 为咱们提供的方便。以后咱们在表单的内部类 Meta 里指定一些和表单相关的东西。model = Comment 代表这个表单对应的数据库模型是 Comment 类。fields = ['name', 'email', 'url', 'text'] 指定了表单须要显示的字段，这里咱们指定了 name、email、url、text 须要显示。

关于表单进一步的解释

django 为何要给咱们提供一个表单类呢？为了便于理解，咱们能够把表单和前面讲过的 django ORM 系统作类比。回想一下，咱们使用数据库保存建立的博客文章，可是从头至尾没有写过任何和数据库有关的代码（要知道数据库自身也有一门数据库语言），这是由于 django 的 ORM 系统内部帮咱们作了一些事情。咱们遵循 django 的规范写的一些 Python 代码，例如建立 Post、Category 类，而后经过运行数据库迁移命令将这些代码反应到数据库。

django 的表单和这个思想相似，正常的前端表单代码应该是和本文开头所说起的那样的 HTML 代码，可是咱们目前并无写这些代码，而是写了一个 CommentForm 这个 Python 类。经过调用这个类的一些方法和属性，django 将自动为咱们建立常规的表单代码，接下来的教程咱们就会看到具体是怎么作的。

展现评论表单

表单类已经定义完毕，如今的任务是在文章的详情页下方将这个表单展示给用户，用户即可以经过这个表单填写评论数据，从而发表评论。

那么怎么展示一个表单呢？django 会根据表单类的定义自动生成表单的 HTML 代码，咱们要作的就是实例化这个表单类，而后将表单的实例传给模板，让 django 的模板引擎来渲染这个表单。

那怎么将表单类的实例传给模板呢？由于表单出如今文章详情页，一种想法是修改文章详情页 detail 视图函数，在这个视图中实例化一个表单，而后传递给模板。然而这样作的一个缺点就是须要修改 detail 视图函数的代码，并且 detail 视图函数的做用主要就是处理文章详情，一个视图函数最好不要让它作太多杂七杂八的事情。另一种想法是使用自定义的模板标签，咱们在页面侧边栏：使用自定义模板标签中详细介绍过如何自定义模板标签来渲染一个局部的 HTML 页面，这里咱们使用自定义模板标签的方法，来渲染表单页面。

和 blog 应用中定义模板标签的老套路同样，首先创建评论应用模板标签的文件结构，在 comments\ 文件夹下新建一个 templatetags 文件夹，而后建立 __init__.py 文件使其成为一个包，再建立一个 comments_extras.py 文件用于存放模板标签的代码，文件结构以下：

...
blog\
comments\
	templatetags\
		__init__.py
		comments_extras.py
...
复制代码

而后咱们定义一个 inclusion_tag 类型的模板标签，用于渲染评论表单，关于如何定义模板标签，在页面侧边栏：使用自定义模板标签中已经有详细介绍，这里再也不赘述。

from django import template
from ..forms import CommentForm

register = template.Library()


@register.inclusion_tag('comments/inclusions/_form.html', takes_context=True)
def show_comment_form(context, post, form=None):
    if form is None:
        form = CommentForm()
    return {
        'form': form,
        'post': post,
    }
复制代码

从定义能够看到，show_comment_form 模板标签使用时会接受一个 post（文章 Post 模型的实例）做为参数，同时也可能传入一个评论表单 CommentForm 的实例 form，若是没有接受到评论表单参数，模板标签就会新建立一个 CommentForm 的实例（一个没有绑定任何数据的空表单）传给模板，不然就直接将接受到的评论表单实例直接传给模板，这主要是为了复用已有的评论表单实例（后面会看到其用法）。

而后在 templates/comments/inclusions 目录下（没有就新建）新建一个 _form.html 模板，写上代码：

<form action="{% url 'comments:comment' post.pk %}" method="post" class="comment-form">
  {% csrf_token %}
  <div class="row">
    <div class="col-md-4">
      <label for="{{ form.name.id_for_label }}">{{ form.name.label }}：</label>
      {{ form.name }}
      {{ form.name.errors }}
    </div>
    <div class="col-md-4">
      <label for="{{ form.email.id_for_label }}">{{ form.email.label }}：</label>
      {{ form.email }}
      {{ form.email.errors }}
    </div>
    <div class="col-md-4">
      <label for="{{ form.url.id_for_label }}">{{ form.url.label }}：</label>
      {{ form.url }}
      {{ form.url.errors }}
    </div>
    <div class="col-md-12">
      <label for="{{ form.text.id_for_label }}">{{ form.text.label }}：</label>
      {{ form.text }}
      {{ form.text.errors }}
      <button type="submit" class="comment-btn">发表</button>
    </div>
  </div>    <!-- row -->
</form>
复制代码

这个表单的模板有点复杂，一一讲解一下。

首先 HTML 的 form 标签有 2 个重要的属性，action 和 method。action 指定表单内容提交的地址，这里咱们提交给 comments:comment 视图函数对应的 URL（后面会建立这个视图函数并绑定对应的 URL），模板标签 url 的用法在分类、归档和标签页教程中有详细介绍。method 指定提交表单时的 HTTP 请求类型，通常表单提交都是使用 POST。

而后咱们看到 {% csrf_token %}，这个模板标签在表单渲染时会自动渲染为一个隐藏类型的 HTML input 控件，其值为一个随机字符串，做用主要是为了防御 CSRF（跨站请求伪造）攻击。{% csrf_token %} 在模板中渲染出来的内容大概以下所示：

<input type="hidden" name="csrfmiddlewaretoken" value="KH9QLnpQPv2IBcv3oLsksJXdcGvKSnC8t0mTfRSeNIlk5T1G1MBEIwVhK4eh6gIZ">
复制代码

CSRF 攻击是一种常见的 Web 攻击手段。攻击者利用用户存储在浏览器中的 cookie，向目标网站发送 HTTP 请求，这样在目标网站看来，请求来自于用户，而实际发送请求的人倒是攻击者。例如假设咱们的博客支持登陆功能（目前没有），并使用 cookie（或者 session）记录用户的登陆状态，且评论表单没有 csrf token 防御。用户登陆了咱们的博客后，又去访问了一个小电影网站，小电影网站有一段恶意 JavaScript 脚本，它读取用户的 cookie，并构造了评论表单的数据，而后脚本使用这个 cookie 向咱们的博客网站发送一条 POST 请求，django 就会认为这是来自该用户的评论发布请求，便会在后台建立一个该用户的评论，而这个用户全程一脸懵逼。

CSRF 的一个防范措施是，对全部访问网站的用户颁发一个令牌（token），对于敏感的 HTTP 请求，后台会校验此令牌，确保令牌的确是网站颁发给指定用户的。所以，当用户访问别的网站时，虽然攻击者能够拿到用户的 cookie，可是没法取得证实身份的令牌，所以发过来的请求便不会被受理。

以上是对 CSRF 攻击和防御措施的一个简单介绍，更加详细的讲解请使用搜索引擎搜索相关资料。

show_comment_form 模板标签给模板传递了一个模板变量 form，它是 CommentForm 的一个实例，表单的字段 {{ form.name }}、{{ form.email }}、{{ form.url }} 等将自动渲染成表单控件，例如 <input> 控件。

注意到表单的定义中并无定义 name、email、url 等属性，那它们是哪里来的呢？看到 CommentForm 中 Meta 下的 fields，django 会自动将 fields 中声明的模型字段设置为表单的属性。

{{ form.name.errors }}、{{ form.email.errors }} 等将渲染表单对应字段的错误（若是有的话），例如用户 email 格式填错了，那么 django 会检查用户提交的 email 的格式，而后将格式错误信息保存到 errors 中，模板便将错误信息渲染显示。

{{ form.xxx.label }} 用来获取表单的 label，以前说过，django 根据表单对应的模型中字段的 verbose_name 参数生成。

而后咱们就能够在 detail.html 中使用这个模板标签来渲染表单了，注意在使用前记得先 {% load comment_extras %} 这个模块。并且为了不可能的报错，最好重启一下开发服务器。

{% extends 'base.html' %}
{% load comment_extras %}
...

<h3>发表评论</h3>
{% show_comment_form post %}
复制代码

这里当用户访问文章详情页面时，咱们给他展现一个空表单，因此这里只传入了 post 参数须要的值，而没有传入 form 参数所需的值。能够看到表单渲染出来的结果了：

评论视图函数

当用户提交表单中的数据后，django 须要调用相应的视图函数来处理这些数据，下面开始写咱们视图函数处理逻辑：

from blog.models import Post
from django.shortcuts import get_object_or_404, redirect, render
from django.views.decorators.http import require_POST

from .forms import CommentForm


@require_POST
def comment(request, post_pk):
    # 先获取被评论的文章，由于后面须要把评论和被评论的文章关联起来。
    # 这里咱们使用了 django 提供的一个快捷函数 get_object_or_404，
    # 这个函数的做用是当获取的文章（Post）存在时，则获取；不然返回 404 页面给用户。
    post = get_object_or_404(Post, pk=post_pk)

    # django 将用户提交的数据封装在 request.POST 中，这是一个类字典对象。
    # 咱们利用这些数据构造了 CommentForm 的实例，这样就生成了一个绑定了用户提交数据的表单。
    form = CommentForm(request.POST)

    # 当调用 form.is_valid() 方法时，django 自动帮咱们检查表单的数据是否符合格式要求。
    if form.is_valid():
        # 检查到数据是合法的，调用表单的 save 方法保存数据到数据库，
        # commit=False 的做用是仅仅利用表单的数据生成 Comment 模型类的实例，但还不保存评论数据到数据库。
        comment = form.save(commit=False)

        # 将评论和被评论的文章关联起来。
        comment.post = post

        # 最终将评论数据保存进数据库，调用模型实例的 save 方法
        comment.save()

        # 重定向到 post 的详情页，实际上当 redirect 函数接收一个模型的实例时，它会调用这个模型实例的 get_absolute_url 方法，
        # 而后重定向到 get_absolute_url 方法返回的 URL。
        return redirect(post)

    # 检查到数据不合法，咱们渲染一个预览页面，用于展现表单的错误。
    # 注意这里被评论的文章 post 也传给了模板，由于咱们须要根据 post 来生成表单的提交地址。
    context = {
        'post': post,
        'form': form,
    }
    return render(request, 'comments/preview.html', context=context)
复制代码

这个评论视图相比以前的一些视图复杂了不少，主要是处理评论的过程更加复杂。具体过程在代码中已有详细注释，这里仅就视图中出现了一些新的知识点进行讲解。

首先视图函数被 require_POST 装饰器装饰，从装饰器的名字就能够看出，其做用是限制这个视图只能经过 POST 请求触发，由于建立评论须要用户经过表单提交的数据，而提交表单一般都是限定为 POST 请求，这样更加安全。

另外咱们使用了 redirect 快捷函数。这个函数位于 django.shortcuts 模块中，它的做用是对 HTTP 请求进行重定向（即用户访问的是某个 URL，但因为某些缘由，服务器会将用户重定向到另外的 URL）。redirect 既能够接收一个 URL 做为参数，也能够接收一个模型的实例做为参数（例如这里的 post）。若是接收一个模型的实例，那么这个实例必须实现了 get_absolute_url 方法，这样 redirect 会根据 get_absolute_url 方法返回的 URL 值进行重定向。

若是用户提交的数据合法，咱们就将评论数据保存到数据库，不然说明用户提交的表单包含错误，咱们将渲染一个 preview.html 页面，来展现表单中的错误，以便用户修改后从新提交。preview.html 的代码以下：

{% extends 'base.html' %}
{% load comment_extras %}

{% block main %}
  {% show_comment_form post form %}
{% endblock main %}
复制代码

这里仍是使用 show_comment_form 模板标签来展现一个表单，然而不一样的是，这里咱们传入由视图函数 comment 传来的绑定了用户提交的数据的表单实例 form，而不是渲染一个空表单。由于视图函数 comment 中的表单实例是绑定了用户提交的评论数据，以及对数据进行过合法性校验的表单，所以当 django 渲染这个表单时，会连带渲染用户已经填写的表单数据以及数据不合法的错误提示信息，而不是一个空的表单了。例以下图，咱们提交的数据中 email 格式不合法，表单校验了数据格式，而后渲染错误提示：

绑定 URL

视图函数须要和 URL 绑定，这里咱们在 comment 应用中再建一个 urls.py 文件，写上 URL 模式：

from django.urls import path

from . import views

app_name = 'comments'
urlpatterns = [
    path('comment/<int:post_pk>', views.comment, name='comment'),
]
复制代码

别忘了给这个评论的 URL 模式规定命名空间，即 app_name = 'comments'。

最后要在项目的 blogproject\ 目录的 urls.py 里包含 comments\urls.py 这个文件：

blogproject/urls.py

urlpatterns = [
    url(r'^admin/', admin.site.urls),
    url(r'', include('blog.urls')),
    url(r'', include('comments.urls')),
]
复制代码

能够测试一下提交评论的功能了，首先尝试输入非法格式的数据，例如将邮箱输入为 xxx@xxx，那么评论视图在校验表单数据合法性时，发现邮箱格式不符，就会渲染 preview 页面，展现表单中的错误，将邮箱修改成正确的格式后，再次点击发表，页面就跳转到了被评论文章的详情页，说明视图正确执行了保存表单数据到数据库的逻辑。

不过这里有一点很差的地方就是，评论成功后页面直接跳转到了被评论文章的详情页，没有任何提示，用户也不知道评论究竟有没有真的成功。这里咱们使用 django 自带的 messages 应用来给用户发送评论成功或者失败的消息。

发送评论消息

django 默认已经为咱们作好了 messages 的相关配置，直接用便可。

两个地方须要发送消息，第一个是当评论成功，即评论数据成功保存到数据库后，所以在 comment 视图中加一句。

from django.contrib import messages

if form.is_valid():
    ...
    # 最终将评论数据保存进数据库，调用模型实例的 save 方法
    comment.save()

    messages.add_message(request, messages.SUCCESS, '评论发表成功！', extra_tags='success')
    return redirect(post)
复制代码

这里导入 django 的 messages 模块，使用 add_message 方法增长了一条消息，消息的第一个参数是当前请求，由于当前请求携带用户的 cookie，django 默认将详细存储在用户的 cookie 中。第二个参数是消息级别，评论发表成功的消息设置为 messages.SUCCESS，这是 django 已经默认定义好的一个整数，消息级别也能够本身定义。紧接着传入消息的内容，最后 extra_tags 给这条消息打上额外的标签，标签值能够在展现消息时使用，好比这里咱们会把这个值用在模板中的 HTML 标签的 class 属性，增长样式。

一样的，若是评论失败了，也发送一条消息：

# 检查到数据不合法，咱们渲染一个预览页面，用于展现表单的错误。
# 注意这里被评论的文章 post 也传给了模板，由于咱们须要根据 post 来生成表单的提交地址。
context = {
    'post': post,
    'form': form,
}
messages.add_message(request, messages.ERROR, '评论发表失败！请修改表单中的错误后从新提交。', extra_tags='danger')
复制代码

发送的消息被缓存在 cookie 中，而后咱们在模板中获取显示便可。显示消息比较好的地方是在导航条的下面，咱们在模板 base.html 的导航条代码下增长以下代码：

<header>
  ...
</header>
{% if messages %}
    {% for message in messages %}
      <div class="alert alert-{{ message.tags }} alert-dismissible" role="alert">
        <button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">&times;</span></button>
        {{ message }}
      </div>
    {% endfor %}
{% endif %}
复制代码

这里 django 会经过全局上下文自动把 messages 变量传给模板，这个变量里存储咱们发送的消息内容，而后就是循环显示消息了。这里咱们使用了 bootstrap 的一个 alert 组件，为其设置不一样的 class 会显示不一样的颜色，因此以前添加消息时传入的 extra_tags 就派上了用场。好比这里 alert-{{ message.tags }}，当传入的是 success 时，类名就为 alert-success，这时显示的消息背景颜色就是绿色，传入的是 dangerous，则显示的就是红色。

评论发布成功和失败的消息效果以下图：

显示评论内容

为了避免改动已有的视图函数的代码，评论数据咱们也使用自定义的模板标签来实现。模板标签代码以下：

@register.inclusion_tag('comments/inclusions/_list.html', takes_context=True)
def show_comments(context, post):
    comment_list = post.comment_set.all().order_by('-created_time')
    comment_count = comment_list.count()
    return {
        'comment_count': comment_count,
        'comment_list': comment_list,
    }
复制代码

咱们使用了 post.comment_set.all() 来获取 post 对应的所有评论。 Comment 和Post 是经过 ForeignKey 关联的，回顾一下咱们当初获取某个分类 cate 下的所有文章时的代码：Post.objects.filter(category=cate)。这里 post.comment_set.all() 也等价于 Comment.objects.filter(post=post)，即根据 post 来过滤该 post 下的所有评论。但既然咱们已经有了一个 Post 模型的实例 post（它对应的是 Post 在数据库中的一条记录），那么获取和 post 关联的评论列表有一个简单方法，即调用它的 xxx_set 属性来获取一个相似于 objects 的模型管理器，而后调用其 all 方法来返回这个 post 关联的所有评论。其中 xxx_set 中的 xxx 为关联模型的类名（小写）。例如 Post.objects.filter(category=cate) 也能够等价写为 cate.post_set.all()。

模板 _list.html 代码以下：

<h3>评论列表，共 <span>{{ comment_count }}</span> 条评论</h3>
<ul class="comment-list list-unstyled">
  {% for comment in comment_list %}
    <li class="comment-item">
      <span class="nickname">{{ comment.name }}</span>
      <time class="submit-date" datetime="{{ comment.created_time }}">{{ comment.created_time }}</time>
      <div class="text">
        {{ comment.text|linebreaks }}
      </div>
    </li>
  {% empty %}
    暂无评论
  {% endfor %}
</ul>
复制代码

要注意这里 {{ comment.text|linebreaks }} 中对评论内容使用的过滤器 linebreaks，浏览器会将换行以及连续的多个空格合并为一个空格。若是用户评论的内容中有换行，浏览器会将换行替换为空格，从而显示的用户评论内容就会挤成一堆。linebreaks 过滤器预先将换行符替换为 br HTML 标签，这样内容就能换行显示了。

而后将 detail.html 中此前占位用的评论模板替换为模板标签渲染的内容：

<h3>发表评论</h3>
{% show_comment_form post %}
<div class="comment-list-panel">
    {% show_comments post %}
</div>
复制代码

访问文章详情页，能够看到已经发表的评论列表了：

大功告成！

欢迎关注 HelloGitHub 公众号，获取更多开源项目的资料和内容

『讲解开源项目系列』 ——让对开源项目感兴趣的人再也不畏惧、让开源项目的发起者再也不孤单。跟着咱们的文章，你会发现编程的乐趣、使用和发现参与开源项目如此简单。欢迎留言联系咱们、加入咱们，让更多人爱上开源、贡献开源～