Hexo 部署 twikoo 评论系统,邮件推送 versel,被墙导致无法评论的解决方案。

一、配置数据库

1.申请 MongoDB 账号

进入MongoDB注册一个账号。可以使用 github 直接登录。

2.创建 MongoDB 数据库

申请完毕后进入界面,选择最右边的免费共享数据库 ➡️aws➡️N.virginia(us-wast-1)➡️create.

申请账号

image-20231218164756781

设置用户名和密码,记住密码,后面需要使用。

image-20231218165241473

ip 设置 0.0.0.0/0.

image-20231218165437769

自动跳转至数据库列表首页,点击 connect.

image-20231218165548394

链接应用。

image-20231218165804182

记住第 3 条的代码,后续部署需要用到,且使用时需要把 password 处替换你之前设置的密码。

1
mongodb+srv://sumor:<password>@sumor0.kxmeq0a.mongodb.net/?retryWrites=true&w=majority

image-20231218165917658

二、部署到 Vercel

1.申请账号

申请一个Vercel账号.

2.部署仓库

点击以下链接将 Twikoo 一键部署到 Vercel:起名 twikoo 创建。

https://vercel.com/import/project?template=https://github.com/imaegoo/twikoo/tree/main/src/server/vercel-min

注:如果导入后出现空白界面或部署失败等现象,极大可能是 Twikoo 的仓库地址更换了,可以参考官网获取部署链接:部署仓库
点击以下链接将 Twikoo 一键部署到 Vercel:https://twikoo.js.org/quick-start.html

image-20231218170500078

点击进入创建的任务页面-visit.

image-20231218170723931

3.新建变量

进入Settings - Environment Variables页面。
新建一个 NAME 为MONGODB_URI;VALUE 为你在前面记录到的数据库连接字符串的环境变量-save 保存。

注意:需要手动输入之前设置的密码,去掉<>,具体如:

1
mongodb+srv://ambor0225:123456@cluster0.rx4....

image-20231218173358674

4.再次部署

进入Deployments界面,点击右边的竖三点,点击Redeploy

image-20231218171510484

5.检验部署结果

回到Overview,点击 Domains 下方的链接,如果环境配置正确,可以看到 “Twikoo 云函数运行正常” 等字样。
image-20231218180334062

Domains下方的链接即为后面需要使用到的环境 id。

至此,Twikoo 评论系统部署完成。

三、实现邮件通知

1.开通POP3/SMTP 服务

以网易为例,其他邮箱可自行摸索,原理大同小异。

前往你的邮件服务提供商,发短信开启 POP3/SMTP 服务-保存最后的授权密码,后面要用。

image-20231218180728445

image-20231218180916435

image-20231218181058712

四、配置 Twikoo

1.博客启用 Twikoo

此部分教程以 stellar 主题为例说明,其他主题可参阅对应的使用文档。

配置博客文件_config.stellar.yml,启用 twikoo 评论:(云函数位于 versel,domains 下的小地球后面)

1
2
3
4
5
6
7
8
9
10
######## Comments ########
comments:
service: twikoo

# Twikoo
# https://twikoo.js.org/
twikoo:
js: https://gcore.jsdelivr.net/npm/twikoo@1.6.8/dist/twikoo.all.min.js # 建议锁定版本
envId: https://xx.xx.com # twikoo云函数,

image-20231218182040789

重新启动服务,进入博客页面,随意找到一篇文章,查看最下方的评论处,找到评论下方小按钮。点击设置。

image-20231218185655081

image-20231218185833536

【配置管理】-邮件通知:大部分不用填写,使用默认即可。下面几个必填。

SENDER_EMAIL: sumorio@126.com
SMTP_SERVICE: 126
SMTP_PORT: 465
SMTP_SECURE: true
SMTP_USER: <邮件通知邮箱用户名>(需与 SENDER_EMAIL 一致)
SMTP_PASS: (pop 授权码)

image-20231218192456192
image-20231218192508114
image-20231218192548463

其中DEFAULT_GRAVATAR参数可以设置评论默认使用的头像类型,头像区别如下:

image.png

五、versel 版本不符升级配置

官方文档:https://twikoo.js.org/update.html

  1. 进入 Vercel 仪表板 - twikoo - > Settings - Git
  2. 点击 Connected Git Repository 下方的仓库地址
  3. 打开 package.json,点击编辑
  4. "twikoo-vercel": "latest" 其中的 latest 修改为最新版本号。点> 击 Commit changes
  5. 部署会自动触发,可以回到 Vercel 仪表板,查看部署状态

六、解决 versel 被墙无法留言

  1. 登录你的域名解析平台,我这里使用的阿里云-进入【域名解析】工作台-添加域名-twikoo+你的域名-txt 授权校验。

image-20231219101727828

  1. 保存好弹出的验证记录信息,后面要用,先不要点击验证。

image-20231219101850395

  1. 进入【解析设置】界面,点击进入你的域名后台【添加记录】,将上一步的信息填入对应信息即可。
    image-20231219102135138

image-20231219102622969

  1. 返回第 2 步,进行验证。

image-20231219102751818

  1. 进入新增的域名后台,将二级域名解析到 Vercel,新增两条记录。

    主机记录 记录类型 解析请求来源(isp) 记录值 TTL
    twikoo CNAME 默认 cname.vercel-dns.com 10 分钟
    @ A 默认 76.76.21.21 10 分钟

image-20231219103036531

image-20231219103208377

  1. Vercel 项目中添加 Domains

进入【Project Settings】->【Domains】添加域名即可。

image-20231219103441121

  1. 进入博客后台,替换主题配置文件的_config.stellar.yml 以下内容中的 envid.

image-20231219103750343

最后的最后,要记得重新编译运行查看效果哦~

image-20231219104139638


© 2024 Sumor 使用 Stellar 创建
共发表 21 篇Blog · 总计 46.7k 字