SpringBoot项目实现QQ邮箱注册

邮箱注册"/>

SpringBoot项目实现QQ邮箱注册

注：其他邮箱同QQ邮箱操作过程都是一致，此处已QQ邮箱为例

一.环境准备

1.qq邮箱账号

2.SpringBoot环境项目

二.QQ邮箱配置

1.登录qq邮箱官方网站

2.找到设置→账户

 3.开启时，记得保存授权码，没有保存也没关系，可以进入管理服务中，账户安全中，重新申请授权码

三.什么是SMTP?

SMTP是指简单邮件传输协议（Simple Mail Transfer Protocol），它是用于在网络中传输电子邮件的标准协议。SMTP协议定义了电子邮件的传输方式和规则，它负责将发件人的邮件传输到接收人的邮件服务器上。

SMTP协议使用TCP/IP协议来传输邮件，它使用25号端口进行通信。在发送邮件时，客户端应用程序（如电子邮件客户端）通过SMTP协议与发件人的邮件服务器建立连接，并将邮件发送到服务器。服务器再将邮件传输到接收人的邮件服务器上，接收人可以通过POP3或IMAP协议来获取邮件。

SMTP协议不负责邮件的存储和管理，它只负责邮件的传输。因此，SMTP服务器通常是一个中转站，将邮件传输到目标邮件服务器上。SMTP协议还定义了一些命令和响应，用于建立连接、验证身份、传输邮件等操作。

SMTP协议的设计简单高效，使得它成为了互联网上最常用的电子邮件传输协议之一。无论是个人用户还是企业组织，都可以使用SMTP协议来发送和接收电子邮件。

四.SpringBoot依赖导入及配置文件配置

1.依赖导入

<!-- email辅助包 -->
<dependency><groupId>org.springframework.boot</groupId><artifactId>spring-boot-starter-mail</artifactId><version>2.5.1</version>
</dependency>

2.application.properties配置

• 邮件传输协议，此处设定为SMTP

spring.mail.protocol=smtp

• SMTP邮件服务器的主机名或IP地址。--可以参考QQ邮箱官方文档

spring.mail.host=smtp.qq

• SMTP邮件服务器的端口号。

spring.mail.port=587

• SMTP邮件服务器的登录用户名 -- 开启邮箱发送的qq邮箱账户

spring.mail.username= ....@qq

• SMTP邮件服务器的登录密码 --此处配置上述邮箱中的授权码

spring.mail.password=

• 邮件的默认编码方式。

• 是否开启邮件调试模式，打印调试信息。

• 是否启用SMTP认证。

  spring.mail.default-encoding=utf-8
  spring.mail.properties.mail.debug=true
  spring.mail.properties.mail.smtp.auth=true

五.代码编写

• 请求参数：用户在首页输入邮箱，注：此处最好对邮箱格式校验

 @GetMapping("send")public ResultVO send(@RequestParam("email") String email) {log.debug("email:{}",email);//生成四位随机验证码Integer code = new Random().nextInt(8999) + 1000;log.debug("验证码:{}",code);//用于创建简单的邮件消息。通过SimpleMailMessage对象，// 你可以设置邮件的发送者、接收者、主题、正文等信息。SimpleMailMessage message = new SimpleMailMessage();//主题message.setSubject("验证码验证");//正文message.setText("验证码:" + code);//接受邮箱message.setTo(email);//发送者邮箱message.setFrom("。。。。@qq");//发送javaMailSender.send(message);//验证码缓存redis两分钟redisCode.saveEmailCode(email,code);return new ResultVO(StatusCode.SUCCESS);}

• 前端代码实现：VUE脚手架，element ui组件，axios

 前端邮箱加发送按钮代码实现

<el-form-item class="a" label="邮箱"><el-input placeholder="填写正确格式" v-model="user.email"></el-input><button type="button" id="send-code-btn" @click="send()" style="background-color: skyblue" >发送验证码</button></el-form-item><el-form-item  class="a" label="验证码"><el-input placeholder="填写邮箱验证码" v-model="user.code"></el-input></el-form-item>

 /*** 发送验证码方法*/send() {//^ 表示匹配字符串的开始位置。//([a-zA-Z0-9_\-\.]+) 表示匹配一个或多个字母、数字、下划线、短横线或点号。//@ 表示匹配一个 @ 符号。//([a-zA-Z0-9_\-\.]+) 表示匹配一个或多个字母、数字、下划线、短横线或点号。//\. 表示匹配一个点号。//([a-zA-Z]{2,5}) 表示匹配两到五个字母。//$ 表示匹配字符串的结束位置。let email_regex = /^([a-zA-Z0-9_\-\.]+)@([a-zA-Z0-9_\-\.]+)\.([a-zA-Z]{2,5})$///let email_regex = /^(?=.*[a-zA-Z])(?=.*\d)[a-zA-Z\d]{6,16}$/;if (!(email_regex.test(this.user.email))) {this.$message.error("邮箱格式格式不正确");return;}this.axios.get("http://localhost:8081/v1/users/send?email=" + this.user.email).then((response) =>{if (response.data.code == 1000) {this.$message.success("发送验证码成功");}else {alert("发送验证码失败");return;}});// 将按钮变为不可用状态var btn = document.getElementById('send-code-btn');btn.disabled = true;// 开始倒计时var count = 120;var timer = setInterval(function() {count--;btn.innerHTML = count + '秒后重新发送';if (count == 0) {clearInterval(timer);btn.innerHTML = '发送验证码';btn.disabled = false;}}, 1000);