基于SpringBoot实现QQ邮箱验证码注册功能

更新时间：2024年11月07日 11:14:58 作者：烟雨长虹，孤鹜齐飞

QQ 邮箱是由腾讯公司推出的一款免费邮箱服务,它提供了完整的邮件发送和接收功能,并且还支持多种邮件格式和附件类型,QQ 邮箱还具有强大的反垃圾邮件功能,可以有效地过滤垃圾邮件,并保护用户隐私和安全,所以本文给大家介绍了基于SpringBoot实现QQ邮箱验证码注册功能

开启邮箱服务

（1）首先打开QQ邮箱，点击设置并来到账号页面

（2）找到并开通以下的邮件协议服务，而且服务开启也较为简单，需要我们发送一个短信到指定的号码，开启后平台会提供一个授权码，一定要记住这个授权码，发邮件的时候需要这个。

导入项目依赖

发送邮件的核心依赖是 mail ，由于该项目还涉及其他依赖就全都导进来了。

    <dependencies>
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-web</artifactId>
        </dependency>
        <dependency>
            <groupId>org.mybatis.spring.boot</groupId>
            <artifactId>mybatis-spring-boot-starter</artifactId>
            <version>3.0.3</version>
        </dependency>
        <dependency>
            <groupId>com.mysql</groupId>
            <artifactId>mysql-connector-j</artifactId>
            <scope>runtime</scope>
        </dependency>
        <dependency>
            <groupId>org.projectlombok</groupId>
            <artifactId>lombok</artifactId>
            <optional>true</optional>
        </dependency>
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-test</artifactId>
            <scope>test</scope>
        </dependency>
        <dependency>
            <groupId>org.mybatis.spring.boot</groupId>
            <artifactId>mybatis-spring-boot-starter-test</artifactId>
            <version>3.0.3</version>
            <scope>test</scope>
        </dependency>
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-mail</artifactId>
        </dependency>
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-thymeleaf</artifactId>
        </dependency>
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-data-redis</artifactId>
        </dependency>
        <dependency>
            <groupId>junit</groupId>
            <artifactId>junit</artifactId>
            <scope>test</scope>
        </dependency>
        <dependency>
            <groupId>cn.hutool</groupId>
            <artifactId>hutool-all</artifactId>
            <version>4.5.16</version>
        </dependency>
    </dependencies>

配置 yml 文件

spring:
  application:
    name: demo
    # 配置数据库
  datasource:
    url: jdbc:mysql://localhost:3306/user?useSSL=false&useUnicode=true&characterEncoding=utf8
    username: root
    password:
    driver-class-name: com.mysql.cj.jdbc.Driver
  mail:
    # smtp服务主机  qq邮箱则为smtp.qq.com; 163邮箱是smtp.163.com
    host: smtp.qq.com
    # 服务协议
    protocol: smtp
    # 编码集
    default-encoding: UTF-8
    # 发送邮件的账户
    username: xxx@qq.com
    # 授权码
    password: xxx
    # 发送人昵称
    nickname: xxx
 
    test-connection: true
    properties:
      mail:
        smtp:
          auth: true
          starttls:
            enable: true
            required: true

其中的 username 是你第一步中操作的邮箱账号，nickname 是接收者收到邮件中显示的发件人。

host 是根据服务主机区分，网易邮箱是 smtp.163.com, qq邮箱是 smtp.qq.com。其它的默认即可。

创建数据库文件

CREATE TABLE `user` (
  `username` varchar(20) NOT NULL,
  `password` varchar(20) NOT NULL,
  `mailbox` varchar(20) NOT NULL,
  `id` int(20) NOT NULL AUTO_INCREMENT,
  PRIMARY KEY (`id`)
) ENGINE=InnoDB AUTO_INCREMENT=56 DEFAULT CHARSET=utf8

Dao 层

@Mapper
public interface UserDaoImpl {
    @Select("select * from user.user where username = #{username} and password = #{password}")
    User queryUser(@Param("username") String username, @Param("password")  String password);
 
    @Select("select * from user.user where username = #{username}")
    User selectByUsername(String username);
 
    @Insert("insert into user.user(username,password,mailbox) values (#{username},#{password},#{mailbox})")
    void AddUser(@Param("username") String username, @Param("password") String password, @Param("mailbox") String mailbox);
}

@Repository
public class UserDao implements UserDaoImpl{
    @Autowired
    private UserDaoImpl userDaoImpl;
 
    @Override
    public User queryUser(String username, String password) {
        return userDaoImpl.queryUser(username,password);
    }
 
    @Override
    public User selectByUsername(String username){
        return userDaoImpl.selectByUsername(username);
    }
 
    @Override
    public void AddUser(String username, String password, String mailbox) {
        userDaoImpl.AddUser(username,password,mailbox);
    }
}

Service 层

public interface UserServiceImpl {
    User queryUser(String username, String password);
    User selectByUsername(String username);
    void AddUser(String username, String password, String mailbox);
}

@Service
public class UserService implements UserServiceImpl{
    @Autowired
    private UserDao userDao;
 
    @Override
    public User queryUser(String username, String password) {
        return userDao.queryUser(username, password);
    }
 
    @Override
    public User selectByUsername(String username) {
        return userDao.selectByUsername(username);
    }
 
    @Override
    public void AddUser(String username, String password, String mailbox) {
        userDao.AddUser(username, password, mailbox);
    }
}

Controller 层

@RequestMapping("/User")
@RestController
public class UserController {
    @Autowired
    private UserService userService;
 
    // 判断登入
    @RequestMapping(value = "/login", method = RequestMethod.POST)
    public Boolean login(String name, String password, HttpSession session){
        if (!StringUtils.hasLength(name) || !StringUtils.hasLength(password)){
            System.out.println(false);
            return false;
        }
        if (userService.selectByUsername(name) != null&&
                userService.queryUser(name,password)!= null){
            session.setAttribute("userName", name);
            System.out.println(true);
            return true;
        }
        System.out.println(false);
        return false;
    }
    // 获取用户名
    @RequestMapping("/getLoginUser")
    public String getLoginUser(HttpSession session){
        if(session.getAttribute("userName")!=null){
            return (String)session.getAttribute("userName");
        }
        return "";
    }
 
}

注册

@RestController
@RequestMapping("/email")
public class EmailController {
    @Autowired
    private UserService userService;
    // 这个是 mail 依赖提供给的发送邮件的接口
    @Autowired
    private JavaMailSender mailSender;
    // 获取发件人邮箱
    @Value("${spring.mail.username}")
    private String sender;
    // 获取发件人昵称
    @Value("${spring.mail.nickname}")
    private String nickname;
    // 获取验证码
    @GetMapping("/code")
    public boolean getCode(@RequestParam("email")String email,HttpSession session){
        SimpleMailMessage message = new SimpleMailMessage();
        message.setFrom(nickname + '<' + sender + '>');
        message.setTo(email);
        message.setSubject("欢迎访问东方");
 
        // 使用 hutool-all 生成 6 位随机数验证码
        String code = RandomUtil.randomNumbers(6);
        session.setAttribute("email", code);
        String content = "【验证码】您的验证码为：" + code + " 。 3分钟内有效，请勿泄露和转发。如非本人操作，请忽略此短信。\n\n\n";
        message.setText(content);
        mailSender.send(message);
        return true;
    }
    // 注册账号
    @PostMapping("/SignIn")
    public boolean UserSignIn(@RequestParam("userName")String userName,
                              @RequestParam("password")String password,
                              @RequestParam("mailbox")String mailbox,
                              @RequestParam("Verification")String Verification,
                              HttpSession session){
        // 通过 session 获取验证码
        String SignInEmail = (String)session.getAttribute("email");
        // 如果用户名存在返回 false
        if(userService.selectByUsername(userName)!= null)return false;
        // 验证码为空返回 false
        if(SignInEmail == null) return false;
        // 验证码对得上才进行插入操作，并返回 true
        if(SignInEmail.equals(Verification)){
            userService.AddUser(userName,password,mailbox);
            return true;
        }
        return false;
    }

前端

login.html

<!DOCTYPE html>
<html lang="en">
 
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>登入</title>
    <link rel="stylesheet" href="css/bootstrap.min.css" rel="external nofollow"  rel="external nofollow" >
    <link rel="stylesheet" href="css/login.css" rel="external nofollow"  rel="external nofollow" >
    <script type="text/javascript" src="js/jquery.min.js"></script>
</head>
 
<body>
<div class="container-login">
    <div class="container-pic">
        <img src="pic/computer.png" width="350px">
    </div>
    <div class="login-dialog">
        <h3>登陆</h3>
        <div class="row">
            <span>用户名</span>
            <input type="text" name="userName" id="userName" class="form-control">
        </div>
        <div class="row">
            <span>密码</span>
            <input type="password" name="password" id="password" class="form-control">
        </div>
        <div class="row">
            <button type="button" class="btn btn-info btn-lg" onclick="login()">登录</button>
        </div>
        <div class="row">
            <button type="button" class="btn btn-info btn-lg" onclick="Signin()">注册</button>
        </div>
    </div>
</div>
<script src="js/jquery.min.js"></script>
<script>
    function login() {
        $.ajax({
            type: "post",
            url: "/User/login",
            data: {
                name: $("#userName").val(),
                password: $("#password").val()
            },
            success: function(result){
                if(result){
                    //登录成功
                    location.href = "index.html";
                }else{
                    alert("账号或密码错误");
                }
            }
        });
    }
</script>
 
<script>
    function Signin(){
        window.location.href="Signin.html" rel="external nofollow" ;
    }
</script>
 
</body>
 
</html>

Signin.html

<!DOCTYPE html>
<html lang="en">
 
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>注册</title>
    <link rel="stylesheet" href="css/bootstrap.min.css" rel="external nofollow"  rel="external nofollow" >
    <link rel="stylesheet" href="css/login.css" rel="external nofollow"  rel="external nofollow" >
    <script type="text/javascript" src="js/jquery.min.js"></script>
</head>
 
<body>
<div class="container-login">
    <div class="container-pic">
        <img src="pic/computer.png" width="350px">
    </div>
    <div class="login-dialog">
        <h3>注册</h3>
        <div class="row">
            <span>用户名</span>
            <input type="text" name="userName" id="userName" class="form-control">
        </div>
 
        <div class="row">
            <span>密码</span>
            <input type="password" name="password" id="password" class="form-control">
        </div>
 
        <div class="row">
            <span>邮箱</span>
            <input type="mailbox" name="mailbox" id="mailbox" class="form-control">
        </div>
 
        <input type="button" value="发送验证码" id="email" onclick="jump()">
 
        <div class="row">
            <span>验证码</span>
            <input type="Verification" name="Verification" id="Verification" class="form-control">
        </div>
        <div class="row">
            <button type="button" class="btn btn-info btn-lg" onclick="SignIn()">注册</button>
        </div>
    </div>
</div>
 
<script src="js/jquery.min.js"></script>
 
<script>
        function SignIn() {
            $.ajax({
                type: "post",
                url: "/email/SignIn",
                data: {
                    userName: $("#userName").val(),
                    password: $("#password").val(),
                    mailbox: $("#mailbox").val(),
                    Verification: $("#Verification").val(),
                },
                success: function(result){
                    if(result){
                        alert("注册成功");
                        location.href = "login.html";
                    }else{
                        alert("注册失败");
                    }
                }
            });
            }
</script>
 
 
<script>
    function jump() {
        $.ajax({
            type: "get",
            url: "/email/code",
            data: {
                email: $("#mailbox").val()
            },
            success: function (result) {
                if (result) alert("验证码发送成功");
            }
        });
    }
</script>
 
</body>
 
</html>

到此这篇关于基于SpringBoot实现QQ邮箱验证码注册功能的文章就介绍到这了,更多相关SpringBoot QQ邮箱验证码注册内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家！

您可能感兴趣的文章:

Netty分布式ByteBuf使用directArena分配缓冲区过程解析
这篇文章主要介绍了Netty分布式ByteBuf使用directArena分配缓冲区过程解析，有需要的朋友可以借鉴参考下，希望能够有所帮助，祝大家多多进步，早日升职加薪
2022-03-03
Java Swing实现画板的简单操作
这篇文章主要介绍了Java Swing实现画板的简单操作，修改颜色，更改图形，清除，任务栏按钮，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
2022-06-06
Jenkins自动部署SpringBoot项目实践教程
这篇文章主要介绍了Jenkins自动部署SpringBoot项目实践教程，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教
2021-11-11
Java Web项目中如何添加Tomcat的Servlet-api.jar包(基于IDEA)
servlet-api.jar是在编写servlet必须用到的jar包下面这篇文章主要给大家介绍了基于IDEAJava Web项目中如何添加Tomcat的Servlet-api.jar包的相关资料,文中通过图文介绍的非常详细,需要的朋友可以参考下
2024-04-04
利用Spring Boot操作MongoDB的方法教程
mongodb是最早热门非关系数据库的之一，使用也比较普遍，一般会用做离线数据分析来使用，放到内网的居多，下面这篇文章主要给大家介绍了利用Spring Boot操作MongoDB的方法教程,需要的朋友可以参考下
2017-05-05
基于RabbitMQ几种Exchange 模式详解
下面小编就为大家带来一篇基于RabbitMQ几种Exchange 模式详解。小编觉得挺不错的，现在就分享给大家，也给大家做个参考。一起跟随小编过来看看吧
2017-11-11
Java垃圾回收器的方法和原理总结
本篇文章主要介绍了Java垃圾回收器的方法和原理总结，Java垃圾回收器是Java虚拟机的重要模块，具有一定的参考价值，有兴趣的可以了解一下。
2016-12-12
Java实现汉字转全拼音的方法总结
在软件开发中,经常会遇到需要将汉字转换成拼音的场景,比如在搜索引擎优化、数据存储、国际化等方面,Java作为一种广泛使用的编程语言,提供了多种方法来实现汉字到拼音的转换,本文将详细介绍几种常用的Java汉字转全拼音的方法,并提供具体的代码示例和步骤
2024-12-12
基于Calendar获取当前时间的性能比较
这篇文章主要介绍了Calendar获取当前时间的性能比较，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教
2021-06-06
SpringBoot+Redis布隆过滤器防恶意流量击穿缓存
本文主要介绍了SpringBoot+Redis布隆过滤器防恶意流量击穿缓存，文中根据实例编码详细介绍的十分详尽，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
2022-03-03