过去尝试了个诸多评论系统,各有各的优缺点:Disqus 广为流行但网络受限;来必力速度太慢,不合心意;Valine 前端惊艳,后台糟心;Utterances 简单易用,但受限于 GitHub 用户。偶然间发现了 Remark42 评论引擎,它具有自托管、易部署和迁移的特点。本文介绍在 Ubuntu 18.04 LTS 服务器通过 docker 搭建 Remark42 评论引擎,在 Apache 设置反向代理绑定域名作为后台,最后为 Hugo 进行必要的前端配置。
安装 docker,详情见官方文档。Ubuntun 服务器的安装设置如下:
1 2 3 4 5 6 7 8 9 10 11
sudo su # 管理员模式 apt update apt install ca-certificates curl gnupg lsb-release # 添加官方 GPG 密钥 mkdir -p /etc/apt/keyrings curl -fsSL https://download.docker.com/linux/ubuntu/gpg | sudo gpg --dearmor -o /etc/apt/keyrings/docker.gpg # 建立仓库 echo "deb [arch=$(dpkg --print-architecture) signed-by=/etc/apt/keyrings/docker.gpg] https://download.docker.com/linux/ubuntu $(lsb_release -cs) stable" | sudo tee /etc/apt/sources.list.d/docker.list > /dev/null # 安装 docker engine apt update apt install docker-ce docker-ce-cli containerd.io docker-compose-plugin
安装 docker-compose
1
apt install docker-compose
启动 docker 并设置
1 2
systemctl statr docker systemctl enable docker
将域名
domian.com
解析到服务器后,安装 apache2。1 2 3 4 5 6 7 8
# 安装 apache2 apt install -y apache2 # 启用 ssl 和反向代理模块 a2enmod rewrite headers env dir mime ssl proxy proxy_balancer proxy_http # 重启 Apache 服务 systemctl restart apache2 # 创建文件名为 remark 的配置文件 vim /etc/apache2/sites-available/remark.conf
按
i
进入编辑模式,并输入1 2 3
<VirtualHost *:80> ServerName domain.com </VirtualHost>
按
Esc
退出编辑,输入:wq
回车保存、退出。1 2
a2ensite remark.conf systemctl reload apache2
安装 Letscrypt 生成 SSL 证书并设置反向代理。最佳方式参考官方文档。但官方是通过 snap 安装,国内没有 snap 源镜像,因此可能无法下载。因此使用较老的安装方式
1 2 3
apt install certbot python3-certbot-apache # 安装 certbot certbot --apache -d domian.com # 其中一个选项选择 2 redirect,实现 http 到 https 跳转 vim /etc/apache2/sites-available/remark-le-ssl.conf # 打开生成的 ssl 配置文件
在
</VirtualHost>
前输入以下内容,实现反向代理(以下端口设置为 8080,可自行更改)1 2 3 4 5 6 7 8
ProxyPreserveHost On ProxyRequests Off <Proxy *> Order allow,deny Allow from all </Proxy> ProxyPass / http://localhost:8080/ ProxyPassReverse / http://localhost:8080/
防火墙打开对应端口
1 2
ufw allow 8080 ufw status #查看端口,确保打开了 80 和 443 端口
通过 docker 部署 Remark42 服务。以官方文档为准,非常详细!
1 2 3
mkdir remark42 # 新建 remark42 文件夹 cd remark42 vim docker-compose.yml
配置如下
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 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55
version: '2' services: remark42: image: umputun/remark42:latest restart: always container_name: "remark42" # 容器名 ports: - "8080:8080" # 冒号左边的端口需要与上述设置一致 # - "443:443" environment: - REMARK_URL=https://domain.com # Remark42 服务器网址,对应上述绑定的域名 - SITE=站点id # 将与前端 site_id 一致,也作为数据库名 - SECRET= # 密钥 - AUTH_ANON=false # 匿名评论 - EMOJI=true # 表情 - AUTH_EMAIL_ENABLE=true # 通过邮箱登录评论 - AUTH_EMAIL_FROM= # 负责发送 tokens 认证的邮箱地址 - SMTP_HOST=smtp.mxhichina.com # smtp 服务器提供者 - SMTP_PORT=465 # smtp 端口 - SMTP_USERNAME= # 负责发送 tokens 认证的邮箱地址 - SMTP_PASSWORD= # 邮箱密码或授权码 - SMTP_TLS=true - StartTLS=true - NOTIFY_USERS=email # 通过 email 或 telegram 方式通知用户 - NOTIFY_ADMINS=email # 通过 email 或 telegram 方式通知管理员 - NOTIFY_EMAIL_FROM= # 负责发送评论通知的邮箱地址 - ADMIN_SHARED_EMAIL= # 管理员接收评论通知的邮箱地址 - AUTH_EMAIL_SUBJ=验证你的邮箱并获得token # 自定义邮件通知信息 - ADMIN_SHARED_ID= # 设置管理员账号。登录评论框后点击头像,出现侧边页,将名字下一长串灰色代码复制过来。用逗号隔开多个管理员账号 - NOTIFY_EMAIL_VERIFICATION_SUBJ=Email verification #邮件认证说明 - VOTES_IP=true # 投票 IP 限制 - ANON_VOTE=true # 匿名投票,需要同时启用 VOTES_IP - ADMIN_EDIT=true # unlimited edit for admins # Enable it only for the initial comment import or for manual backups. # Do not leave the server running with the ADMIN_PASSWD set if you don't have an intention # to keep creating backups manually! #- ADMIN_PASSWD= - IMAGE_PROXY_HTTP2HTTPS=true # 为图片评论设置 SSL 链接 # 谷歌和 GitHub 授权登录设置见官网 https://remark42.com/docs/configuration/authorization/ #- AUTH_GOOGLE_CID= #- AUTH_GOOGLE_CSEC= #- AUTH_GITHUB_CID= #- AUTH_GITHUB_CSEC= volumes: - ./var:/srv/var # 数据存放在 /remark/var/ 目录下 labels: # 反向代理 reproxy.server: domain.com # 与上述绑定的域名一致 reproxy.port: "8080" reproxy.route: "^/(.*)" reproxy.dest: "/$$1" reproxy.ping: "/ping"
拉取 docker 镜像,创建和后台运行容器
1
docker-compose pull && docker-compose up -d
打开
https://domain.com/web/
应能看到 Remark42 的后端界面。前端配置,在站点相应的位置,例如
footor
中添加1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19
<script> var remark_config = { host: xxx, //与上述的 REMARK_URL 一致 site_id: xxx, // 与上述的 SITE 一致 components: ['embed'], // url: {{ .Permalink }}, // Hugo 的当前页链接 max_shown_comments: 20, // 留言展示数目 locale: 'zh', // 界面语言 no_footer: 'true' //是否在页脚链接(指向 remark42 官网) }; (function(c) { for(var i = 0; i < c.length; i++){ var d = document, s = d.createElement('script'); s.src = remark_config.host + '/web/' + c[i] +'.js'; s.defer = true; (d.head || d.body).appendChild(s); } })(remark_config.components || ['embed']); </script>
在需要显示评论框的位置插入
<div id="remark42"></div>
。因为本站仅需要在文章页面启用留言板,因此在 Hugo 配置文件layout/single.html
中添加上述代码。更详细的 Hugo 配置见本站源代码。