仿牛客社区修改密码功能

已于 2023-04-20 09:01:55 修改
阅读量434 收藏 1
点赞数 3
文章标签： html 前端
于 2023-04-01 11:11:49 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/BigCanda/article/details/129890939
版权

目录

1. 一些废话

2. 三层架构

2.1 dao层

2.2 service层        

2.2.1 获取验证码

 2.2.2 重置密码 

2.3 controller层

2.3.1 getCode方法

2.3.2 getForgetPage方法和重置密码的resetPassword方法

3. 前端页面的处理

3.1 html页面的处理

3.2 js方法的选择

4. 测试

4.1 一般测试

4.2 非常规测试：

5. 后记

1. 一些废话

        这一部分足足写了我大半天，还是太菜了，主要是对前端不熟悉，导致传参出现了很大问题，严重拖慢了进度，但是好在最后做到了比较完美的效果，前端的界面是这样的：

        不同于现在主流的先获取邮箱或者手机号，然后再修改密码，这个页面把所有的功能全部杂糅在一起了，然而我又不懂前端，懒得改页面，于是就只能在后端下下功夫了。

2. 三层架构

2.1 dao层

        dao层的处理，主要就是增加一个方法依据邮箱查找用户，这一部分比较简单，就不多赘述了。

2.2 service层        

        service层，这一层主要包含了获取验证码（包含发邮件），以及重置密码两个功能。

2.2.1 获取验证码

        下面这个是获取验证码，要注意的是，这里map里我加入了有效时间expirationTime和冷却时间cd这两个key，具体作用在前端处理的时候我会详细叙述，值得一提的是，这里集成了我上篇文章讲到的把发邮件交给kafka消息队列，有兴趣可以看一看：https://blog.csdn.net/BigCanda/article/details/129890574。

public Map<String, Object> getCode(String email) {
        Map<String,Object> map = new HashMap<>();


        if (StringUtils.isBlank(email)) {

            map.put("emailMsg","邮箱不能为空!");
            return map;
        }
        if (email.length() <= 11) {

            map.put("emailMsg","邮箱格式错误!");
            return map;
        }

        User user = userMapper.selectByEmail(email);

        if (user == null) {
            map.put("emailMsg","该邮箱未注册!");
            return map;
        }
        if (user.getStatus() == 0){
            map.put("emailMsg","该邮箱还未激活!");
            return map;
        }

        String code = CommunityUtil.generateUUID().substring(0, 6);
        map.put("code", code);
        // 激活邮件
        Context context = new Context();
        context.setVariable("email",user.getEmail());

        context.setVariable("code",code);

        String content = templateEngine.process("mail/forget",context);

        Mail mail = new Mail();
        mail.setTo(user.getEmail());
        mail.setContent(content);
        mail.setSubject("修改牛客网密码");

        try {
            mailProducer.fireMail(mail);
        } catch (Exception e) {
            map.put("emailMsg", "发送失败,请稍后再试!");
            return map;
        }
        map.put("expirationTime", LocalDateTime.now().plusMinutes(5));
        map.put("cd", LocalDateTime.now().plusMinutes(1));
        return map;
    }

 2.2.2 重置密码 

        重置密码比较简单，主要是用map返回一些错误信息：

public Map<String, Object> resetPassword(String password, String code) {
        Map<String, Object> map = new HashMap<>();

        if (code.isEmpty()) {
            map.put("codeMsg", "验证码不能为空!");
            return map;
        }
        if (password.isEmpty()) {
            map.put("passwordMsg", "密码不能为空!");
            return map;
        }

        if (password.length() < 10) {
            map.put("passwordMsg", "密码长度不能小于10位!");
            return map;
        }

        return map;
    }

2.3 controller层

        这一层是主要包含两个方法：getCode和resetPassword方法，我在妥协使用get方法获取验证码和使用post获取验证码之间纠结了很久，好在最后还是使用post比较完美的解决了问题。

2.3.1 getCode方法

@RequestMapping(path = "/user/getCode", method = RequestMethod.POST)
    @ResponseBody
    public String getCode(String email, HttpSession httpSession, HttpServletResponse httpServletResponse) {

        if (httpSession.getAttribute("cd") != null && LocalDateTime.now().isBefore((LocalDateTime) httpSession.getAttribute("cd"))) {
            return CommunityUtil.getJSONString(1, "您点击的太快了,休息一分钟吧!");
        }
        Map<String, Object> map = userService.getCode(email);
        String code = null;

        if (map.containsKey("emailMsg")) {
            return CommunityUtil.getJSONString(1, map.get("emailMsg").toString());
        }

        if (map.containsKey("code")) {
            code = (String) map.get("code");
        }

        if (code != null) {
            httpSession.setAttribute("code", code);
            httpSession.setAttribute("expirationTime",map.get("expirationTime"));
            httpSession.setAttribute("cd",map.get("cd"));

            Cookie cookie = new Cookie("email", email);
            cookie.setMaxAge(300);
            cookie.setPath(contextPath);
            httpServletResponse.addCookie(cookie);
        }
        return CommunityUtil.getJSONString(0, "验证码发送成功,请注意查收!");
    }

2.3.2 getForgetPage方法和重置密码的resetPassword方法

       这里就基本可以看出来expirationTime和cd的作用了，就是限制获取验证码以及设定验证码有效时间。

@RequestMapping(path = "/user/forget",method = RequestMethod.GET)
    public String getForgetPage() {
        return "site/forget";
    }

    @RequestMapping(path = "/user/forget",method = RequestMethod.POST)
    public String resetPassword(String password, String email, String code, HttpSession httpSession, Model model, HttpServletRequest httpServletRequest) {
        if (email == null) {
            model.addAttribute("emailMsg", "请输入邮箱!");
            return "site/forget";
        }
        Cookie cookies[] = httpServletRequest.getCookies();
        Cookie cookie = new Cookie("null", "null");
        if (cookies.length != 0) {
            for (Cookie cookie1 : cookies) {
                if (cookie1.getName().equals("email")) {
                    cookie = cookie1;
                    break;
                }
            }
        }

        Map<String, Object> map = userService.resetPassword(password, code);
        if (map.isEmpty())
        {
            if (LocalDateTime.now().isAfter((LocalDateTime) httpSession.getAttribute("expirationTime"))) {
                model.addAttribute("codeMsg", "输入的验证码已过期，请重新获取验证码!");
                model.addAttribute("email", email);
                return "site/forget";
            }
            try {
                if (httpSession.getAttribute("code").toString().equals(code)) {

                    if (!cookie.getValue().equals(email)) {
                        model.addAttribute("emailMsg", "验证码和邮箱不匹配,请重新获取验证码!");
                        return "site/forget";
                    }

                    userService.updatePasswordByEmail(email, password);

                    httpSession.removeAttribute("code");
                    httpSession.removeAttribute("expirationTime");
                    httpSession.removeAttribute("cd");

                    cookie.setMaxAge(0);

                    model.addAttribute("msg", "密码修改成功,请重新登录!");
                    model.addAttribute("target", "/login");
                    model.addAttribute("email", email);
                    model.addAttribute("username", userService.selectUserByEmail(email));

                    return "site/operate-result";
                } else {
                    model.addAttribute("codeMsg", "验证码错误!");
                    model.addAttribute("email", email);
                    return "site/forget";
                }
            } catch (Exception e) {
                model.addAttribute("codeMsg", "请先获取验证码!");
                return "site/forget";
            }

        }

        model.addAttribute("codeMsg", map.get("codeMsg"));
        model.addAttribute("passwordMsg", map.get("passwordMsg"));
        model.addAttribute("email", email);

        return "site/forget";
    }

3. 前端页面的处理

3.1 html页面的处理

<!doctype html>
<html lang="en" xmlns:th="https://www.thymeleaf.org">
<head>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
	<link rel="icon" href="https://static.nowcoder.com/images/logo_87_87.png"/>
	<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" crossorigin="anonymous">
	<link rel="stylesheet" th:href="@{/css/global.css}" />
	<link rel="stylesheet" th:href="@{/css/login.css}" />
	<title>牛客网-忘记密码</title>
</head>
<body>
	<div class="nk-container">
		<!-- 头部 -->
		<header class="bg-dark sticky-top" th:replace="index::header">
			<div class="container">
				<!-- 导航 -->
				<nav class="navbar navbar-expand-lg navbar-dark">
					<!-- logo -->
					<a class="navbar-brand" href="#"></a>
					<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
						<span class="navbar-toggler-icon"></span>
					</button>
					<!-- 功能 -->
					<div class="collapse navbar-collapse" id="navbarSupportedContent">
						<ul class="navbar-nav mr-auto">
							<li class="nav-item ml-3 btn-group-vertical">
								<a class="nav-link" href="../index.html">首页</a>
							</li>
							<li class="nav-item ml-3 btn-group-vertical">
								<a class="nav-link position-relative" href="letter.html">消息<span class="badge badge-danger">12</span></a>
							</li>
							<li class="nav-item ml-3 btn-group-vertical">
								<a class="nav-link" href="register.html">注册</a>
							</li>
							<li class="nav-item ml-3 btn-group-vertical">
								<a class="nav-link" href="login.html">登录</a>
							</li>
							<li class="nav-item ml-3 btn-group-vertical dropdown">
								<a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
									<img src="http://images.nowcoder.com/head/1t.png" class="rounded-circle" style="width:30px;"/>
								</a>
								<div class="dropdown-menu" aria-labelledby="navbarDropdown">
									<a class="dropdown-item text-center" href="profile.html">个人主页</a>
									<a class="dropdown-item text-center" href="setting.html">账号设置</a>
									<a class="dropdown-item text-center" href="login.html">退出登录</a>
									<div class="dropdown-divider"></div>
									<span class="dropdown-item text-center text-secondary">nowcoder</span>
								</div>
							</li>
						</ul>
						<!-- 搜索 -->
						<form class="form-inline my-2 my-lg-0" action="search.html">
							<input class="form-control mr-sm-2" type="search" aria-label="Search" />
							<button class="btn btn-outline-light my-2 my-sm-0" type="submit">搜索</button>
						</form>
					</div>
				</nav>
			</div>
		</header>
		<!-- 提示框 -->
		<div class="modal fade" id="hintModal" tabindex="-1" role="dialog" aria-labelledby="hintModalLabel" aria-hidden="true">
			<div class="modal-dialog modal-lg" role="document">
				<div class="modal-content">
					<div class="modal-header">
						<h5 class="modal-title" id="hintModalLabel">提示</h5>
					</div>
					<div class="modal-body" id="hintBody">
					</div>
				</div>
			</div>
		</div>
		<!-- 内容 -->
		<div class="main">
			<div class="container pl-5 pr-5 pt-3 pb-3 mt-3 mb-3">
				<form class="mt-5" method="post" th:action="@{/user/forget}">
					<div class="form-group row">
						<label for="your-email" class="col-sm-2 col-form-label text-right">邮箱:</label>
						<div class="col-sm-10">
							<input type="email"
								   th:class="|form-control ${emailMsg != null?'is-invalid' : ''}|"
								   th:value="${email != null ? email : ''}"
								   id="your-email" name="email" placeholder="请输入您的邮箱!" >
							<div class="invalid-feedback " th:text="${emailMsg}">

							</div>
						</div>
					</div>
					<div class="form-group row mt-4">
						<label for="verifycode" class="col-sm-2 col-form-label text-right">验证码:</label>
						<div class="col-sm-6">
							<input type="text" th:class="|form-control ${codeMsg!=null?'is-invalid':''}|"
								   id="verifycode" name = "code" placeholder="请输入验证码!">
							<div class="invalid-feedback" th:text="${codeMsg}">
								验证码不正确!
							</div>
						</div>
						<div class="col-sm-4">
							<button type="button" id="emailBtn" class="btn btn-info form-control" >获取验证码</button>
						</div>
					</div>
					<div class="form-group row mt-4">
						<label for="your-password" class="col-sm-2 col-form-label text-right">新密码:</label>
						<div class="col-sm-10">
							<input type="password" name="password"
								   th:class="|form-control ${passwordMsg!=null?'is-invalid':''}|"
								   class="form-control" id="your-password" placeholder="请输入新的密码!">
							<div class="invalid-feedback" th:text="${passwordMsg}">
								密码长度不能小于8位!
							</div>
						</div>
					</div>
					<div class="form-group row mt-4">
						<div class="col-sm-2"></div>
						<div class="col-sm-10 text-center">
							<button type="submit" class="btn btn-info text-white form-control">重置密码</button>
						</div>
					</div>
				</form>				
			</div>
		</div>

		<!-- 尾部 -->
		<footer class="bg-dark">
			<div class="container">
				<div class="row">
					<!-- 二维码 -->
					<div class="col-4 qrcode">
						<img src="https://uploadfiles.nowcoder.com/app/app_download.png" class="img-thumbnail" style="width:136px;" />
					</div>
					<!-- 公司信息 -->
					<div class="col-8 detail-info">
						<div class="row">
							<div class="col">
								<ul class="nav">
									<li class="nav-item">
										<a class="nav-link text-light" href="#">关于我们</a>
									</li>
									<li class="nav-item">
										<a class="nav-link text-light" href="#">加入我们</a>
									</li>
									<li class="nav-item">
										<a class="nav-link text-light" href="#">意见反馈</a>
									</li>
									<li class="nav-item">
										<a class="nav-link text-light" href="#">企业服务</a>
									</li>
									<li class="nav-item">
										<a class="nav-link text-light" href="#">联系我们</a>
									</li>
									<li class="nav-item">
										<a class="nav-link text-light" href="#">免责声明</a>
									</li>
									<li class="nav-item">
										<a class="nav-link text-light" href="#">友情链接</a>
									</li>
								</ul>
							</div>
						</div>
						<div class="row">
							<div class="col">
								<ul class="nav btn-group-vertical company-info">
									<li class="nav-item text-white-50">
										公司地址：北京市朝阳区大屯路东金泉时代3-2708北京牛客科技有限公司
									</li>
									<li class="nav-item text-white-50">
										联系方式：010-60728802(电话)&nbsp;&nbsp;&nbsp;&nbsp;admin@nowcoder.com
									</li>
									<li class="nav-item text-white-50">
										牛客科技©2018 All rights reserved
									</li>
									<li class="nav-item text-white-50">
										京ICP备14055008号-4 &nbsp;&nbsp;&nbsp;&nbsp;
										<img src="http://static.nowcoder.com/company/images/res/ghs.png" style="width:18px;" />
										京公网安备 11010502036488号
									</li>
								</ul>
							</div>
						</div>
					</div>
				</div>
			</div>
		</footer>
	</div>

	<script src="https://code.jquery.com/jquery-3.3.1.min.js" crossorigin="anonymous"></script>
	<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js" crossorigin="anonymous"></script>
	<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" crossorigin="anonymous"></script>
	<script th:src="@{/js/global.js}"></script>
	<script th:src="@{/js/forget.js}"></script>
</body>
</html>

3.2 js方法的选择

       起先我用的是get方法， 参考了下面这篇文章：

(24条消息) （仿牛客论坛项目）06 - 忘记密码_html忘记密码页面代码_每天都要学习的阿荣的博客-CSDN博客

        因为根本没学过前端，于是就去文章里面偷了个这样的js函数：

<script>
    function get_code() {
        var email = document.getElementById("your-email");
        // 点击该超链接会发送请求给浏览器
        window.location.href = "getCode?email=" + email;
    }
</script>

        但是发现根本不行，上面的跳转根本跳转不了，地址栏里面的email值一直都是html对象，后来改了一下，变成了这样才能正常访问：

<script>
    function get_code() {
        var email = document.getElementById("your-email");
        // 点击该超链接会发送请求给浏览器
        window.location.href = "getCode?email=" + email.value;
    }
</script>

        但是这样做每次都要刷新页面，而且不安全，可以通过在地址栏一直输入链接获取验证码，而且还有更严重的缺陷：由于我把email存在cookie里面用作后续比对以及自动回填到新页面的邮箱栏上，防止一个邮箱收的验证码可以改另一个邮箱对应的账号的密码这种情况发生，然后在重新设置密码成功以后清除cookie，然而这样做加上使用get的后果就是，cookie失效之前都不能改另一个账号的密码。

        上面说的可能有些抽象，举个很简单的例子，我改一个账号密码改到一半不想改了，想改另一个账号的密码，可是在cookie过期之前我怎么也不能修改邮箱，每次点重置密码都会把填好的新邮箱自动改掉并且提示你修改失败，这就挺反人类的。

        然后我恶补前端知识，到处c，终于写出了异步的post方法，很好的解决了上面的问题：

$(function(){
    $("#emailBtn").click(get_code);

});

function get_code() {
    var email = $("#your-email").val();
    if (email != "") {
        $("#emailBtn").click(time(this));
    }
    $.post(
        CONTEXT_PATH + "/user/getCode",
        {"email":email},
        function data(data) {
            data = $.parseJSON(data);
            $("#hintBody").text(data.msg);
            $("#hintModal").modal("show");
            setTimeout(function(){
                $("#hintModal").modal("hide");
            }, 2000);
        }
    );

    $("#hintModal").modal("show");
    setTimeout(function(){
        $("#hintModal").modal("hide");
    }, 2000);
}
var wait=60;
function time(obj) {
    if (wait == 0) {
        obj.removeAttribute("disabled");
        obj.innerHTML="获取验证码";
        wait = 60;
    } else {
        obj.setAttribute("disabled", true);
        obj.innerHTML=wait+"秒后重新发送";
        wait--;
        setTimeout(function() {
                time(obj)
            },
            1000)
    }
}

        值得注意的是我把前端的验证码发送冷却也加上了，当然也是偷的，文章链接：

(23条消息) 点击发送短信验证码按钮后，倒计时60秒_点击发送验证码按钮优化 倒计时会在点击按钮后延迟几秒_程序员老牛了laoliu的博客-CSDN博客

4. 测试

4.1 一般测试

        首先不输入邮箱：

        然后输入邮箱获取验证码：

        成功收到邮件：

        

        刷新页面重复获取：

         输入验证码，但是不输入密码：

 

         输入不合规的密码：

        

        操作超时：

        正确操作，跳转到成功页面：

 

4.2 非常规测试：

        同时改两个账号的密码，首先获取一个账号：

        再获取另一个账号：

        然后用一个邮箱收到的验证码填另一个的：

        同理，用一个邮箱收到验证码但是不改密码，把邮箱改了，再点击重置密码密码也是一样的效果。

5. 后记

        这篇文章主要是做学习记录用的，主要记录我当时的想法和心态，写得很长和啰嗦，大佬轻喷。

BigCanda
关注
  • 3
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
SpringBoot仿牛客论坛项目2.33账号设置-修改密码
weixin_39644536的博客
06-26 701
仿牛客论坛，修改密码
讨论区交流平台项目 - 修改密码
weixin_43127268的博客
05-25 329
功能分析 用户访问请求提供旧密码以及新密码，在后台我们通过判断旧密码是否提供正确，如果验证通过就修改密码，不然就给前端返回错误提示。 就是很经典的三重架构流程开发就完事了。 开发步骤 数据访问层 数据访问层需要提供查询用户以及修改密码两种方法，在前面的开发过程中已经开发完成，具体代码看社区首页开发那块即可。 业务层 验证原始密码的正确性，以及成功后修改密码。 UserService 类： package com.spring.community2.service; import com.spring.com
仿牛客社区——2.3.3账号设置（修改密码）
zssxcj的博客
04-13 264
当用户在账号设置页面修改密码时，输入完原始密码以及新密码、确认密码后，当点击【立即保存】后，若用户原始密码输入正确，新密码与确认密码一致时，会跳转至登录页面重新登录，若输入有误，则显示对应的错误信息。
（仿牛客社区项目）Java开发笔记2.6：设置用户的头像和修改密码功能
weixin_45700663的博客
07-19 830
（仿牛客社区项目）Java开发笔记2.6：设置用户的头像和修改密码功能
牛客网项目---1.7.账号设置(上传头像、修改密码)
gouhanchi的博客
06-22 1237
7、账号设置/setting 上传头像将头像保存到本地/七牛云服务器，随机生成字符串作为图片的名称，表单提交再返回该界面。获取头像时，在本地获取，通过输入输出流，先读到缓冲区，再从缓冲区写出；在七牛云服务器获取时，不使用流的方式，直接通过文件名获取，将header的URL更新在user用户中。 8、更改密码/changePassword：表单提交新密码，判断密码是否符合标准，更新user信息，并退出登录，重定向到登录界面重新登录 -------------------------------...
基于SpringBoot的仿牛客论坛源码.zip
05-21
基础功能 邮箱设置 启用客户端SMTP服务 Spring Email： ——导入jar包。 ——邮箱参数配置。 ——使用JavaMailSender发送邮件。 模板引擎： ——使用Thymeleaf发送HTML邮件。 注册功能使用邮箱验证。 访问注册页面...
仿牛客UI源码
01-26
仿牛客UI(张俊峰) 1.图标来自牛客app 2.大致实现UI效果 3.实现抽提 底部：RelativeLayout(学习、社区、消息、我的牛客) + 中间 自定义ViewPager(禁止滑动) 一、学习界面： (1) 标题模块：牛客 (2) 图片滑动模块：...
基于SpringBoot 仿牛客网讨论社区项目
04-03
仿牛客网讨论社区项目： 主要技术架构： SpringBoot Spring SpringMVC MyBatis Redis Kakfa Elasticsearch Spring Security Spring Actator 基于SpringBoot的社区平台，实现了牛客网讨论区的功能。实现了邮箱注册...
Java仿牛客系统源码.zip
06-06
Java仿牛客系统源码.zip
仿牛客UI及部分实现代码
01-25
仿牛客UI 1.图标来自牛客app 2.大致实现UI效果 3.实现抽提 底部：RelativeLayout(学习、社区、消息、我的牛客) + 中间 自定义ViewPager(禁止滑动) 一、学习界面： (1) 标题模块：牛客 (2) 图片滑动模块：ViewPager...
使用bootstrap做的登陆、注册、忘记密码页面
06-29
本文件包含登陆、注册、找回密码三个页面，使用bootstrap开发框架，界面简洁大方。
加载网页弹出层密码修改
08-09
加载网页弹出层密码修改
（仿牛客论坛项目）05 - 显示登录信息 - 账号设置 - 检查登录状态
qq_42148002的博客
07-03 823
配置拦截器，为它指定拦截、排除的路径； 配置 MVC 的时候要实现 WebMvcConfigurer 这个类才可以； 将拦截器注入； 重写 方法 将拦截器添加进来: 排除所有静态资源： 设置拦截哪些路径： 测试一下是否拦截成功，index 页面不拦截，登录、注册页面被拦截： 返回的是所有 cookie 信息，我们要从中取我们想要的信息。 实现 prehandle 方法： 通过 cookie 得到 ticket 信息，用户登录之后会重定向到首页，这时我们可以从第二次请求中获取用户信息；
2.2仿牛客社区项目——注册（md5加盐加密密码，发送激活路径到邮箱，激活路径由UserId和激活码组成）
Doreen_FF的博客
06-08 903
访问注册功能 访问注册页面 LoginController.java register.html 提交注册数据
简单的修改密码
weixin_44547598的博客
05-26 1002
下面是修改密码的页面 ， 这里用的是bootstrap4的框架来搭建 这里呢点击button按钮（浏览） ， 弹出模态框显示所有的会员卡号 ，这里的会员卡号是与会员卡表内的数据相连接的 ，就是会员卡表内的数据有多少条 ，在模态框内就显示多少条 ，如果在会员卡表内删除一条数据，那么模态框内就要少显示一条数据 ，下面是点击浏览后调用的方法 ， 首先清空掉模态框内的所有数据 ，并将模态框显示出...
简单且实用的密码修改模态框
weixin_44542089的博客
07-17 2915
修改密码相信大家都不会陌生，几乎每个系统都缺不了修改密码，这是增强用户体验性的一种基本要求，一个网站中，若是没有修改密码这一功能的话，绝对活不长久，因为每位用户的都会有账号被盗取，信息被泄露的风险，若不能修改密码，那么对用户的利益便造成了巨大的损失，谁会用这样的网站呢? 所以说，密码的修改功能对于一个完整系统来说是必不可少的，具有重要性的。因此，这次便分享给大家一个以Bootstrap为基础来搭建...
（仿牛客论坛项目）06 - 忘记密码
qq_42148002的博客
07-04 2285
1.2 修改 forget.html 页面 修改引入的样式表路径为 thymeleaf 格式的，包括所有使用相对路径的 CSS、JS 文件都修改为绝对路径格式，例如：； 同时，头部文件进行代码复用； 1.4 测试页面 在登陆页面点击忘记密码： 2.2 UserService 层 实现获取验证码的方法，根据用户输入的邮箱；都没问题的话发送随机 6 位字符串验证码到指定邮箱（这里已经有做好的 html 模板可以使用，其中需要邮箱和验证码两个信息）；同时记录下来验证码和验证码过期时间，之后验证的时候使
ATeam社区（牛客网项目第二章）
m0_48847558的博客
12-20 966
1. 发送邮件 邮箱设置 启用客户端SMTP服务 Spring Email 导入jar包（即引入依赖） 邮箱参数配置 使用JavaMailSender发送邮件 模板引擎 使用Thymeleaf发送HTML邮件 1.1 邮箱设置 选择新浪邮箱，开启SMTP服务（一开始选择的是QQ邮箱，但老是出问题） 1.2 Spring Email 导入jar包 在mavenrepository中搜索spring mail 将方框中的内容复制到项目中的pom文件中 <!-- ema
仿牛客社区有哪些异步操作
最新发布
04-27
仿牛客社区可能涉及到的异步操作包括： 1. 异步加载数据：例如在用户浏览不同页面时，异步加载该页面的数据，减少页面加载时间。 2. 异步提交数据：例如在用户发表评论或文章时，异步提交数据，不需要刷新整个页面。 3. 异步验证数据：例如在用户注册时，异步验证用户名或邮箱是否已经被注册过。 4. 异步搜索：例如在用户进行搜索时，异步获取搜索结果，实现搜索框下拉提示。 5. 异步通知：例如在用户有新消息时，通过异步请求获取最新消息并提示用户。 以上仅是一些可能涉及到的异步操作，具体实现还需根据需求进行具体分析。

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

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

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值