上一期我们已经为网站增加了注册登录功能,这一期我们再增加邮箱验证和邮件找回密码功能。

为什么已经有注册登录功能还有增加邮箱验证呢?

其实之前我也在想这个问题,直到有用户问我忘记密码了怎么办?我只能哼哧哼哧的去数据库给他修改,非常的繁琐,但是验证邮箱后可以直接通过邮件重置密码,简单又方便。

Resend邮箱

既然用到邮箱服务肯定是要选择邮箱服务商的,我一直用的是Resend的,可以免费试用,一个月可以发送1000条邮件,对于测试完全够用,目前测试发送虽然部分会有延迟,但基本都发送成功了。

Resend可以用Github授权登录,也是比较方便,登录成功后获取API Key,第一次获取千万要保存,关闭页面就看不到key值只能重新创建。

商业项目实战篇六:PDF2MD工具增强安全,邮箱验证+密码重置快上线!插图

获取到API Key值后还要绑定发送域名,需要验证DNS,如果域名在Cloudflare可以一键授权,在其他地方的需要解析域名。

商业项目实战篇六:PDF2MD工具增强安全,邮箱验证+密码重置快上线!插图1

邮箱验证功能

邮箱功能准备完毕后,我们开始用Cursor写代码增加邮箱验证功能,同时告诉它我们用Resend邮箱服务商。

商业项目实战篇六:PDF2MD工具增强安全,邮箱验证+密码重置快上线!插图2

接入成功后我们在.env.loacl添加变量,NEXTAUTH_URL=你的域名,RESEND_API_KEY=是上面获取的API Key,EMAIL_FROM=是发送邮箱,后缀可以看到就是绑定的域名,@前面一般用noreply.

商业项目实战篇六:PDF2MD工具增强安全,邮箱验证+密码重置快上线!插图3

其实我们只是让它增加邮箱验证功能,它好像懂我的心思,把重置密码功能也帮我一起增加了,省去了不少时间成本。

商业项目实战篇六:PDF2MD工具增强安全,邮箱验证+密码重置快上线!插图4

当然,功能添加完成肯定会有BUG,最常见的就是更新数据库表后Prisma客户端没有更新,也用指令更新了还是报错,这是缓存问题,重启下Cursor就可以解决了。

商业项目实战篇六:PDF2MD工具增强安全,邮箱验证+密码重置快上线!插图5

我们在增加邮箱验证功能,数据库也会增加Token验证字段,所以在完成功能的添加之后不要忘记迁移数据库哦~

商业项目实战篇六:PDF2MD工具增强安全,邮箱验证+密码重置快上线!插图6

数据库迁移如果用用户数据千万要备份,不然出现问题数据就会全部丢失。

商业项目实战篇六:PDF2MD工具增强安全,邮箱验证+密码重置快上线!插图7

现在功能全部增加完成,我们来测试邮箱功能,是否可以正常收到邮件,一开始用的企业邮箱显示发送成功,但是一直没收到,后来改成QQ邮箱倒是正常了,看来企业邮箱会有延迟。

邮件的发送记录也可以在Resend后台看到,是否发送成功都有记录,可以及时的找到问题。

商业项目实战篇六:PDF2MD工具增强安全,邮箱验证+密码重置快上线!插图8

我们也来看看正常发送的邮箱验证和重置密码的邮件。

商业项目实战篇六:PDF2MD工具增强安全,邮箱验证+密码重置快上线!插图9
商业项目实战篇六:PDF2MD工具增强安全,邮箱验证+密码重置快上线!插图10

测试功能没有问题还忽略个问题,没有实现多国语言切换,Cursor还是比较给力的,分分钟搞定这个小问题。

商业项目实战篇六:PDF2MD工具增强安全,邮箱验证+密码重置快上线!插图11

至此,今天的任务已经完成了,成功增加邮箱验证和重置密码功能。



微信扫描下方的二维码阅读本文

商业项目实战篇六:PDF2MD工具增强安全,邮箱验证+密码重置快上线!插图12

声明:本站所有文章,如无特殊说明或标注,均为本站原创发布。任何个人或组织,在未征得本站同意时,禁止复制、盗用、采集、发布本站内容到任何网站、书籍等各类媒体平台。如若本站内容侵犯了原著者的合法权益,可联系我们进行处理。