type
status
date
slug
summary
tags
category
icon
password
下面内容是自己在创建自己新的博客的时候,添加评论系统的记录
📝 前言
我的博客是采用搭建的,具体可以参考大佬的这篇文章《利用NotionNext快速搭建个人博客》
📝Twikoo
Twikoo也是一个免费、开源的静态网站评论系统,支持更丰富的功能,比如,可以支持个性化的标识、图片评论以及对垃圾评论进行过滤等。
部署步骤
1.Twikoo是基于MongoDB数据库运行的
https://cloud.mongodb.com/v2/6694f6e1c133444deedeb328#/overview 因此我们需要先注册一个账号,然后我们点击Database

在这里选择shared,但是第一次弄可能界面不太一样,统一选择shared就行,其它的跟下图一样就行

点击创建之后一定要回到最初始的地方,然后点击Connect

2. 获取MongoDB数据库的链接地址

这里是我之前已经创建好的了,所以跳过了第一步,第一步是设置用户名和密码
注意:选择用户名和密码访问MongoDB数据库。另外访问数据库的IP地址,设置为0.0.0.0,即允许所有地址都访问。(这里后面会进行操作)

链接地址格式为:mongodb+srv://你设置的用户名:你设置的密码@blog-comments.jqh9cs7.mongodb.net/?retryWrites=true&w=majority。记得要把<你设置的密码>两边的<>去掉。
3. 打开以下链接,并fork twikoo项目到自己的新仓库。
4.打开vercel,创建新项目,并导入步骤3创建的新仓库(fork的仓库)。
5.配置Root Directory

这里导入你fork的仓库

依次选择
src→server→vercel-min
,点击Deploy开始部署。
6. 部署完成后,打开项目的设置,添加MONGODB_URI
环境变量,值为步骤2中MongoDB的链接地址。
7.部署后,为确保twikoo的服务能被公开访问,关闭vercel后台的权限验证。

8. 获取twikoo的访问域名

9. 在NotionNext项目中添加环境变量
NEXT_PUBLIC_COMMENT_ENV_ID
,值为步骤8中的twikoo服务的域名,然后重新部署你的NotionNext项目。10.最终效果展示

🤗 总结归纳
Twikoo评论系统非常的便捷,省去了登录GitHub的过程
📎 参考文章
有关Twikoo安装或者使用上的问题,欢迎您在底部评论区留言,一起交流~
- Author:5m10v3
- URL:https://5m10v3.top/article/guide
- Copyright:All articles in this blog, except for special statements, adopt BY-NC-SA agreement. Please indicate the source!