本项目采用免费QQ邮箱验证码方式进行登录安全的校验。

前期工作

申请邮箱安全授权码

打开QQ邮箱官网点击设置

进入设置页面后点击账户按钮

 进入账户后一直往下拉页面找到POP3服务栏，然后点击管理服务（如果没有开启服务需要先开启服务，按照邮箱提示操作即可）

进入管理服务页面后如果没有授权码，点击生成授权码，如果有即可进入授权码管理页面查看。

授权码过一段时间会自动过期，需要重新申请。

 

项目中导入邮箱依赖

复制以下maven坐标到项目中，maven会自动导入其他依赖的坐标

	<!--邮箱-->
        <dependency>
          <groupId>org.apache.commons</groupId>
          <artifactId>commons-email</artifactId>
          <version>1.5</version>
        </dependency>

定义配置类

完整代码如下，有注解，我将需要修改的地方单独列在后面

import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;

import javax.mail.*;
import javax.mail.internet.AddressException;
import javax.mail.internet.InternetAddress;
import javax.mail.internet.MimeMessage;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import javax.servlet.http.HttpSession;
import java.io.IOException;
import java.util.Properties;
import java.util.Random;

@Controller
public class MailcodeServlet extends HttpServlet {
	private static final long serialVersionUID = 1L;

	// 得到随机的字符串，用于发送验证码的内容
	public String getNumbers(int size) {
		String str = "ABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789";
		String numString = "";
		Random r = new Random();
		for (int i = 0; i < size; i++) {
			char c = str.charAt(r.nextInt(str.length()));
			numString = numString + c;
		}
		return numString;
	}
	@RequestMapping("/email")
	public void email(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
//		response.setCharacterEncoding("UTF-8");
		// 设置返回的编码格式，同时设置客户端和服务端的编码格式
		response.setContentType("application/json; charset=UTF-8");

		String email = request.getParameter("email");
		System.out.println("email" + email);

		String emailString = getNumbers(5);
		System.out.println("验证码" + emailString);

		HttpSession session = request.getSession();

		session.setAttribute("email", email);
		session.setAttribute("emailString", emailString);


		// 创建Properties类用于记录邮箱的一些属性
		Properties props = new Properties();
		// 表示SMTP发送邮件，必须进行身份验证
		props.put("mail.smtp.auth", "true");
		// 此处填写SMTP服务器
		props.put("mail.smtp.host", "smtp.qq.com");
		// 端口号，QQ邮箱端口465或587
		props.put("mail.smtp.port", "587");
		// 此处填写，写信人的账号
		props.put("mail.user", "3131019721@qq.com");
		// 此处填写16位STMP口令
		props.put("mail.password", "qzsmlbypynsedc");

		// 构建授权信息，用于进行SMTP进行身份验证
		Authenticator authenticator = new Authenticator() {
			protected PasswordAuthentication getPasswordAuthentication() {
				// 用户名、密码
				String userName = props.getProperty("mail.user");
				String password = props.getProperty("mail.password");
				return new PasswordAuthentication(userName, password);
			}
		};
		// 使用环境属性和授权信息，创建邮件会话
		Session mailSession = Session.getInstance(props, authenticator);
		// 创建邮件消息
		MimeMessage message = new MimeMessage(mailSession);
		try {
			// 设置发件人
			InternetAddress form = new InternetAddress(props.getProperty("mail.user"));
			message.setFrom(form);
			// 设置收件人的邮箱
			InternetAddress to = new InternetAddress(email);
			message.setRecipient(MimeMessage.RecipientType.TO, to);
			// 设置邮件标题
			message.setSubject("资产管理系统验证码");
			// 设置邮件内容体
			message.setContent("验证码：" + emailString, "text/html;charset=UTF-8");
			// 发送邮件
			Transport.send(message);
			response.getWriter().write("{\"message\": \"验证码已发送，请查收！\"}");
		} catch (AddressException e) {
			session.setAttribute("messagesigh", "邮箱输入有误");
			e.printStackTrace();
			response.getWriter().write("{\"message\": \"发送验证码失败！\"}");
		} catch (MessagingException e) {
			session.setAttribute("messagesigh", "邮箱输入有误");
			e.printStackTrace();
			response.getWriter().write("{\"message\": \"发送验证码失败！\"}");
		}
	}
}

需要修改的地方，只需将写信人的账户改成自己的，然后在STMP口令，也就是申请的授权码复制即可。

	// 此处填写，写信人的账号
		props.put("mail.user", "3131019721@qq.com");
	// 此处填写16位STMP口令
		props.put("mail.password", "qzsmlbypynsedc");

前端Ajax代码

<!-- 验证码输入框 -->
	<div class="form-group has-feedback">
		<input required type="text" name="captcha" class="form-control" id="captcha" placeholder="验证码">
		<span class="glyphicon glyphicon-question-sign form-control-feedback"></span>
	</div>
<!-- 发送验证码的按钮 -->
	<div class="form-group">
		<button type="button" class="btn btn-success" id="send-code">发送验证码</button>
	</div>


<!-- jQuery代码 -->

$(document).ready(function() {
			$('#send-code').click(function(e) {
				e.preventDefault(); // 防止表单的默认提交行为
                //获取输入框邮箱值
				var email = $('#email').val();
                //邮箱格式校验
				var emailPattern = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
				if (emailPattern.test(email)) {
					$.ajax({
						url: '/email',
						type: 'POST',
						data: { email: email},
						dataType: 'json',
						success: function(response) {
								console.log(response)
						},
						error: function(e) {
							console.log(e)
						}
					});
				} else {
						console.log("输入错误")
				}
			});
		});