【SpringBoot商城秒杀系统项目实战09】使用两次MD5实现登录功能

两次MD5:

  1. 用户端:PASS=MD5(明文+固定Salt)

  2. 服务端:PASS=MD5(用户输入处理+随机Salt)

    登录界面:
    在这里插入图片描述
    数据库里面存的是做了两次MD5的用户密码与其对应的salt值
    在这里插入图片描述
    现在我们登录的时候,要去取得数据库里面对应用户的密码和salt值,然后后台接收了前端做了一次MD5的密码formPass,然后将这个formPass去和数据库里面的salt一起再做一次MD5,然后检测是否与数据库里面存的那个密码一致。

问题引用:

第二次MD5所用的随机saltDB为什么要保存在数据库里?
当数据库被侵入,做MD5之后的密码和saltDB一起被盗的话,用户密码不就泄露了吗?
但是如果不保存这个随机的saltDB,下次用户登录的时候不就没法和数据库保存的密码进行校验了吗?

问题思考:
实际上做MD5也不是绝对安全的,但是我们可以使得破解的难度指数级增长md5是不可逆的,不能反向解密的,网上所谓的“解密”都是把“加密”结果存储到数据库再比对的只能暴力破解,即有一个字典,从字典中读取一条记录,将密码用加salt盐值做MD5来对比数据库里面的值是否相等。

因为好事者收集常用的密码,然后对他们执行 MD5,然后做成一个数据量非常庞大的数据字典,然后对泄露的数据库中的密码进行对比,如果你的原始密码很不幸的被包含在这个数据字典中,那么花不了多长时间就能把你的原始密码匹配出来,这个数据字典很容易收集,假设有600w个密码。坏人们可以利用他们数据字典中的密码,加上我们泄露数据库中的 Salt,然后散列,然后再匹配。

但是由于我们的 Salt 是随机产生的,每条数据都要加上 Salt 后再散列,假如我们的用户数据表中有 30w 条数据,数据字典中有 600w 条数据,坏人们如果想要完全覆盖的话,他们就必须加上 Salt 后再散列的数据字典数据量就应该是 300000* 6000000 = 1800000000000,所以说干坏事的成本太高了吧。但是如果只是想破解某个用户的密码的话,只需为这 600w 条数据加上 Salt,然后散列匹配。可见 Salt 虽然大大提高了安全系数,但也并非绝对安全

实际项目中,Salt 不一定要加在最前面或最后面,也可以插在中间嘛,也可以分开插入,也可以倒序,程序设计时可以灵活调整,都可以使破解的难度指数级增长。

引入文章:https://www.xttblog.com/?p=986

步骤:

  1. 创建秒杀User的domain类
	public class MiaoshaUser {
	private Long id;
	private String nickname;
	private String pwd;
	private String salt;
	private String head;
	private Date registerDate;
	private Date lastLoginDate;
	private Integer loginCount;
	
	public String getPwd() {
		return pwd;
	}
	public void setPwd(String pwd) {
		this.pwd = pwd;
	}
	public Long getId() {
		return id;
	}
	public void setId(Long id) {
		this.id = id;
	}
	public String getNickname() {
		return nickname;
	}
	public void setNickname(String nickname) {
		this.nickname = nickname;
	}
	
	public String getSalt() {
		return salt;
	}
	public void setSalt(String salt) {
		this.salt = salt;
	}
	public String getHead() {
		return head;
	}
	public void setHead(String head) {
		this.head = head;
	}
	public Date getRegisterDate() {
		return registerDate;
	}
	public void setRegisterDate(Date registerDate) {
		this.registerDate = registerDate;
	}
	public Date getLastLoginDate() {
		return lastLoginDate;
	}
	public void setLastLoginDate(Date lastLoginDate) {
		this.lastLoginDate = lastLoginDate;
	}
	public Integer getLoginCount() {
		return loginCount;
	}
	public void setLoginCount(Integer loginCount) {
		this.loginCount = loginCount;
	}
  1. 新建MiaoshaUserDao
	@Mapper
	public interface MiaoshaUserDao {
	@Select("select * from miaosha_user where id=#{id}")  //这里#{id}通过后面参数来为其赋值
	public MiaoshaUser getById(@Param("id")long id);    //绑定
	
	//绑定在对象上面了----@Param("id")long id,@Param("pwd")long pwd 效果一致
	@Update("update miaosha_user set pwd=#{pwd} where id=#{id}")
	public void update(MiaoshaUser toupdateuser);	
	//public boolean update(@Param("id")long id);    //绑定	
}
  1. 新建MiaoshaUserService
	@Service
	public class MiaoshaUserService {
	public static final String COOKIE1_NAME_TOKEN="token";
	
	@Autowired
	MiaoshaUserDao miaoshaUserDao;
	@Autowired
	RedisService redisService;
	/**
	 * 根据id取得对象,先去缓存中取
	 * @param id
	 * @return
	 */
	public MiaoshaUser getById(long id) {
		//1.取缓存	---先根据id来取得缓存
		MiaoshaUser user=redisService.get(MiaoshaUserKey.getById, ""+id, MiaoshaUser.class);
		//能再缓存中拿到
		if(user!=null) {
			return user;
		}
		//2.缓存中拿不到,那么就去取数据库
		user=miaoshaUserDao.getById(id);
		//3.设置缓存
		if(user!=null) {
			redisService.set(MiaoshaUserKey.getById, ""+id, user);
		}
		return user;
	}
	}
  1. 新建LoginController
	@RequestMapping("/login")
	@Controller
	public class LoginController{
	@Autowired
	UserService userService;
	@Autowired
	RedisService redisService;
	@Autowired
	MiaoshaUserService miaoshaUserService;	
	//slf4j
	private static Logger log=(Logger) LoggerFactory.getLogger(Logger.class);	
	@RequestMapping("/to_login")
	public String toLogin() {
		return "login";// 返回页面login
	}
	@RequestMapping("/do_login") // 作为异步操作
	@ResponseBody
	public CodeMsg doLogin(LoginVo loginVo) {// 0代表成功
		// log.info(loginVo.toString());
		if (loginVo == null) {
			return CodeMsg.SERVER_ERROR;
		}
		// 验证
		String formPass = loginVo.getPassword();
		String mobile = loginVo.getMobile();
		// 验证用户
		MiaoshaUser user = miaoshaUserService.getById(Long.parseLong(mobile));
		if (user == null) {
			return CodeMsg.MOBILE_NOTEXIST;
		}
		// 验证密码
		String dbPass = user.getPwd();
		String dbSalt = user.getSalt();
		System.out.println("dbPass:" + dbPass + "   dbSalt:" + dbSalt);
		// 验证密码,计算二次MD5出来的pass是否与数据库一致
		String tmppass = MD5Util.formPassToDBPass(formPass, dbSalt);
		System.out.println("formPass:" + formPass);
		System.out.println("tmppass:" + tmppass);
		if (!tmppass.equals(dbPass)) {
			return CodeMsg.PASSWORD_ERROR;
		}
		return CodeMsg.SUCCESS;
	}
}
  1. 前端login.html

    引入bootstrap
    引入相关的js和css

核心代码:
(最下面有完整的代码)

		var pass=$("#password").val();
				//pass='111111';
				//固定salt
				var salt='1a2b3c4d';
				var str=""+salt.charAt(0)+salt.charAt(2)+pass+salt.charAt(5)+salt.charAt(4);
				var password=md5(str);
				//alert(salt);
				//alert(pass);
				//alert(password);
				//与后台Md5规则一致
				//var str=""+salt.charAt(0)+salt.charAt(2)+formPass+salt.charAt(5)+salt.charAt(4);
				$.ajax({
					url:"/login/do_login",
					type:"POST",
					data:{
						mobile:$("#phone").val(),
						password:password,
					},
					success:function(data){
						if(data.code==0){
							alert("success");
							//成功后跳转
							window.location.href="/goods/to_list";
						}else{
							alert(data.msg);
						}
					},
					error:function(data){
						alert("error");
						//alert(data.msg);
					}
				});

完整的前端login.html代码:

<!DOCTYPE html>
<!-- 使用thymeleaf,配置相应的 -->
<html xmlns:th="http://www.thymeleaf.org">  <!-- th!!! 命名空间使用 -->
<head>
<meta charset="UTF-8"/><!--<meta charset="UTF-8" />  thymeleaf模板引擎默认是Template modes:HTML5解析的,所以解析比较严格。  -->
	<title>登录</title>
	<!-- thymeleaf引入静态资源的方式,@加大括弧    "/" 代表static路径-->
	<!-- jquery -->
	<!-- <script type="text/javascript" th:src="@{/js/jequery.min.js}"></script> -->
	<script type="text/javascript" th:src="@{/jquery-validation/lib/jquery-1.11.1.js}"></script>
	<!-- bootstrap -->
	<!-- <link type="text/css" rel="stylesheet" th:href="@{/bootstrap/css/bootstrap.min.css}"/> -->
	<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.0/css/bootstrap.min.css" integrity="sha384-9gVQ4dYFwwWSjIDZnLEWnxCjeSWFphJiwGPXr1jddIhOegiu1FwO5qRGvFXOdJZ4" crossorigin="anonymous"/>	
	<script type="text/javascript" th:src="@{/bootstrap/js/bootstrap.min.js}"></script>
	<!--jquery-validator  -->
	<script type="text/javascript" th:src="@{/jquery-validation/jquery.validate.min.js}"></script>	
	<!-- <script type="text/javascript" th:src="@{/jquery-validation/jquery.validate.js}"></script> -->	  
	<script type="text/javascript" th:src="@{/jquery-validation/localization/messages_zh.min.js}"></script>
	<!-- layer -->
	<script type="text/javascript" th:src="@{/layer/layer.js}"></script>
	<!-- md5.js -->
	<script type="text/javascript" th:src="@{/js/md5.min.js}"></script>
</head>
<body>
	<div class="container">
		<div class="row">
			<div class="col-sm-8 offset-sm-2">
				<div class="border-bottom mb-4 mt-4 pb-2">
					
				</div>
				<div class="card">
					<div class="card-header">
						<h6 class="card-text">Simple Form</h6><!--</h3>  -->
					</div>
					<div class="card-body">
						<form id="signupForm"  method="post" class="form-horizontal" ><!-- action="" -->
							<div class="form-group row">
								<label class="col-sm-4 col-form-label" for="phone">Phone</label>
								<div class="col-sm-6">
									<input type="text" class="form-control" id="phone" name="phone" placeholder="phone" />
								</div>
							</div>
						
							
							<div class="form-group row">
								<label class="col-sm-4 col-form-label" for="username">Username</label>
								<div class="col-sm-6">
									<input type="text" class="form-control" id="username" name="username" placeholder="Username" />
								</div>
							</div>
							<div class="form-group row">
								<label class="col-sm-4 col-form-label" for="email">Email</label>
								<div class="col-sm-6">
									<input type="text" class="form-control" id="email" name="email" placeholder="Email" />
								</div>
							</div>

							<div class="form-group row">
								<label class="col-sm-4 col-form-label" for="password">Password</label>
								<div class="col-sm-6">
									<input type="password" class="form-control" id="password" name="password" placeholder="Password" />
								</div>
							</div>

							<div class="form-group row">
								<label class="col-sm-4 col-form-label" for="confirm_password">Confirm password</label>
								<div class="col-sm-6">
									<input type="password" class="form-control" id="confirm_password" name="confirm_password" placeholder="Confirm password" />
								</div>
							</div>
							<div class="form-group row">
								<div class="col-sm-6 offset-sm-4">
									<div class="form-check">
										<input type="checkbox" id="agree" name="agree" value="agree" class="form-check-input"/>
										<label class="form-check-label">Please agree to our policy</label>
									</div>
								</div>
							</div>

							<div class="form-group row">
								<div class="col-sm-9 offset-sm-4">
									<button type="submit" class="btn btn-primary" name="signup" value="Sign up">Sign up</button>
								</div>
							</div>
						</form>
					</div>
				</div>
			</div>
		</div>
	</div>
	<script type="text/javascript">
		$.validator.setDefaults( {
			submitHandler: function () {
				var pass=$("#password").val();
				//pass='111111';
				var salt='1a2b3c4d';
				var str=""+salt.charAt(0)+salt.charAt(2)+pass+salt.charAt(5)+salt.charAt(4);
				var password=md5(str);
				//alert(salt);
				//alert(pass);
				//alert(password);
				//与后台Md5规则一致
				//var str=""+salt.charAt(0)+salt.charAt(2)+formPass+salt.charAt(5)+salt.charAt(4);
				$.ajax({
					url:"/login/do_login",
					type:"POST",
					data:{
						mobile:$("#phone").val(),
						password:password,
					},
					success:function(data){
						if(data.code==0){
							alert("success");
							//成功后跳转
							window.location.href="/goods/to_list";
						}else{
							alert(data.msg);
						}
					},
					error:function(data){
						alert("error");
						//alert(data.msg);
					}
				});
				//alert( "submitted!" );
			}
		} );
		$( document ).ready( function () {
			$( "#signupForm" ).validate( {
				rules: {
					firstname: "required",
					lastname: "required",
					username: {
						required: true,
						minlength: 2
					},
					password: {
						required: true,
						minlength: 5
					},
					confirm_password: {
						required: true,
						minlength: 5,
						equalTo: "#password"
					},
					email: {
						required: true,
						email: true
					},
					agree: "required"
				},
				messages: {
					firstname: "Please enter your firstname",
					lastname: "Please enter your lastname",
					username: {
						required: "Please enter a username",
						minlength: "Your username must consist of at least 2 characters"
					},
					password: {
						required: "Please provide a password",
						minlength: "Your password must be at least 5 characters long"
					},
					confirm_password: {
						required: "Please provide a password",
						minlength: "Your password must be at least 5 characters long",
						equalTo: "Please enter the same password as above"
					},
					email: "Please enter a valid email address",
					agree: "Please accept our policy"
				},
				errorElement: "em",
				errorPlacement: function ( error, element ) {
					// Add the `invalid-feedback` class to the error element
					error.addClass( "invalid-feedback" );

					if ( element.prop( "type" ) === "checkbox" ) {
						error.insertAfter( element.next( "label" ) );
					} else {
						error.insertAfter( element );
					}
				},
				highlight: function ( element, errorClass, validClass ) {
					$( element ).addClass( "is-invalid" ).removeClass( "is-valid" );
				},
				unhighlight: function (element, errorClass, validClass) {
					$( element ).addClass( "is-valid" ).removeClass( "is-invalid" );
				}
			} );

		} );
	</script>
</body>
</html>
  • 4
    点赞
  • 6
    收藏
    觉得还不错? 一键收藏
  • 4
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 4
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值