记录twikoo评论系统的折腾日记
小老头 Lv3

话说在前两天在《个站商店》里收到《夏目贵志》的私信,告诉我:我的博客评论系统并不完善,并且属于经常打不开的状态。

因为我的博客评论系统使用的是gitalk所以这个评论系统属于在国内经常性被墙的范围,而且gitalk****是一个基于 Github IssuePreact 开发的评论插件, 实际上就是在issue上提问题发表的一个评论系统,但是这个gitalk的缺点也是非常的明显,首先在国内会经常性的打不开,还有这个gitalk**仅支持GitHub账户登录,对于我们来说其实并不友好。

并且《夏目贵志》的私信里还推荐了我使用:https://twikoo.js.org/

Twikoo,一个简洁、安全、无后端的静态网站评论系统。文档链接:https://twikoo.js.org

不过鉴于我个人的文化水平我可能需要摸索一段时间才行,毕竟我个人的文化水平在那摆着,这是一个个人的硬伤啊!!!!!!

经过两天半的时间摸索,还算不错算是弄成了,😄

看效果:


Twikoo的部署

Twikoo 分为云函数和前端两部分,部署时请注意保存二者版本一致。

云函数部署

部署方式 描述
一键部署 [ 不建议 ] 虽然方便,但是仅支持按量计费环境——也就是说,一键部署的环境,当免费资源用尽后,将会产生费用。且按量计费环境无法切换为包年包月环境。免费额度数据库读操作数只有 500 次 / 天,无法支撑 Twikoo 的运行需求
手动部署 [ 建议 ] 手动部署到腾讯云云开发环境,在中国大陆访问速度较快。由于基础版 1 已从 0 元涨价至 6.9 元 / 月,需要付费购买环境才能部署。
命令行部署 [ 不建议 ] 仅针对有 Node.js 经验的开发者。
Vercel 部署 [ 建议 ] 适用于想要免费部署的用户,在中国大陆访问速度较慢。

我个人选择的Vercel部署,至于为什么选择它呢,因为它免费啊,像我这种已经用github部署hexo博客方式的建立博客人来说,不太愿意在这方面在花钱的,😅

Vercel 部署

注意Vercel 部署的环境需配合 1.4.0 以上版本的 twikoo.js 使用

查看视频教程(opens new window)

  1. 申请 MongoDB (opens new window)账号
  2. 创建免费 MongoDB 数据库,区域推荐选择 AWS / N. Virginia (us-east-1)
  3. 在 Clusters 页面点击 CONNECT,按步骤设置允许所有 IP 地址的连接(为什么? (opens new window)),创建数据库用户,并记录数据库连接字符串,请将连接字符串中的 <password> 修改为数据库密码
  4. 申请 Vercel (opens new window)账号
  5. 点击以下按钮将 Twikoo 一键部署到 Vercel
    img(opens new window)
  6. 进入 Settings - Environment Variables,添加环境变量 MONGODB_URI,值为第 3 步的数据库连接字符串
  7. 进入 Overview,点击 Domains 下方的链接,如果环境配置正确,可以看到 “Twikoo 云函数运行正常” 的提示
  8. Vercel Domains(包含 https:// 前缀,例如 https://xxx.vercel.app)即为您的环境 id

而且twikoo的作者也发不了利用Vercel部署的教程,看下方哈:


说说我部署twikoo所遇到的坑吧!个人的文化水平确实是硬伤啊·········!

部署twikoo所遇到的坑

第一坑

如何把twikoo放置到我博客里,因为我使用的是《Keep》这个主题,并且这个主题已经集成了twikoo评论的各种设置。

但是如何把twikoo添加到《Keep》里,并且在我的博客中展现出来,这个我就伤脑筋了,因为不会啊!!!!在网上搜的时候,网上的教程都是基于腾讯云开发的教程,所以网上搜索的都是要先在腾讯云部署。

但是我是利用Vercel部署的,还有我的文化水平太低了这点······这特么的就有点不知所措了啊!!!!

最后经过各种搜索还是找到了如何放置到自己博客的方法:

首先打开《Keep》主题的config.yml文件,

在173行的enable:后面写上 true

在174行的 use:填写 twikoo

在194行的env_id: 后面填写你Vercel部署的地址。

附图:

接着找到《Keep》主题文件里的 twikoo.ejs,并且打开它,并且把里面的这一段代码换成twikoo最新版本的代码:

//cdn.jsdelivr.net/npm/twikoo@1.4.6/dist/twikoo.all.min.js

附图:


第二坑

因为在Vercel部署twikoo的时候是要拉取GitHub的仓库啊还是什么的,我也不懂啊·····😔

但是悲催的是:

我把GitHub的密码账户忘了······😫

我把当初注册GitHub的邮箱也忘了····😫

我几乎打不开GitHub·····😫

能想象一下我当时的绝望么·····😫

不过最终还是完美的解决了,🤭

我的解决方案是,”艰难的“换了一个GitHub的账户,并且重新生成了SSH Key,并且艰难的把SSH Key添加在新的GitHub账户里,而且把我的博客也部署到了新的GitHub账户仓库里。


至此算是折腾twikoo成功的一个过程吧,虽然过程蛮痛苦的,但是也还有折腾成功的喜悦😄

当然还有twikoo一些配置这种东西,目前还没有搞,不过这些我还需要一些时间去弄,总之慢慢搞吧。

.article-copyright-info-container { position: relative; width: 100%; box-sizing: border-box; padding: 10px 6px; font-size: 1rem; background: var(--second-background-color); &::after { position: absolute; top: 0; left: 0; content: ''; width: 6px; height: 100%; background: var(--copyright-info-color); } ul { margin-left: 10px; li { margin-bottom: 5px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--default-text-color); .license { font-weight: bold; } &:last-child { margin-bottom: 0; } } } }
 评论