如何在springboot+vue项目中整合qq邮箱发送验证码实现登陆、注册、修改密码等功能(超简单无脑复制粘贴版)(后端部分)

900 阅读5分钟

 引言

很多小伙伴在做项目时需要加入账号的登录、注册、修改密码等功能,但是还想让自己的功能“略显高级”,这时很多小伙伴就想到了自己注册账号时会在手机发送验证码的功能,于是便想融入到自己的项目,又因为通过手机号发送验证码会牵扯到收费问题,所以很大一部分人为了实现这个功能会选择qq邮箱发送验证码

本文讲解qq邮箱发送验证码实现账号的登录、注册、找回密码等功能,会对部分代码进行解释,当然,如果大家着急用,可以无脑复制粘贴文章内容

注:对于前端部分此功能的讲解,请移步我的另一篇博客:

如何在springboot+vue项目中整合qq邮箱发送验证码实现登陆、注册、修改密码等功能(超简单无脑复制粘贴版)(前端部分) - 掘金 (juejin.cn)

一、QQ邮箱配置

1.进入自己的QQ邮箱(此邮箱就是以后向用户发送验证码的邮箱),依次打开设置-->常规-->第三方服务-->开启IMAP/SMTP服务

​编辑

2.点击“生成授权码” ,验证完身份后获取授权码,这里获取的授权码还会在springboot工程中使用

格式类似于—— dswascqkxeegdbhi

小贴士: 这里保存一下,不然以后使用还是要验证身份才可以拿到授权码

二、配置工作

1.XML文件的依赖引入

在你的项目XML文件中输入以下代码,用于引入qq邮箱发送验证码所需要的依赖,这里可以无脑抄作业

        <!--   qq邮箱-->
        <dependency>
            <groupId>com.sun.mail</groupId>
            <artifactId>javax.mail</artifactId>
            <version>1.6.2</version> <!-- 或者使用最新版本 -->
        </dependency>
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-mail</artifactId>
            <version>3.0.0</version> <!-- 或者使用与项目兼容的版本 -->
        </dependency>
        <dependency>
            <groupId>jakarta.mail</groupId>
            <artifactId>jakarta.mail-api</artifactId>
            <version>2.1.3</version> <!-- 确保版本一致 -->
        </dependency>

2.项目的配置文件(我这里使用的是.yml文件)

进行如下配置

  mail:
    host: smtp.qq.com
    port: 587
    username: 3692625314@qq.com
    password: dswascqkxeegdbhi
    properties:
      mail:
        smtp:
          auth: true
          starttls:
            enable: true

值得注意的是,这里的username要填自己的qq邮箱,password要填自己生成的授权码(不要填写你的QQ密码) ,剩下的可以直接复制粘贴

3.项目的配置类

如果你有类似于config的包,包下有一个WebMvcConfiguration的类,请在里面加上如下配置

如果你没有这个包和类,就把这段代码放到配置拦截器的那个文件里面

//qq邮箱验证码发送
    @Bean
    public JavaMailSender javaMailSender() {
        JavaMailSenderImpl mailSender = new JavaMailSenderImpl();
        // 配置邮件服务的相关信息
        mailSender.setHost("smtp.qq.com");
        mailSender.setPort(587);
        mailSender.setUsername("3692625314@qq.com");
        mailSender.setPassword("dswascqkxeegdbhi");

        Properties props = mailSender.getJavaMailProperties();
        props.put("mail.transport.protocol", "smtp");
        props.put("mail.smtp.auth", "true");
        props.put("mail.smtp.starttls.enable", "true");
        props.put("mail.debug", "true");

        return mailSender;
    }

}

相同的,记得改一下QQ邮箱和授权码

4.拦截器的配置

因为发送验证码的方法大部分情况下是在没有登录的情况下被调用的,如登录、注册、修改密码,所以我们要防止其被拦截器拦截,这里“/auth/**”便是所有与qq邮箱发验证码相关的方法,你的有可能不同

只需找到拦截器的配置,加入以下代码

    protected void addInterceptors(InterceptorRegistry registry) {

        registry.addInterceptor(loginCheckInterceptor)
                .addPathPatterns("/user/**")
                .excludePathPatterns("/user/login")
                .excludePathPatterns("/user/avatar")
                .excludePathPatterns("/user/register")
                .excludePathPatterns("/user/changePasswordByEmail")
                .excludePathPatterns("/auth/**");


    }

注意,这里loginCheckInterceptor换成你自己定义的拦截器

三、代码编写

1.controller层

找到你的controller层,新建一个AuthController类,里面放的便是与QQ邮箱发送验证码相关的controller层代码,在文件中加入以下代码

注:代码中的Result 类,是封装的放回给前端特定数据格式的类,你的项目可能有所不同

@RestController
@RequestMapping("/auth")
public class AuthController {

    @Autowired
    private EmailService emailService;
    private Map<String, String> verificationCodes = new HashMap<>(); // 存储验证码
    @PostMapping("/send-code")
    public Result sendVerificationCode(@RequestParam String email) {
        String code = emailService.sendVerificationCode(email);
        verificationCodes.put(email, code); // 存储验证码
        return Result.success("验证码已发送到邮箱");
    }

    @PostMapping("/verify-code")
    public Result verifyCode(@RequestParam String email, @RequestParam String code) {
        String storedCode = verificationCodes.get(email);
        if (storedCode != null && storedCode.equals(code)) {
            verificationCodes.remove(email); // 验证成功后移除验证码
            return Result.success("验证码验证成功");
        } else {
            return Result.success("验证码错误或已过期");
        }
    }
}

显而易见,sendVerificationCode()是发送验证码的方法,而verifyCode是验证验证码是否有效的方法,verificationCodes 则是存储验证码的一个Map集合,里面有email和code两个键,保证了邮箱和验证码的绑定关系,而且在验证完一次验证码后,验证码失效

2.service层

找到你的service层,新建一个EmailService的类,加入以下代码

@Service
public class EmailService {

    @Autowired
    private JavaMailSender mailSender;

    public String sendVerificationCode(String to) {
        String code = generateVerificationCode();
        SimpleMailMessage message = new SimpleMailMessage();
        message.setFrom("3692625314@qq.com"); // 设置发件人地址
        message.setTo(to);
        message.setSubject("您的验证码");
        message.setText("您的验证码是: " + code);
        mailSender.send(message);

        return code; // 可以将验证码存储在内存中或数据库中以便后续验证
    }

    private String generateVerificationCode() {
        Random random = new Random();
        return String.format("%06d", random.nextInt(1000000)); // 生成6位验证码
    }
}

这里便是发送验证码处理的过程,这些方法都是QQ邮箱提供的方法,我们不用去深究其底层,知道每个方法是干什么的就可以了

其中生成的验证码是使用随机数生成的六位验证码

四、测试成果

只要完成了上述的任务,后端的任务也就完成了,下面我们来测试以下接口是否可用

1.发送验证码

​编辑

注:请求方法记得改为"POST"

这里可以看到已经发送成功了

2.验证验证码

​编辑

验证码验证成功!

五、结语

本文给大家讲解了如何在springboot后端工程整合qq邮箱发送验证码的功能,希望能帮助到大家,相应的前端交互部分我会放在我的下一篇博客

如何在springboot+vue项目中整合qq邮箱发送验证码实现登陆、注册、修改密码等功能(超简单无脑复制粘贴版)(前端部分) - 掘金 (juejin.cn)

大家拜拜!(看完就赞,养成习惯)