Vercel部署Twikoo评论系统保姆级教程

文章摘要

白衣 DeepSeek

前言

Hexo作为静态博客，访客无法直接评论，为解决这一问题，添加一个合适的评论系统很有必要。我推荐使用twikoo，它部署方式多样，官方文档也极为详尽，便于操作。

我之前写过一篇通过 docker 部署 Twikoo 评论系统的文章，不过那种方式需要用到自己的服务器。这里考虑到没有服务器的朋友，利用 Vercel 来免费部署Twikoo

引用站外链接

Twikoo 文档

Vercel 部署 | Twikoo 文档

一.创建MongoDB数据库

MongoDB Atlas是MongoDB Inc.推出的一项便捷的MongoDB数据库托管服务。其免费套餐能够让用户永久享有512MB的数据库空间，对于存储Twikoo评论数据而言，这个容量完全足够。

1.注册MongDB账号

接下来在MongoDB Atlas注册账号：

引用站外链接

MongoDB

MongoDB AtLas账号注册页面

2.购买免费Free套餐

选择香港（Hong Kong）就可以了，运营商AWS、Azure、Google随便，香港能选择就行，然后创建即可。
购买免费Free套餐

3.创建数据库用户

接下来我们创建数据库用户，在Database Access页面点击Add New Database User（create database user）创建数据库用户。

4.添加Network Access

紧接着，进入Network Access 页面，点击Add IP Address来添加网络白名单。由于 Vercel 的出口地址并非固定不变，为确保能够正常连接，我们需要在Access List Entry中输入0.0.0.0/0，以此来允许所有 IP 地址进行连接。
添加Network Access

5.获取数据库连接字符串

点击Connect，连接方式选择Drivers
Drivers

然后你就得到了一串字符串，复制这个字符串
复制字符串

连接字符串至关重要，它囊括了连接至MongoDB数据库的全部必要信息。一旦该字符串不慎泄露，后果将十分严重。因此，务必妥善保管好这一连接字符串，在后续对Twikoo进行部署时，还需要将其准确填入到相应的部署平台中。

下面只是例子，必须复制你平台获取的，这个例子无效。

1	mongodb+srv://....:你的数据库密码@cluster0.zzsmj.mongodb.net/?retryWrites=true&w=majority&appName=Cluster0

复制数据库连接字符串之后，将连接字符串中的<password>修改为你创建的数据库密码，修改后的就是之后要用到的。到这里MongDB的就完成了。

二.Vercel部署Twikoo

1.注册Vercel账号

注意，这里注册非常严苛，你可以选择Github注册，也可以邮箱注册，如果注册失败那就是你的邮箱不符合要求，国内邮箱比如qq.com是不行的，解决办法是更改Github的邮箱为国际邮箱。也可以直接用国际邮箱注册，推荐用@outlook.com，按要求注册就行了。

引用站外链接

Vercel

Vercel官网注册

2.一键部署

前提是你注册成功了，并且成功登录了，然后点击下面链接，进行一键部署。这里仓库不用提前准备，必须是不存在的仓库名才行

引用站外链接

Vercel

Twikoo一键部署

3.配置环境变量

选择新建的Twikoo项目，进入Settings -> Environment Variables，添加环境变量MONGODB_URI，值为前面的MongoDB数据库连接字符串（注意替换<Password>）。
配置环境变量

4.Redeploy

进入Deployments，进行Redeploy，等待重新部署完毕。

等待重新部署完成后，进入Project，查看Overview或者点击visit，看见Twikoo云函数运行正常的提示，说明部署成功
Redeploy

Vercel Domains（包含 https:// 前缀，例如 https://xxx.vercel.app）即为环境ID，也就是envId

5.绑定自定义域名

在自有域名添加解析，选择 CNAME 类型转发，记录值填写为：cname.vercel-dns.com
然后在第四步的云函数运行正常页面中点击右侧的Domains菜单项，输入你自己定义的域名点击Add按钮即可。

这一步一定要做，Vercel默认的你拿来直接用，那就太慢了，绑定成功后，访问自定义Domains，看到如下代码，说明成功

1	{"code":100,"message":"Twikoo 云函数运行正常，请参考 https://twikoo.js.org/frontend.html 完成前端的配置","version":"1.6.41"}

三.解决邮箱推送异常

在vercel部署twikoo后收不到评论邮件通知问题，这个我也遇到过，原因在于新部署的Vercel环境默认启用了Vercel Authentication，该功能会导致 Twikoo 邮件通知失败。
解决办法就是进入Settings-Deployment Protection，设置Vercel Authentication为Disabled，并 Save。
关闭按钮并保存

四.Hexo配置

这里，每个主题都不一样，但也都大差不差，评论类型选择twikoo，然后true开启，配置你的envId就可以了，具体怎么弄结合实际情况吧。

_config.yml

# Twikoo
twikoo:
  envId:  # 填入你绑定的自定义域名就可以了
  region: 
  path:

结语

经过上面的一顿折腾，我们终于完成了借助 Vercel 部署 Twikoo 评论系统以及在 MongoDB Atlas 搭建数据库的流程。这一系列步骤虽然有些繁琐，但当你看到评论系统能够顺利运行时，我们的一切努力便有了意义。