使用Docker自建一个Twikoo本地评论系统

一、关于Twikoo的介绍

Twikoo项目的官网：Twikoo

一个简洁、安全、免费的静态网站评论系统。

二、环境准备

在教程正式开始之前需要准备以下环境。

注意：此教程只适合您在公网拥有一台属于自己的服务器或者本地内网测试环境下使用。

以下是需要的必备条件
一台可公网访问的服务器
一个您自己的域名，例：我的就是wsjj.top
一份SSL证书，确保您的域名可通过https访问

三、安装Docker容器环境

这里我不再赘述，可以参考我以前写过的教程【容器应用系列教程】容器介绍、Docker的安装和基本操作

四、部署Twikoo网站评论系统

1.拉取Twikoo的镜像

docker pull imaegoo/twikoo:latest

2.运行Twikoo镜像

docker run --name twikoo -e TWIKOO_THROTTLE=1000 -p 8080:8080 -v ${PWD}/data:/app/data -d imaegoo/twikoo:latest

以下是参数的详情

参数说明
--name指定容器名字
-e传递环境参数
-p映射容器内部8080端口到外部8080端口
-v持久数据挂载
-d容器后台运行

3.使用IP+端口的方式测试是否成功运行

我们打开浏览器访问服务器IP+8080端口测试，API服务是否启动成功。如果成功，您将看到以下页面

twikoo1

4.建立反向代理站点

这里需要您拥有个域名和域名相应的SSL证书，我这里不做过多赘述，网上有很多关于这方面的教程，购买个域名和申请免费证书都是一条龙服务。

我这里使用1panel进行演示

安装Nginx服务器

这里不再做过多赘述，使用1panel部署openresty应用即可

创建反向代理站点

twikoo2.png

为站点配置https访问

twikoo3.png

在域名解析商DNS相关解析中，添加域名记录

博主这里用的腾讯云DNS所以拿腾讯云做演示

twikoo4.png

测试域名访问

如果出现以下页面，即证明部署成功

twikoo1.png

五、在相关静态网页或站点引用评论系统

如果您的hexo这种博客系统可以参考官方的引用文档

如果您是第三方博客或者自己开发的网页，可以把以下内容添加到网页<body>标签中

<div id="tcomment"></div>
<script src="https://cdn.jsdelivr.net/npm/twikoo@1.6.44/dist/twikoo.min.js"> </script> //调用外部js的CDN加速地址
<script>
twikoo.init({
  envId: 'https://您的环境id', // 这里的环境ID就是上面配置的反向代理站点地址
  el: '#tcomment', // 容器元素
  // region: 'ap-guangzhou', // 环境地域，默认为 ap-shanghai，腾讯云环境填 ap-shanghai 或 ap-guangzhou；Vercel 环境不填
  // path: location.pathname, // 用于区分不同文章的自定义 js 路径，如果您的文章路径不是 location.pathname，需传此参数
  // lang: 'zh-CN', // 用于手动设定评论区语言，支持的语言列表 https://github.com/twikoojs/twikoo/blob/main/src/client/utils/i18n/index.js
})
</script>

根据您服务器的地址，选择您合适的CDN加速地址，注意CDN加速地址的版本必须和Docker搭建的后端版本相对应。

推荐在中国使用

  • https://registry.npmmirror.com/twikoo/1.6.44/files/dist/twikoo.min.js
  • https://s4.zstatic.net/npm/twikoo@1.6.44/dist/twikoo.min.js

推荐在全球使用

  • https://cdn.jsdelivr.net/npm/twikoo@1.6.44/dist/twikoo.min.js

备用选项

  • https://s4.zstatic.net/ajax/libs/twikoo/1.6.41/twikoo.min.js
  • https://lib.baomitu.com/twikoo/1.6.39/twikoo.min.js

测试网页评论系统

如果您的站点出现以下界面，恭喜你评论系统已经搭建完成了！

twikoo5.png