springBoot傳送郵件（驗證碼，5分鐘過期）超級詳細，供大家參考，具體內容如下

自己百度了很久，終於成功了，這裡記錄一下過程

1.選擇郵箱（這裡選用163郵箱）

首先在網頁登入在設定裡面開啟POP3/SMTP服務

在application.yaml中配置

要注意的就是這裡的password是授權碼而不是密碼！！！如果使用qq郵箱把host改為smtp.qq.com

2.關於驗證碼的工具類

 private static final String SYMBOLS = "0123456789";
 /**
  * Math.random生成的是一般隨機數，採用的是類似於統計學的隨機數生成規則，其輸出結果很容易預測，因此可能導致被攻擊者擊中。
  * 而SecureRandom是真隨機數，採用的是類似於密碼學的隨機數生成規則，其輸出結果較難預測，若想要預防被攻擊者攻擊，最好做到使攻擊者根本無法，或不可能鑑別生成的隨機值和真正的隨機值。
  */
 private static final Random RANDOM = new SecureRandom();

 public static String generateVerCode() {
  char[] nonceChars = new char[6];
  for (int i = 0; i < nonceChars.length; i++) {
   nonceChars[i] = SYMBOLS.charAt(RANDOM.nextInt(nonceChars.length));
  }
  return new String(nonceChars);
 }

 /**
  *計算兩個日期的分鐘差
  */
 public static int getMinute(Date fromDate,Date toDate) {
  return (int) (toDate.getTime() - fromDate.getTime()) / (60 * 1000);

3.services模組

 /**
  * 傳送驗證碼到指定郵箱
  * @param sender 傳送地址
  * @param mailSender spring自帶
  * @param receiver 接受地址
  */
 AdvanceResponse getCode(String sender,JavaMailSenderImpl mailSender,String receiver);
 /**
  * 註冊使用者
  */
 AdvanceResponse addUser(User user,String verCode);

AdvanceResponse是自己封裝的返回物件，可以無視

/**
 * 驗證碼
*/
private String code;
/**
 * 傳送時間
*/
private Date sendTime;
 @Override
 @Async
 public AdvanceResponse getCode(String sender,String receiver) {
  SimpleMailMessage message = new SimpleMailMessage();
  message.setSubject("驗證碼");//設定郵件標題
  code = VerCodeGenerateUtil.generateVerCode();
  sendTime = new Date();
  message.setText("尊敬的使用者,您好:\n"
    + "\n本次請求的郵件驗證碼為:" + code + ",本驗證碼5分鐘內有效，請及時輸入。（請勿洩露此驗證碼）\n"
    + "\n如非本人操作，請忽略該郵件。\n(這是一封自動傳送的郵件，請不要直接回復）"); //設定郵件正文
  message.setFrom(sender);//發件人
  message.setTo(receiver);//收件人
  mailSender.send(message);//傳送郵件
  return AdvanceResponse.successResponse();
 }

 @Override
 public AdvanceResponse addUser(User user,String verCode) {
  Date date = new Date();
  //判斷驗證碼
  if (VerCodeGenerateUtil.getMinute(sendTime,date) > 5) {
   return AdvanceResponse.failedResponse("驗證碼已經失效！！！");
  }
  if (!verCode.equals(code)) {
   return AdvanceResponse.failedResponse("驗證碼不正確！！！");
  }
  user.setRole(0);
  user.setCreateTime(date);
  user.setUpdateTime(date);
  userDao.insert(user);
  code = null;
  return AdvanceResponse.successResponse();
 }

@Async表示非同步，可以在郵件未傳送完成時就返回，而不必等待太長時間，必須在總配置類上加@EnableAsync註解才可以生效

4.controller模組

@Autowired
 private UserService userService;
 @Autowired
 private JavaMailSenderImpl mailSender;
 @Value("${spring.mail.username}")
 private String sender;
 
 /**
  * 傳送驗證碼到指定郵箱
  */
 @GetMapping("/verCode")
 public AdvanceResponse verCode(String receiver) {
  return userService.getCode(sender,mailSender,receiver);
 }

 /**
  * 註冊使用者
  */
 @PostMapping("/addUser")
 public AdvanceResponse addUser(User user,String sender,@RequestParam("verCode") String verCode) {
  return userService.addUser(user,verCode);
 }

基本上後端就完成了，在來看看前端

5.前端介面

 <div class="layui-form-item">
    <label for="email" class="layui-form-label">
     <span class="x-red">*</span>郵箱
    </label>
    <div class="layui-input-inline">
     <input type="email" id="email" name="email" required="" lay-verify="email"
       autocomplete="off" class="layui-input">
    </div>
    <div class="layui-form-mid layui-word-aux">
     <span class="x-red" id="emailMsg"></span>
    </div>
    <button type="button" class="layui-btn" id="code">獲取驗證碼</button>
   </div>
   <div class="layui-form-item">
    <label for="verCode" class="layui-form-label">
     <span class="x-red">*</span>驗證碼
    </label>
    <div class="layui-input-inline">
     <input type="text" id="verCode" name="verCode" required=""
       autocomplete="off" class="layui-input">
    </div>
    <div class="layui-form-mid layui-word-aux">
     <span class="x-red" id="verCodeMsg"></span>
    </div>
</div>

前端使用了layui，只關注input表單即可

接下來是js程式碼

 //獲取驗證碼
 $('#code').click(function () {
  const email = $('#email').val();
  const myReg = /^[a-zA-Z0-9_-]+@([a-zA-Z0-9]+\.)+(com|cn|net|org)$/;
  if (email === null || email.length === 0) {
   layer.msg('郵箱不能為空！',{time: 1500,icon: 5,shift: 6});
   return false;
  }
  if (!myReg.test(email)) {
   layer.msg('郵箱格式不正確！',shift: 6});
   return false;
  }
  $.ajax({
   type: 'GET',url: 'user/verCode',data: {
    'receiver': email
   },beforeSend: function () {
    loading = layer.msg('處理中',{icon: 16})
   },success: function () {
    layer.close(loading);
   }
  })
 });
 //這是提交表單，只保留關鍵部分
 $.ajax({
   type: 'POST',url: 'user/addUser',data: formData,cache: false,// 不快取
   processData: false,// jQuery不要去處理髮送的資料
   contentType: false,// jQuery不要去設定Content-Type請求頭
   beforeSend: function () {
    loading = layer.msg('處理中',success: function (result) {
    if (result.status === 0) {
     layer.msg(result.msg,shift: 6});
    } else {
     layer.close(loading);
     xadmin.close();
    }
   }
  })

基本上全部完成！

以上就是本文的全部內容，希望對大家的學習有所幫助，也希望大家多多支援我們。