创建MongoDB数据库

MongoDB Atlas | MongoDB 注册账号，然后创建数据库

image-20240521163956763

选择免费的数据库创建 ， 使用亚马逊的服务商，地区选择us-east-1。

image-20240521164030051

可以在name中自定义数据库名

然后创建一个用户，用于登录数据库，记住密码

image-20240521164138261

往下翻，填入允许访问的ip，我们需要所有人均可访问填入0.0.0.0

image-20240521173714077

创建连接 ，在database页面选择连接刚刚创建的数据库，在这里我的数据库名为commits

image-20240521164253708

选择默认的drivers连接

image-20240521164450028

复制这一段代码，并把<password>改成刚刚创建的用户的密码

image-20240521164523440 image-20240521164726932

Vercel一键部署

Vercel 创建新项目

填入仓库名

image-20240521165018197

如下图所示，创建成功

image-20240521170333456

进入 Settings - Environment Variables，添加环境变量 MONGODB_URI，值为前面记录的数据库连接字符串,最后save保存即可

image-20240521170828208

重启一下服务：image-20240521170902471

访问地址看到下图信息，说明配置完成

image-20240521174054664

完善博客主题相关配置

由于我是用的主题为Butterfly，直接修改相关内容即可

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
comments:
  # Up to two comments system, the first will be shown as default
  use: twikoo # Valine,Disqus
  text: true # Display the comment name next to the button
  # lazyload: The comment system will be load when comment element enters the browser's viewport.
  # If you set it to true, the comment count will be invalid
  lazyload: true
  count: true # Display comment count in post's top_img
  card_post_count: true # Display comment count in Home Page
  
# Twikoo
twikoo:
  envId: https://twikoo-service-nuhq.vercel.app/
  region:
  visitor: false
  option:

点击设置可以编辑控制评论

image-20240521180546592