SpringBoot+Vue实现发送邮箱验证码

 大三小白实现发送邮箱验证码功能,仅供参考,若有解释不对请见谅

一、前端获取邮件验证码界面

SpringBoot+Vue实现发送邮箱验证码_第1张图片

二、前端部分代码

SpringBoot+Vue实现发送邮箱验证码_第2张图片

SpringBoot+Vue实现发送邮箱验证码_第3张图片

SpringBoot+Vue实现发送邮箱验证码_第4张图片

点击按钮,激活validateEmail函数在通过post提交到springboot里的controller。codetime:当点击发送验证码按钮时,修改按钮内容60秒倒计时。

三、后端发送验证码部分代码

依赖导入:

SpringBoot+Vue实现发送邮箱验证码_第5张图片

1.首先现在application.yaml里配置mail,配置如下:

SpringBoot+Vue实现发送邮箱验证码_第6张图片

 配置完成后,就可以直接写实现方法了,部分代码如下所示:

SpringBoot+Vue实现发送邮箱验证码_第7张图片

 获取前先得在controller里获取到前端填入的邮箱,并在impl包的实现方法里判断邮箱是否存在(此处省略),不存在则随机生成6位验证码,并通过setTo对该邮箱进行发送。

SpringBoot+Vue实现发送邮箱验证码_第8张图片

这样就能实现发送邮箱验证码的功能。

SpringBoot+Vue实现发送邮箱验证码_第9张图片

 

你可能感兴趣的:(vue.js,前端,javascript,spring,boot,java)