如何在 django 网站中使用 ajax 添加评论？

Question

如何在不刷新页面的情况下在我的 Django 网站中添加 cmets？

这是我的代码：

VIEW.PY

@login_required
def comments(request, post_id):
    """Comment on post."""
    post = get_object_or_404(Post, id=post_id)
    user = request.user
    comments = Comment.objects.filter(post=post).order_by('-date')#comment
    if request.method == 'POST':#Comments Form
        form = CommentForm(request.POST)
        if form.is_valid():
            comment = form.save(commit=False)
            comment.post = post
            comment.user = user
            comment.save()
            messages.success(request, 'Comment has been added successfully.')
            return HttpResponseRedirect(reverse('core:comments',args=[post_id]))
    else:
        form = CommentForm()
    template = loader.get_template('post/comments.html')
    context = {'post':post,'form':form,'comments':comments,}
    return HttpResponse(template.render(context, request))

COMMENTS.HTMl

表单部分：

 <div class='commentsection' >

<strong>
<form  action="{% url 'core:comments' post.id %}"  method='post' id=comment-form >
{% csrf_token %}
 {% bootstrap_form form %}

 </form>
 <br/>
 <br/>
 </strong>
</div>

评论部分：

{% for comment in comments %}

 <div class="card mb-3" style="width: 30rem;">
   <div class="row no-gutters">
         <small> <a style="color: black;"  href="{% url 'core:user_profile' comment.user %}"><img src="{{comment.user.profile.profile_pic.url}}" width=50 height=50 class="profile-image img-circle " style="object-fit: cover; float: auto; "><strong style="font-size: 18px;" >   @{{comment.user}} </strong></a> </small> <small><span class="glyphicon glyphicon-time"></span> {{ comment.get_date }}</small>
     </div>
       <div class="card-body"  style="width:100%; padding-left:20%; margin-top:-8%; word-break: break-all; color:black; " >
         <h5 class="card-text">

         {{ comment.comment }}</h5>
         <small ><a href="{% url 'core:replies' comment.id %}"> Replies </a> [{{comment.total_replies}}] </small

       </div>
     </div>
 </div>
<br/><br/>
 {% empty %}
<center>
 No commnets
 </center>

 {% endfor %}

我的问题：

1. 在不刷新页面的情况下添加 cmets。
2. 在评论部分自动添加新添加的 cmets，无需刷新页面。

提前致谢！

Answer 1

您已经正确地推测这是一个 AJAX 问题，尽管您现在也可以使用 websocket。传统的 django 解决方案将带有 AJAX 回调。短文为您编写，我可以提供一个形式上的解决方案（大纲）：

1. 向您的站点添加一个视图，该视图以 JSON（或 XML 或任何其他可序列化格式）返回给定日期时间的新 cmets 列表（您可以将其作为 GET 参数或 POST 参数传递给视图，如果您愿意） .
2. 向您的页面添加 Javascript，该页面会定期使用新的评论请求轮询服务器。如果它得到任何返回，那么它必须为您动态地将这些 cmets 添加到 DOM。

您的第二个请求（自动添加新 cmets）取决于您是否要使用 websocket。如果您使用 websocket，那么是的，当新的 cmets 到达时，服务器可以通过该套接字通知您的页面。但是如果你想坚持使用 AJAX，那么它取决于轮询间隔（这是开发 websocket 并且很有用的一个重要原因）。

关于编写 Javascript 以获取数据和动态更新 DOM 的在线教程和操作方法层出不穷，就像如何使用 websockets 一样。