Django 博客评论系统替代多说 (二)

瞳人


发布于 Oct. 7, 2015, 5:56 p.m.

102 个评论

Django 多说


在 "Django 博客评论系统替代多说 (一)" 中, 我们只是简易地使用了 threadedcomments, 但是这不够美观, 还有一些功能缺失. 本文将基于 threadedcomments, 结合使用 crispy 来扩展成自己的一个 mycomemnts 来使得评论系统更加完整.

依赖的 Django application

  1. django-crispy-forms 可以让我们创建可重复使用的 Django 表单, 并对其进行渲染.

开始动手

安装依赖项目.

1
pip install django-crispy-forms

修改 Project 的 settings.py 文件, 修改上次的相关代码成为如下:

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
INSTALLED_APPS = (
    ...
    'crispy_forms',
    'mycomments',
    'threadedcomments',
    'django_comments',
    'django.contrib.sites',
)
# 设置自定义的评论应用
COMMENTS_APP = 'mycomments'
# 设置站点编号, 根据自己需求编号
SITE_ID = 1
# 设置 Crispy 的样式主题
CRISPY_TEMPLATE_PACK = 'bootstrap3'

在 Project 目录 (与 django app 同一层目录) 下面创建我们的 mycomments 应用目录.

1
mkdir mycomments

根据 django_comments自定义文档, 我们需要修改 mycomments/__init__.py 让 Django 知道我们修改的 自定义评论框和模型是什么. 这里我们只是修改 Form一些外观来使用 crispy 进行渲染, 并使用 threadedcomments 的评论 model.

注意此处更新了!! django_comments自定义文档 中指出,最近的 Django >= 1.9 不能在 __init__.py 顶层直接 import 模型。

mycomments/__init__.py 内容:

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
"""
Change the attributes you want to customize
"""
# following PEP 440
__version__ = "1.0"


def get_model():
    from threadedcomments.models import ThreadedComment
    return ThreadedComment


def get_form():
    from mycomments.forms import MyCommentForm
    return MyCommentForm

mycomments/forms.py 内容:

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
#!/usr/bin/env python
# coding=utf-8

from crispy_forms.helper import FormHelper
from threadedcomments.forms import ThreadedCommentForm as base_class

class MyCommentForm(base_class):
    """My Customized Comment Form.

    Just add some features via crispy.
    """

    #: Helper for {% crispy %} template tag
    helper = FormHelper()
    helper.form_tag = False

然后, 我们来自定义 comments 的模板. 先创建模板文件夹.

1
mkdir -p mycomments/templates/comments/

首先, 我们先定义评论框的模板 form.html. 其中用到了 crispy 这个 tag.

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
{% load comments i18n crispy_forms_tags %}
<!-- Comments Form -->
<div id="wrap-form-comment">
    <div class="well" id="form-comment">
        <h4>Leave a Comment:</h4>
        <form role="form" action="{% comment_form_target %}" method="post">{% csrf_token %}
        {% if next %}
            <div><input type="hidden" name="next" value="{{ next }}"/></div>
        {% endif %}
            {% crispy form %}
            <button type="submit" class="btn btn-primary">Submit</button>
            <button id="cancel_reply" type="button" class="btn btn-default">Cancel Reply</button>
        </form>
    </div>
</div>

然后我们修改评论列表显示的模板 list.html. 是的回复评论的评论能够嵌套显示.

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
    {% load threadedcomments_tags %}

<div class="comments_length">
    <p>{{ comment_list|length }} Comments</p>
</div>

<div class="comments">
    {% for comment in comment_list|fill_tree|annotate_tree %}
    {% if comment.parent_id and not comment.open %}
        <!-- return to outer(non-root) level  -->
        </div>
        </div>
        <!-- end return to outer(non-root) level  -->
    {% endif %}
    <div class="media">
        <a class="pull-left" href="#">
            <img class="media-object" src="http://placehold.it/64x64" alt="">
        </a>
        <div class="media-body" id="c{{ comment.id }}">{# c## is used by the absolute URL of the Comment model, so keep that as it is. #}
            <h4 class="media-heading">{{ comment.user_name }}
                <small>
                    {{ comment.submit_date }}
                    | <a href="#c{{ comment.id }}" data-comment-id="{{ comment.id }}" class="comment_reply_link">Reply</a>
                </small>
            </h4>
                {{ comment.comment|linebreaks }}
            {% for close in comment.close %}
            <!-- start close  -->
            {# 从深层返回上层嵌套评论结束 #}
                </div></div>
            <!-- end close  -->
            {% endfor %}

    {% endfor %}
</div>

虽然在 list.html 中增加了 reply 按钮, 但是我们还要通过 js 来响应点击事件来完成回复功能. 并且由于 django_comments 为了简单地防止垃圾评论的功能, 添加了一个空白输入 (因为很多 垃圾机器人会尝试填满表单的所有输入), 所以我们用 css 来对用户隐藏这个输入.

mycomments 添加一些 css 和 js, 创建目录.

1
mkdir -p mycomments/static/mycomments/{css,js}

mycomments.css 文件:

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
#div_id_honeypot {
    /* Hide the honeypot from django_comments by default */
    display: none;
}

#cancel_reply {
    display: none;
}

.media #cancel_reply {
    display: inline;
}

mycomments.js 文件:

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
jQuery(function($) {
    function show_reply_form(event) {
        var $this = $(this);
        var comment_id = $this.data('comment-id');

        $('#id_parent').val(comment_id);
        $('#form-comment').appendTo($this.closest('.media-body'));
    };

    function cancel_reply_form(event) {
        $('#id_comment').val('');
        $('#id_parent').val('');
        $('#form-comment').appendTo($('#wrap-form-comment'));
    }

    $.fn.ready(function() {
        $('.comment_reply_link').click(show_reply_form);
        $('#cancel_reply').click(cancel_reply_form);
    })
});

function setAuthenticatedUser() {
    $('#div_id_name').hide();
    $('#div_id_email').hide();
    $('#div_id_url').hide();
}

然后在你需要使用评论的页面模板中引入 mycomments.cssmycomments.js:

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
<link rel="stylesheet" href="{% static 'mycomments/css/mycomments.css' %}">

<!-- 在 jquery.js 之后引入 -->
<script src="{% static 'mycomments/js/mycomments.js' %}"></script>
{% if user.is_authenticated %}
<script>
    jQuery(function($) {
        setAuthenticatedUser();
    });
</script>
{% endif %}

当然啦, 你也可以为每个评论用户创建一个头像, 然后修改一下 list.html 模板就行了. 最终显示结果如下:

my comment system

点击 reply 之后显示效果如图:

my comment reply ui

下一篇文章会讲一下, 如何对于新的回复启用邮件通知.


哎呦, 不错哦!

102 Comments

fangc Oct. 22, 2015, 3:13 p.m. | Reply

当提交的内容出现错误时,会重定向到/articles/comments/post/,我看了你的博客尝试了一下也重点向到了comments/post/,只是修改了一下模版。有没有什么办法能在输入错误的情况下,仍然跳转回本页,如(http://njuaplusplus.com/post/comment-in-django-part-2/),或者直接在本页显示错误。

瞳人 Oct. 22, 2015, 4:14 p.m. | Reply

有方法的. 我之前太忙了. 所以我的博客采取了这种偷懒的方法. 想等着之后慢慢完善的.
方法一就是修改 comments 的这个方法, 这里面有评论出错之后的处理, 你只要写成你想跳转到哪儿就行了.
https://github.com/django/django-contrib-comments/blob/master/django_comments/views/comments.py#L39
但是这样子全页面跳转也不算很友好.
所以方法二就是用 ajax. 我之后也是打算这么处理的.
你可以参考别人实现的这个项目,
https://github.com/edoburu/django-fluent-comments
这个项目做的不错, 可以和 threadedcomments 一起配合使用的.
我一开始不用这个 fluent-comments 是因为这个里面一下子加入了太多的功能不太可控.
所以我后续也会有博客来说如何采用 ajax 的评论.

fangc Oct. 22, 2015, 4:56 p.m. | Reply

我也尝试了修改django-comments这个方法,但是暂时没法跳转到我的项目的页面。后来把评论模块copy到我项目的目录里就可以了,但是就是你说的全页面跳转。ajax不是很懂,打算先这样做了。谢谢了!

瞳人 Oct. 22, 2015, 5:26 p.m. | Reply

恩恩, 不用谢.刚刚我博客访问有点问题. 因为我发现一个bug, 没有能够发邮件递归通知被评论的评论者. 所以调试然后修复了一下.
方便留一下你博客的地址吗, 互相学习一下.

fangc Oct. 22, 2015, 5:29 p.m. | Reply

我还在自己搭建中,基本功能都完成了。打算让前端朋友美化一下之后再放在网上来。嘿嘿。

瞳人 Oct. 22, 2015, 6:51 p.m. | Reply

哈哈. 确实前端弄好看一点会好很多. 我这个就网上找了个 bootstrap 的主题自己改了一点点. 我对前端也不是很懂. 多多交流啦.

小测 Jan. 2, 2017, 1:11 a.m. | Reply

这个评论系统不用登陆就可以的啊

瞳人 July 5, 2016, 11:43 a.m. | Reply

我博客已经添加了 ajax 评论功能,参考的 django-fluent-comments 项目。我博客代码在Github上,你可以看看。

ss March 30, 2016, 10:35 p.m. | Reply

I do agree with all the ideas you have offered for your post.
They are really convincing and can certainly work.
Nonetheless, the posts are too quick for novices. Could you please prolong them a
little from subsequent time? Thank you for the post.

Dec. 28, 2017, 3:25 p.m. | Reply

6666一月又一月晕晕晕晕晕晕不v

lyh April 4, 2016, 11:18 p.m. | Reply

我按你说的创建了mycomments文件夹,也按你说的在settings.py里面设置了,__init__.py也弄了,结果运行时出现这个错误
django.core.exceptions.AppRegistryNotReady: Apps aren't loaded yet.

lcj May 6, 2016, 8:18 p.m. | Reply

我也遇到你这个问题,请问如何解决

eddie June 23, 2016, 11:19 p.m. | Reply

我也是的,同求

瞳人 June 26, 2016, 6:50 p.m. | Reply

非常抱歉,最近在忙其他事情,所以没有看到留言。
请问你们是什么版本的 Django?

瞳人 June 30, 2016, 7:53 p.m. | Reply

你好,请更新__init__.py 为本文中的新版本即可。原因在文中代码出指出了。

brzzez June 23, 2016, 1:02 p.m. | Reply

多谢大神!!评论一下看看。

eddie June 30, 2016, 8:03 p.m. | Reply

多谢博主~今天回寝室了就试试看

eddie June 30, 2016, 9:29 p.m. | Reply

又出问题了,错误是:
Error during template rendering

In template C:\Users\Derong Qiu\Desktop\yangyangstudio\13\mycomments\template\form.html, error at line 1
'crispy_forms_tags' is not a registered tag library. Must be one of: admin_list admin_modify admin_static admin_urls cache comments future i18n l10n log static staticfiles threadedcomments_tags tz

django-crispy-forms这个包已经pip install过了。

还有一个小问题,博客里面:
RISPY_TEMPLATE_PACK = 'bootstrap3'
应该是下面这个,少了一个字母C:
CRISPY_TEMPLATE_PACK = 'bootstrap3'

瞳人 June 30, 2016, 9:39 p.m. | Reply

谢谢提醒,这是博客上删空格导致的笔误。
你要在 INSTALLED_APPS 里加上 'crispy_forms'

lh May 29, 2017, 11:17 p.m. | Reply

2112

123123 Sept. 29, 2017, 11:38 a.m. | Reply

36262626

eddie June 30, 2016, 10:09 p.m. | Reply

恕小的愚钝。。。还是报错:
Request Method: GET
Request URL: http://yangystudio.applinzi.com/home/detail/?photo_name.x=155&photo_name.y=593&photo_name=%E4%B8%80%E7%82%89%E9%9B%AA
Django Version: 1.7.5
Exception Type: VariableDoesNotExist
Exception Value:
Failed lookup for key [form] in u"[{'False': False, 'None': None, 'True': True}, {u'csrf_token': <django.utils.functional.__proxy__ object at 0x7fd3b2cee990>, 'perms': <django.contrib.auth.context_processors.PermWrapper object .......(后面不写了)

另外一处是:
Error during template rendering

In template /data1/www/htdocs/902/yangystudio/13/mycomments/template/form.html, error at line 10
(Could not get exception message)
1 {% load comments i18n crispy_forms_tags %}
2 <!-- Comments Form -->
3 <div id="wrap-form-comment">
4 <div class="well" id="form-comment">
5 <h4>Leave a Comment:</h4>
6 <form role="form" action="{% comment_form_target %}" method="post">{% csrf_token %}
7 {% if next %}
8 <div><input type="hidden" name="next" value="{{ next }}"/></div>
9 {% endif %}
10 {% crispy form %}
11 <button type="submit" class="btn btn-primary">Submit</button>
12 <button id="cancel_reply" type="button" class="btn btn-default">Cancel Reply</button>
13 </form>
14 </div>
15 </div>

我想是不是我的url.py还需要加上crispy_forms相关的东西?

瞳人 June 30, 2016, 10:31 p.m. | Reply

额。。你这个django环境是1.7还是1.9啊。。crispy 本身没有url的……你按照我之前的文章一http://answ.me/post/comment-in-django-part-1/ 里面的操作成功显示出评论框了吗?

eddie June 30, 2016, 10:41 p.m. | Reply

嗯,之前的评论框是有的,我再仔细琢磨一下。
哦,我重装系统了,所以现在电脑上装的python和django都是最新版本,但是之前部署在SAE上面的都是老版本。。。我现在把新版本部署上去。最早的问题应该是我在本地调试运行时出现的,因为是最新版本django。

eddie June 30, 2016, 11:56 p.m. | Reply

这个是本地运行出来的bug:
VariableDoesNotExist at /home/detail/
Failed lookup for key [form] in "[{'True': True, 'None': None, 'False': False}, {}, {}]"
Request Method: GET
Request URL: http://127.0.0.1:8000/home/detail/?photo_name.x=241&photo_name.y=87&photo_name=onon%E8%87%AA%E7%94%BB%E5%83%8F
Django Version: 1.9.7
Exception Type: VariableDoesNotExist
Exception Value:
Failed lookup for key [form] in "[{'True': True, 'None': None, 'False': False}, {}, {}]"
Exception Location: C:\Users\Derong Qiu\AppData\Local\Programs\Python\Python35-32\lib\site-packages\django\template\base.py in _resolve_lookup, line 905
Python Executable: C:\Users\Derong Qiu\AppData\Local\Programs\Python\Python35-32\python.exe
Python Version: 3.5.1
Python Path:
['C:\\Users\\Derong Qiu\\Desktop\\yangyangstudio\\13',
'C:\\Users\\Derong '
'Qiu\\AppData\\Local\\Programs\\Python\\Python35-32\\python35.zip',
'C:\\Users\\Derong Qiu\\AppData\\Local\\Programs\\Python\\Python35-32\\DLLs',
'C:\\Users\\Derong Qiu\\AppData\\Local\\Programs\\Python\\Python35-32\\lib',
'C:\\Users\\Derong Qiu\\AppData\\Local\\Programs\\Python\\Python35-32',
'C:\\Users\\Derong '
'Qiu\\AppData\\Local\\Programs\\Python\\Python35-32\\lib\\site-packages']
Server time: Thu, 30 Jun 2016 15:55:20 +0000

瞳人 July 1, 2016, 9:22 a.m. | Reply

看起来像是模板里找不到 form 这个变量……但是这个变量应该不需要手动设置的。你按照我上面说的上一篇博客(一),现在在本地能显示出评论框吗?先别按照(二)做。

eddie July 1, 2016, 5:54 p.m. | Reply

我把{% crispy form %}删掉,就不报错了。{% load threadedcomments_tags %}都是可以正常显示的。
crispy_forms不需要migrate吧?

瞳人 July 3, 2016, 5:37 p.m. | Reply

你删了这一句,就不生成表格了啊。。我觉得你得看一下Django的文档。。你现在的环境中按照博客一中能有评论框出现吗?

瞳人 July 4, 2016, 3:15 p.m. | Reply

我已经把这个网站的代码公布在 github 上了,你可以参考一下,看看你哪里写错了。地址为 https://github.com/njuaplusplus/njuaplusplus

eddie July 4, 2016, 3:34 p.m. | Reply

太感谢了~~

eddie July 4, 2016, 11:19 p.m. | Reply

看了半天没看出结果来T。T
第一个教程的我试了,可以正常显示。

就是用到{% crispy form %},报错:
Failed lookup for key [form] in "[{'False': False, 'None': None, 'True': True}, {}, {}]"
如果我改成{% crispy forms %},就报:
Failed lookup for key [forms] in "[{'False': False, 'None': None, 'True': True}, {}, {}]"

eddie July 4, 2016, 11:25 p.m. | Reply

我的模板目录:
TEMPLATE_DIRS = (
BASE_DIR + '/studio/template',
BASE_DIR + '/upload/template',
BASE_DIR + '/register/template',
BASE_DIR + '/mycomments/template',
)

mycomments的目录:
mycomments/
__init__.py
forms.py
template/
form.html
list.html

会不会是上面两个出的问题?

瞳人 July 4, 2016, 11:28 p.m. | Reply

要不然你搞个 github 项目,然后 push 上去,然后我帮你看看。注意别把密码什么放上去。你这个问题好奇怪,看起来像是模板里面没有找到 form 这个变量啊。你改成 forms 肯定就更加找不到这个变量了。

eddie July 5, 2016, 12:20 a.m. | Reply

https://github.com/Eddiechiu/yangyangstudio

谢谢啦,github好难。。。

瞳人 July 7, 2016, 11:04 a.m. | Reply

好的,我看一下。你这个配置环境具体是什么?我看像是 1.7 django?有没有装其他什么依赖库?

eddie July 7, 2016, 11:15 a.m. | Reply

嗯,是1.7。
应该没有其他依赖库。

瞳人 July 7, 2016, 11:23 a.m. | Reply

我找到你的问题了。。你这个代码根本就没有按照我文章Django 博客评论系统替代多说 (一) http://answ.me/post/comment-in-django-part-1/ 中的来。。你本来就不可能显示出正确的评论框。评论框是通过 threadedcomments 定义的 template tag 载入的,不是通过 include 载入的。你仔细看看我之前的博客。

end Oct. 21, 2016, 4:04 p.m. | Reply

谢谢博主

eddie July 7, 2016, 11:55 a.m. | Reply

是这样的,我只有在studio/detail.html里需要使用评论功能,在其中include了用以评论的form.html和list.html,而form.html和list.html中,是完全按照你的第二个教程写的(其中分别包括{% load comments i18n crispy_forms_tags %} 和 {% load threadedcomments_tags %})。第一个教程,只用了{% load threadedcomments_tags %},这个我试过了,是可以的显示的。
目前的问题是:找不到crispy_forms_tags中的{% crispy form %},我看了django-crispy-forms的文档,也没有找到解决方法。
嘿嘿,难道还有什么粗心遗漏的地方?

瞳人 July 7, 2016, 2:22 p.m. | Reply

这个第三个教程是接着第二个教程写的。这个第三个教程里面没有喊你删除 detail.html 里按照第二个教程加的东西。crispy-form 只是负责 form 的一些显示效果,但是你这个 form 是通过 {% render_comment_form for photo %} 添加出来的。你应该找的是 threadedcomments 的文档,而不是 crispy 的。你混淆了 include 这个tag 和 threadedcomments 中自定义 tag 的概念。你在这里不应该用 {% include 'form.html' %} 和 {% include 'list.html' %},而应该用 {% render_comment_list for photo %} 和 {% render_comment_form for photo %}

瞳人 July 7, 2016, 2:28 p.m. | Reply

官方comment项目用户手册:https://django-contrib-comments.readthedocs.io/en/latest/quickstart.html#quickly-rendering-the-comment-form
django-threadedcomments 说明手册:https://github.com/HonzaKral/django-threadedcomments#configuration

eddie July 7, 2016, 3:21 p.m. | Reply

我想我没有搞错include的用法,我这里include只是不想把form.html和list.html里面的代码复制黏贴过来。

{% load comments %}
{% render_comment_list for photo %}
{% render_comment_form for photo %}
上面三行我很早就知道了,但我觉得它的评论格式太丑,想自定义,所以才需要用crispy form。而问题就在于,crispy form显示不出来。

我查到,之所以找不到form,可能是我没添加下面这句话
{% get_comment_form for event as form %}
不过现在的问题是,它罗列出来的东西太多了,我要把不需要的输入框隐藏掉,这个问题应该不大。
谢谢啦

brant-ruan July 27, 2016, 6:26 p.m. | Reply

已经跟着您的上一篇教程做完了~在这篇中跟下来,有两个问题:
1. 我这里默认评论完后会跳转到一个页面:http://127.0.0.1:8000/comments/posted/?c=9
显示Thank you for your comment.
怎样可以让它停留在之前的日志页面(评论完即时显示而不是跳转)?

2. 您的代码中嵌套缩进的评论是在哪里实现的?我这里点击Reply评论后跟普通评论一样按顺序排列在评论的末尾了。

谢谢~

brant-ruan July 27, 2016, 11:49 p.m. | Reply

后来看到django_comments有redirect功能,就是您代码中的
<div><input type="hidden" name="next" value="{{ next }}"/></div>
但是我这里不能实现重定向到之前文章的页面,求教。

瞳人 July 28, 2016, 8:40 p.m. | Reply

不好意思,我在上课,没来得及回复你。
1. 留在之前页面:我是使用的 ajax,向后台提交的评论。我参考的是 https://github.com/django-fluent/django-fluent-comments 这个项目的代码,然后根据我的需求改了一下。
2. 嵌套的话,修改的是 list.html 的 template。你可以参考 threadedcomments 的,或者上面那个 django-fluent-comments 的,或者我博客的代码 https://github.com/njuaplusplus/njuaplusplus
3. 那个重定向的话,可以参考 threadedcomments 的 posted.html,里面设置了跳转。

Lily Nov. 4, 2016, 5:03 p.m. | Reply

测试

lee Dec. 13, 2016, 9:47 p.m. | Reply

为了点了Submit没有反映呀.网页一点相应也没有

瞳人 Dec. 13, 2016, 11:04 p.m. | Reply

额。。有反应的啊。。你不是提交了评论吗。。

lee Dec. 19, 2016, 6:21 p.m. | Reply

在我自己的博客里不能嵌套评论是咋回事呀.点了reply以后页面会往下跳一点,并没有出现评论框.评论最后几条会有评论框,那是用来评论全文的.也就是说点了reply是不能嵌套评论的,django环境是1.9

瞳人 Dec. 19, 2016, 7:44 p.m. | Reply

我的博客环境是 django 1.9 python 3。应该和版本没啥关系。你用的也是 threadedcomments 吗?如果是的话,不嵌套可能只是显示效果而已。你可以去django的admin后台看看你发布的评论的 parent 是不是正确的。如果是正确的话,那就是显示效果了,显示效果的话改个html模板就行了,我博客代码在github上,虽然我代码管理的比较乱。

lee Dec. 20, 2016, 4:04 p.m. | Reply

用的是threadedcomments,后台里每条评论的parent都是空的,自己手动添加parent就会有嵌套效果.实在是摸不着头脑.
{% extends "base.html" %}

{% block title %}
{{ article.title }}
{% endblock title %}

{% block content %}
{% load threadedcomments_tags %}
{% load staticfiles %}
<h1>文章标题: {{ article.title }}</h1>

<h2>Comments for {{ article.title }}:</h2>

<div id="main">
{{ article.content|safe }}
</div>

{% render_comment_list for article %}
{% render_comment_form for article %}
<link rel="stylesheet" href="{% static 'mycomments/css/mycomments.css' %}">
<!-- 在 jquery.js 之后引入 -->
<script src="{% static 'mycomments/js/mycomments.js' %}"></script>
{% if user.is_authenticated %}
<script>
jQuery(function($) {
setAuthenticatedUser();
});
</script>
{% endif %}

{% endblock content %}

我是这么放置评论系统代码的.会不会这个有问题

lee Dec. 20, 2016, 4:07 p.m. | Reply

我把评论的部分放到了阿里云上,大侠可以亲自去回复一下试试,以便了解哪里出了问题.地址是121.42.191.3:8888 (菜鸟弄着玩的)

瞳人 Dec. 20, 2016, 4:14 p.m. | Reply

我晚上看看代码,好久没弄这个评论框了。现在我这个评论框嵌套多了,超级丑。。我猜测,可能是你少了某段 js 代码。。没有设置 id_parent 的值,导致后端获取不到该值,无法正确设置 parent 的值。你可以看看我的代码,链接如下:https://github.com/njuaplusplus/njuaplusplus/blob/master/mycomments/static/mycomments/js/mycomments.js#L275

lee Dec. 20, 2016, 6:24 p.m. | Reply

对前端知识懂得非常有限,正准备用这个寒假看下前端的东西.会不会是我引入mycomments.css 和 mycomments.js的时候有问题,我是把代码直接插到
<h2>Comments for {{ object.title }}:</h2>
{% render_comment_list for object %}
{% render_comment_form for object %}
下面

瞳人 Dec. 20, 2016, 8:12 p.m. | Reply

和顺序应该没关系的,我打开你的页面在资源里面,看不到 mycomments.js 这个文件的内容。你看看你服务器上有没有这个文件。或者你把你项目放 github 上,我帮你看看。

lee Dec. 21, 2016, 1:26 p.m. | Reply

好的,我去搞一下

lee Dec. 21, 2016, 2:43 p.m. | Reply

https://github.com/nanerleee/minicms 这是网址大哥.麻烦了.就是随便做的小东西可以随便改

瞳人 Dec. 22, 2016, 9:03 p.m. | Reply

不好意思,我最近有点忙,可能要到元旦才能具体看代码了。我扫了一眼,发现你js代码里面确实设置了 parent 的值的。你先自己debug一下,我过两天再看。

lee Dec. 22, 2016, 11:49 p.m. | Reply

好的,我先去看下前端的东西,js这些我都完全不懂呢,实在麻烦博主了

瞳人 Dec. 29, 2016, 3:55 p.m. | Reply

我看了一下你给的阿里云地址,上面似乎没有mycomments.js 这个文件?浏览器终端显示 404。你在本地跑的时候也出错吗?我看了你最新的github上的的代码,感觉引入评论框的template写的不太对啊。

lee Dec. 29, 2016, 10:35 p.m. | Reply

能不能说下具体问题在哪呀,或者怎么修改呢?我访问的话不会出错,引入评论框的那段删掉 js那条一点影响都没有,css文件和js文件在同级文件夹下,css文件却生效了.我也不知道咋回事.引入评论框的的template都是按照文章改的,前端的知识知道的太少了

lee Dec. 29, 2016, 10:53 p.m. | Reply

没有mycomments.js文件的问题已经解决了,放到阿里云的时候忘了写,现在访问的话已经有js文件了,但还是不能嵌套评论.js文件压根不响应.问题好棘手.

瞳人 Dec. 29, 2016, 10:58 p.m. | Reply

我看了一下你的阿里云,因为你没有引入 jquery js 文件。。这些对评论框的渲染没啥影响,但是 js 代码里面会对回复的 id_parent 这个 input 赋值的。

lee Dec. 29, 2016, 11:10 p.m. | Reply

现在访问121.42.191.3:8888/static/mycomments/js/mycomments.js 会有js文件.是不是代表已经引入了js文件了呢?大哥能不能试下把代码弄到本地运行还是怎么样,看下从那解决比较好呢,对js真是一窍不通,css还没看完(尴尬脸)

瞳人 Dec. 30, 2016, 10:27 a.m. | Reply

你可能不清楚当中的过程。。
评论框是由下面两个 django 的 template tag 引入的。
{% render_comment_list for article %}
{% render_comment_form for article %}
css样式是由下面这一句引入的。
<link rel="stylesheet" href="{% static 'mycomments/css/mycomments.css' %}">

js代码引入是靠这一句。
<!-- 在 jquery.js 之后引入 -->
<script src="{% static 'mycomments/js/mycomments.js' %}"></script>
但是你没看见我写的注释。。需要 jquery.js。。
你在你 head 区加入下一句就可以了。。
<script src="//cdn.staticfile.org/jquery/1.12.4/jquery.min.js"></script>

lee Dec. 30, 2016, 12:50 p.m. | Reply

太感谢了.都解觉了.等我看到js应该就能理解中间的知识了.好吃力..网站收藏啦.博主人太好了

瞳人 Dec. 30, 2016, 5:52 p.m. | Reply

不用谢,很开心可以帮到你。这个和 js 关系其实不是很大。。我也不太懂js。。其实你可以用 chrome 或者 safari 之类的浏览器,你可以看一下开发者终端里面的错误信息,比较有用。

<script>alert(1)</script> July 18, 2017, 4:38 p.m. | Reply

这也太挤了点儿吧...

yuaner May 27, 2017, 4:45 p.m. | Reply

excuse me, 我也遇到了点击submit没有反应的情况,请问你是怎么解决的啊

武云 Aug. 8, 2017, 5:39 p.m. | Reply

您好,麻烦问下为什么我全都弄好了,唯独提交评论的时候提交按钮点击没有任何反应。。。。
也没有报错。。。郁闷死了

瞳人 Aug. 19, 2017, 4:50 a.m. | Reply

不好意思,最近太忙了,没有及时回复。你可能没有添加js文件吧。这个异步提交是由js实现的。

123123 Sept. 28, 2017, 4:45 p.m. | Reply

测试一把 你的reply的。。。。

glad Dec. 16, 2016, 4:27 p.m. | Reply

测试试试看

glad Dec. 16, 2016, 6:33 p.m. | Reply

werwrewerwr

glad Dec. 16, 2016, 6:33 p.m. | Reply

测试~

小测 Jan. 2, 2017, 1:09 a.m. | Reply

不用登陆就可以评论吗,

小测 Jan. 2, 2017, 1:09 a.m. | Reply

谢谢博主的分享

anq Feb. 17, 2017, 6:10 p.m. | Reply

有些细节要继续完善一下就很不错了,另外UI要加强

anq Feb. 17, 2017, 6:11 p.m. | Reply

不错,另外JS的规则写法上要改进,要更加符合现在的潮流 www.mastudio.org

123 March 25, 2017, 5:10 p.m. | Reply

123

1234 March 31, 2017, 3:33 p.m. | Reply

1234

test April 7, 2017, 3:01 p.m. | Reply

123412341234123412341234asdfasdf

yuaner May 19, 2017, 3:22 p.m. | Reply

请问你这个是如何嵌入到博客文章下去用的啊 谢谢了

瞳人 June 22, 2017, 10:42 a.m. | Reply

哈哈,我代码写得比较混乱。。我是在自己的 django 博客中使用的。暂时不能嵌入别人的博客使用。您具体的使用场景是怎样的?

测试 June 7, 2017, 8:58 p.m. | Reply

测试一下

评论学习 June 7, 2017, 8:59 p.m. | Reply

您好,我想问一下,django-fluent-comments没有回复功能吗?

瞳人 June 22, 2017, 10:34 a.m. | Reply

有回复功能的

<script>alert(1)</script> July 18, 2017, 2:25 p.m. | Reply

<script>alert(1)</script>

ajax弄了不成功 Aug. 21, 2017, 6:18 p.m. | Reply

博主什么时候有空更新一个ajax提交评论 还有预览功能 源码看了之后弄了不对 ajax没反应 谢谢

<script>alert(1)</script> June 11, 2017, 5:35 p.m. | Reply

<script>alert(1)</script>

zander July 28, 2017, 10:15 p.m. | Reply

谢谢。学习了。等下就去用到自己的Blog上

121 Aug. 19, 2017, 4:35 p.m. | Reply

232

121 Aug. 19, 2017, 4:36 p.m. | Reply

2323

121 Aug. 20, 2017, 7:53 p.m. | Reply

觉得iad

123123 Aug. 26, 2017, 12:37 a.m. | Reply

213

123123 Aug. 26, 2017, 12:38 a.m. | Reply

1231111111

123123 Sept. 28, 2017, 1:40 p.m. | Reply

jfoejofeofejfoefefefefefefefe

倒萨 May 7, 2018, 10:20 a.m. | Reply

23213

倒萨 May 7, 2018, 10:20 a.m. | Reply

da ewq

倒萨 May 7, 2018, 10:20 a.m. | Reply

ewq

fanming May 7, 2018, 12:55 p.m. | Reply

楼主缺少一个回顶部的功能,不想用手拉,还是留个脚印吧

倒萨 May 8, 2018, 3:30 p.m. | Reply

321321


Leave a Comment:

博客搜索

友情链接

公告

本博客代码已经公布在 Github 上,欢迎交流指正。

QQ 邮箱对 mailgun 不太友好, 所以使用 QQ 邮箱的评论, 可能会无法及时收到邮件。我会尽快寻找其他解决方案的。

本人现在独自使用 linode vps, 20 美元/月, 感觉压力大, 如果有意一起合租, 可以联系我. 在我的任意一篇文章下面留言即可. 关于使用方式, 现在倾向于使用 docker.