前言

​ 本教程基于以下平台及版本，如果你的版本与我的相差较大，请自行适配。

  • 博客框架：Hexo，版本：8.1.1
  • 主题：Butterfly，版本：5.5.3
  • 评论系统：Twikoo

什么是评论

​ 顾名思义，评论就是能写评论的平台、体系、组件等。

​ 有了评论，看到你文章有沟通和交流欲望的人就可以在你的文章下面写出想说的话。

评论系统还需要部署？

​ 如果你用的博客框架是类似 Wordpress、Typecho 等带有后台的框架，评论系统会和博客系统一同被部署在服务器上，毕竟都用到后台数据库了（MySQL等）单独建一张表写点数据就是顺手的事。

​ 但是对于像 Hexo 这种本身就是生成静态页面的博客框架来说，默认情况下本身就不会去写数据库，所以你可以理解成默认情况下，它不会去写任何文件或系统。

​ 所以，如果你也使用 Hexo、VUE 等博客框架，想要实现评论系统就需要自己去部署。

评论系统的选型

​ Hexo 理论上支持所有评论系统，因为我们部署评论系统的本质只是在 Hexo 生成的 HTML 中插入一段代码而已。

​ 本文选用的评论平台为 Twikoo，理由如下：

  • 与 Github 无关，由于众所周知的原因，大陆访问 Github 的速度很慢
  • 支持私有化部署——你的评论数据会保存在你自己指定的位置
  • 评论界面美观
  • 支持后台管理
  • 可以配合垃圾评论系统识别垃圾评论

如何进行部署

​ 在 Hexo 部署评论系统基本上都会分为两部分：后端的部署和前端的部署。

​ 后端的部署，顾名思义就是用户看不见的部分，这部分主要是提供已有评论的数据存储和数据与文章页面的逻辑耦合。

​ 前端的部署，也就是说用户能看到的部分的部署，也就是当我们看到其他的博客有留言框那部分，就属于前端部署。

后端部署

​ 评论系统的后端部署有很多种方法，我们可以选择最适合自己的一个。

​ 后端部署有以下几种选择：后端部署的选择

​ 我个人比较推荐私有化这部分，因为私有化意味着你的评论数据永远都是在你自己手里的，你可以随时进行备份、恢复、迁移等操作。如果是使用其他方式部署，你的数据都是会存在平台提供方的服务器上的。虽然这并不意味着就不安全，但是对于我来说，我还是很在意数据的所有权和归属权的（我很不喜欢自己的数据在我自己不受控的平台上，这也就是为什么我会自建 NAS 而不是使用网盘会员）

​ 同时，大家可以考虑使用宝塔面板进行部署，免去自己手动搭建基础环境（Nginx）

​ 但如果你对数据控制权并没有我这么“极端”的话，同时你并没有丰富的后端部署经验，那我推荐你使用腾讯云一键部署：腾讯云一键部署

前端部署

​ 前端部署相对比较复杂，原因就是需要看你使用的 Hexo 主题是什么，因为前端部署的本质就是在你的 HTML 代码中插入评论代码，在读取和写入评论的时候调用刚刚我们部署好的后端。

​ 这里，我使用 butterfly 这个主题为例子部署Twikoo 前端。

​ 我们可以打开主题的配置文件，通常这个文件在你的 Hexo 目录\themes\butterfly\_config.yml，打开这个文件，找到下面位置：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
comments:
  # Up to two comments system, the first will be shown as default
  # Leave it empty if you don't need comments
  # Choose: Disqus/Disqusjs/Livere/Gitalk/Valine/Waline/Utterances/Facebook Comments/Twikoo/Giscus/Remark42/Artalk
  # Format of two comments system : Disqus,Waline
  use:
    - Twikoo
                       # 是否显示文章阅读数
  # Display the comment name next to the button
  text: true
  # Lazyload: The comment system will be load when comment element enters the browser's viewport.
  # If you set it to true, the comment count will be invalid
  lazyload: true
  # Display comment count in post's top_img
  count: false
  # Display comment count in Home Page
  card_post_count: false

在这个位置按照上面的设置设定配置文件。

之后再找到这里

1
2
3
4
5
6
7
8
# Twikoo
# https://github.com/imaegoo/twikoo
twikoo:
  envId: 【你的 twikoo 后端的地址】
  region:
  # Use Twikoo visitor count as the page view count
  visitor: true
  option:

按照上面的代码配置文件。

需要注意的是，这里面实际上是有一个细节需要注意的，我本人也卡在这很久。如果你的Hexo是用HTTPS协议访问的，也就是说你配置了Hexo的SSL证书，那么你的Twikoo也需要使用HTTPS协议访问，这是由于如果你的Twikoo是HTTP协议，那么就相当于在你的Hexo会把HTTPS的流量转发到HTTP协议中，这是不被允许的，所以也就会提交评论失败。

如果以上配置都没有问题，那么你就可以享受Twikoo带给你的功能了。

如果你在配置过程中有任何的问题和疑问，可以在下面留言，看到后我会尽力帮你解决。