部署Twikoo评论系统及其邮件推送(Vercel)

详细介绍了使用Vercel+MongoDB方案搭建Twikoo评论系统的过程,并实现邮件自动通知回复信息。

配置数据库

申请MongoDB账号

进入MongoDB注册一个账号。
申请账号

创建MongoDB数据库

申请完毕后进入以下界面,选择最右边的免费共享数据库。
选择数据库

进入创建页面后,其他选项及配置保持默认,区域选择推荐AWS / N. Virginia (us-east-1)
创建页面

区域选择完毕后,拉到页面底部点击Create进入下一步。

配置MongoDB数据库

ip设置为0.0.0.0/0即可:
配置ip.png

创建数据库用户,请记住这里的password,后面步骤需要使用到。
配置用户.png

回到Clusters页面,点击CONNECT
CONNECT1.png

选择第二项:Connect your applicalion进入
CONNECT2.png

进入以下页面,请记录你的数据库连接字符串,并将其中的<password>替换为你创建的数据库用户的密码
这项数据库连接字符串将会在部署twikoo时使用到,请保存备用。
CONNECT3.png

部署到Vercel

申请账号

申请一个Vercel账号,如已有Vercel账号可跳过这步。

部署仓库

点击以下链接将Twikoo一键部署到Vercel:

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

注:如果导入后出现空白界面或部署失败等现象,极大可能是Twikoo的仓库地址更换了,本文未能及时更新,可以自行前往Twikoo文档中获取部署链接:
https://twikoo.js.org/quick-start.html#vercel-%E9%83%A8%E7%BD%B2

REPOSITORY NAME处随意输入一个仓库名字即可。
创建仓库.png

点击Create进入下一步。
等待Import进度跑完后,点击Visit进入仓库。

新建环境变量

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

再次部署

进入Deployments界面,点击右边的竖三点,点击Redeploy
在这里插入图片描述

检验部署结果

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

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

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

实现邮件通知

开通POP3/SMTP服务

以下教程以QQ邮箱为例,其他邮箱可自行摸索,原理大同小异。

前往你的邮件服务提供商,开通POP3/SMTP服务服务。

开通服务.png

验证密保.png
授权码.png

这里的授权码后面会用到,记得留存。

配置Twikoo

启用Twikoo

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

打开[Blogroot]\_config.butterfly.yml主题配置文件,

twikoo:
  envId: 

填写环境id,再在comments-use中填写Twikoo即可。
部署到GitHub上后,进入一个有评论区的页面,点击输入框下的齿轮状按钮,设置你的管理密码。

配置邮件通知服务

进入配置管理 - 邮件通知,按照下方提供的标准填写即可。

SENDER_EMAIL: <你的QQ邮箱地址>
SMTP_SERVICE: <你的邮件服务提供商>
SMTP_HOST: <自定义 SMTP 服务器地址>
SMTP_PORT: <自定义 SMTP 端口>
SMTP_SECURE: <自定义 SMTP 是否使用 TLS>
SMTP_USER: <邮件通知邮箱用户名>(需与SENDER_EMAIL一致)
SMTP_PASS: <邮件通知邮箱密码>(授权码)

可参考我的配置:
配置1.png
配置2.png

测试

拉到最下方点击保存后,打开邮件通知测试,输入你的邮箱,点击发送测试邮件,如果能成功收到邮件即说明邮件通知服务设置成功!
测试成功.png

参考文章

特别鸣谢

@小石潭烤鱼,排查两天发现本教程的错处:

原Vercel的导入链接已失效,本教程未及时更新。

现2022年6月5日已替换为新链接。

现2022年8月1日已替换为新链接。

  • 15
    点赞
  • 25
    收藏
    觉得还不错? 一键收藏
  • 15
    评论
你可以通过以下步骤在 Vercel部署 Flask用: 1. 确保你的 Flask 应用可以在本地正常运行,并且已经安装了必要的依赖。 2. 将你的 Flask 应用上传到一个版本控制系统(如 GitHub)。 3. 在 Vercel 上创建一个新项目。 4. 在 Vercel 的项目设置中,将你的版本控制系统与 Vercel 进行关联,以便自动部署。 5. 配置 Vercel 的构建设置,以告知 Vercel 如何构建和运行你的 Flask 应用。对于 Flask 应用,你可以使用 `vercel.json` 文件来定义构建和运行命令。例如,以下是一个示例的 `vercel.json` 文件: ```json { "version": 2, "builds": [ { "src": "app.py", "use": "@vercel/python" } ], "routes": [ { "src": "/(.*)", "dest": "/app.py" } ] } ``` 这个示例假设你的 Flask 应用的入口文件是 `app.py`。`builds` 部分告诉 Vercel 使用 `@vercel/python` 构建器来构建你的应用。`routes` 部分将所有请求重定向到 `app.py`。 6. 提交并推送你的代码更改到版本控制系统。 7. Vercel 将自动检测到你的代码更改,并在构建和部署过程中运行你的 Flask 应用。 8. 部署完成后,Vercel 将提供一个 URL,你可以访问该 URL 来查看部署的 Flask 应用。 这样,你的 Flask 应用就成功地部署在 Vercel 上了。请注意,Vercel 主要用于静态网站和前端应用的部署,对于需要长时间运行的后端应用,可能不是最佳选择。对于更复杂的后端应用,你可能需要考虑其他云平台,如 Heroku 或 AWS。
评论 15
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值