为hexo搭建isso评论系统

Isso评论系统

Isso是什么

Isso是类似于Disqus的轻量级评论服务器。它允许匿名评论，保持身份并且易于管理。它使用JavaScript和跨域资源共享来轻松集成到（静态）网站。

为什么我选择isso

在重新部署我的hexo博客时，发现next主题在8.1.0版本中移除了对我原来使用的评论系统Valine的支持，理由是安全性问题，因此需要更换另一个评论系统。在评论系统的选择中，我认为能够让读者方便留言是最重要的，因此需要科学上网的、需要注册账号的都被我排除在外，从而Isso成为了首要选择。

服务端部署isso系统

安装

Isso的安装有多种方法，包括从各Linux发行版的包管理器中安装、使用pip安装、自行克隆Isso仓库编译安装等，详情请见Isso 安装指南，个人建议使用pip。

Isso-cn的配置方法基本一致。

# Debian/Ubuntu
sudo apt install isso

# pip
pip install isso

Isso配置

在没有指定配置文件的情况下，Isso会读取/etc/isso.conf作为默认配置文件运行。

[general]
; 确保Isso进程对dbpath指向的db文件有读写权力
dbpath = /var/lib/isso/comments.db
; 需要添加Isso评论系统的网站地址（可以是ip也可以是网址）
host = https://tech.tu5039.cn/
; 本地监听地址，之后客户端的请求需要发送到这个地址
[server]
listen = http://0.0.0.0:1234/

以上配置可以满足运行Isso的最低要求，如果需要更多的功能可以查看官方文档

另外，每个配置文件对应一个网站的评论系统，也就是说，如果需要同时为多个网站提供服务的话，应当有多个使用不同配置文件的Isso进程，官网推荐使用gunicorn来进行管理，但我没有成功，如果有成功的大佬，欢迎指点。

服务器配置

在部署的时候，发现如果访问的是https网站，则非https的js请求会被屏蔽，因此我们需要为Isso添加一个安全证书。

具体步骤为：

1. 申请一个域名的安全证书，如isso.tu5039.cn
2. 使用nginx(或Apache)作为http服务器并将步骤1中的域名转发到Isso的监听端口，本文使用nginx，证书部署以及nginx反向代理不再展开

客户端配置

如果只需普通使用，在next配置文件里启用Isso评论系统即可

comments:
  active: isso
# ......
isso: https://tech.tu5039.cn//isso/ # Your isso server domain

修改hexo next主题

但有时客户端也需要更多的配置，因此找到与生成Isso评论区相关的文件再进行修改即可。

首先说明next主题中布局模板文件是njk文件，查找Isso对应的njk，可以得知需要修改的js文件next/source/js/third-party/comments/isso.js

{# isso.njk #}
{{ next_data('isso', theme.isso) }}
{{ next_js('third-party/comments/isso.js') }}

// isso.js
/* global NexT, CONFIG */

document.addEventListener('page:loaded', () => {
  if (!CONFIG.page.comments) return;

  NexT.utils.loadComments('#isso-thread')
    .then(() => NexT.utils.getScript(`${CONFIG.isso}js/embed.min.js`, {
      attributes: {
        dataset: {
          isso: `${CONFIG.isso}`,
        }
      },
      parentNode: document.querySelector('#isso-thread')
    }));
});

可以很快看出next配置文件中的isso属性对应的就是js文件里的 ${CONFIG.isso} ，因此如果想加入其他的Isso客户端配置项，只需要同时修改next配置文件和isso.js两个文件即可。示例如下：

# _config.next.yml
isso: 
  url: https://tech.tu5039.cn//isso/ # Your isso server domain
  lang: zh # Set language
  # Set to true when spam guard is configured with reply-to-self = true.
  reply_to_self: "false" 
  # Set to true when spam guard is configured with require-author = true.
  require_author: "false" 
  # Set to true when spam guard is configured with require-email = true.
  require_email: "false" 
  # Set to true when reply notifications is configured with reply-notifications = true.
  reply_notifications: "false" 
  # Number of top level (or nested) comments to show by default. If some comments are not shown, an “X Hidden” link is shown.
  # Set to “inf” to show all, or “0” to hide all.
  max_comments_top: "10"
  max_comments_nested: "5"
  # Number of comments to reveal on clicking the “X Hidden” link.
  reveal_on_click: "5"
  # Enable or disable avatar generation.
  avatar: "true"
  # Set avatar background color. Any valid CSS color will do.
  avatar_bg: "#f0f0f0"
  # Set avatar foreground color. Up to 8 colors are possible. 
  # The default color scheme is based in this color palette. 
  # Multiple colors must be separated by space. 
  # If you use less than eight colors and not a multiple of 2, the color distribution is not even.
  avatar_fg: "#9abf88 #5698c4 #e279a3 #9163b6 ..."
  # Enable or disable voting feature on the client side.
  vote: "true"
  # List of vote levels used to customize comment appearance based on score. 
  # Provide a comma-separated values (eg. “0,5,10,25,100”) or a JSON array (eg. “[-5,5,15]”).
  vote_levels: ""
  # Enable or disable the addition of a link to the feed for the comment thread. 
  # The link will only be valid if the appropriate setting, in [rss] section, is also enabled server-side.
  feed: "false"

// isso.js
/* global NexT, CONFIG */

document.addEventListener('page:loaded', () => {
  if (!CONFIG.page.comments) return;

  NexT.utils.loadComments('#isso-thread')
    .then(() => NexT.utils.getScript(`${CONFIG.isso.url}js/embed.min.js`, {
      attributes: {
        dataset: {
          isso: `${CONFIG.isso.url}`,
          issoLang: `${CONFIG.isso.lang }`,
          issoReplyToSelf: `${CONFIG.isso.reply_to_self }`,
          issoRequireAuthor: `${CONFIG.isso.require_author }`,
          issoRequireEmail: `${CONFIG.isso.require_email }`,
          issoReplyNotifications: `${CONFIG.isso.reply_notifications}`,
          issoMaxCommentsTop: `${CONFIG.isso.max_comments_top }`,
          issoMaxCommentsNested: `${CONFIG.isso.max_comments_nested }`,
          issoRevealOnClick: `${CONFIG.isso.reveal_on_click }`,
          issoAvatar: `${CONFIG.isso.avatar }`,
          issoAvatarBg: `${CONFIG.isso.avatar_bg }`,
          issoAvatarFg: `${CONFIG.isso.avatar_fg }`,
          issoVote: `${CONFIG.isso.vote }`,
          issoVoteLevels: `${CONFIG.isso.vote_levels }`,
          issoFeed: `${CONFIG.isso.feed }`
        }
      },
      parentNode: document.querySelector('#isso-thread')
    }));
});

本文首发于为hexo搭建isso评论系统