반응형
logged-in-by-email
<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head th:replace="fragments.html :: head"></head>
<body class="bg-light">
<nav th:replace="fragments.html :: main-nav"></nav>
<div class="container">
<div class="py-5 text-center" th:if="${error}">
<p class="lead">데모 패스워드 찾기</p>
<div class="alert alert-danger" role="alert" th:text="${error}">
로그인 할 수 없습니다.
</div>
</div>
<div class="py-5 text-center" th:if="${error == null}">
<p class="lead">데모 패스워드 찾기</p>
<h2>이메일을 통해 임시 로그인 했습니다. <a th:href="@{/settings/password}">패스워드를 변경</a>하세요.</h2>
</div>
</div>
</body>
</html>
계정이 존재하지 않거나, 이메일 토큰이 일치하지 않은경우
<div class="py-5 text-center" th:if="${error}">
<p class="lead">데모 패스워드 찾기</p>
<div class="alert alert-danger" role="alert" th:text="${error}">
로그인 할 수 없습니다.
</div>
</div>
계정이 존재하고, 이메일 토큰이 일치 할경우
<div class="py-5 text-center" th:if="${error == null}">
<p class="lead">데모 패스워드 찾기</p>
<h2>이메일을 통해 임시 로그인 했습니다. <a th:href="@{/settings/password}">패스워드를 변경</a>하세요.</h2>
</div>
AccountController의 sendEmailLoginLink 메서드와 loginByEmail메서드
//패스워드 변경을 위한 이메일 로그인
@PostMapping("/email-login")
public String sendEmailLoginLink(String email, Model model, RedirectAttributes attributes) {
Account account = accountRepository.findByEmail(email);
if (account == null) {
model.addAttribute("error", "유효한 이메일 주소가 아닙니다.");
return "account/email-login";
}
if (!account.canSendConfirmEmail()) {
model.addAttribute("error", "이메일로 메일 발송은 1시간마다 한 번 사용 가능합니다.");
return "account/email-login";
}
accountService.sendLoginLink(account);
attributes.addFlashAttribute("message", "이메일 인증 메일을 발송했습니다.");
return "redirect:/email-login";
}
//이메일을 통한 링크로 패스워드 변경
@GetMapping("/login-by-email")
public String loginByEmail(String token, String email, Model model){
Account account=accountRepository.findByEmail(email);
String view="account/logged-in-by-email";
//계정이 null이거나 유효한 토큰이 아닐 경우 -> 로그인 불가
if(account==null||!account.isValidToken(token)){
model.addAttribute("error", "로그인할 수 없습니다.");
return view;
}
//유효한 토큰일 경우 로그인 처리
accountService.login(account);
return view;
}
email-login
<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head th:replace="fragments.html :: head"></head>
<body class="bg-light">
<div th:replace="fragments.html :: main-nav"></div>
<div class="container">
<div class="py-5 text-center">
<p class="lead">데모</p>
<h2>임시 로그인</h2>
</div>
<div class="row justify-content-center">
<div th:if="${error}" class="alert alert-danger alert-dismissible fade show mt-3" role="alert">
<span th:text="${error}">완료</span>
<button type="button" class="close" data-dismiss="alert" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div th:if="${message}" class="alert alert-info alert-dismissible fade show mt-3" role="alert">
<span th:text="${message}">완료</span>
<button type="button" class="close" data-dismiss="alert" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<form class="needs-validation col-sm-6" action="#" th:action="@{/email-login}" method="post" novalidate>
<div class="form-group">
<label for="email">가입 할 때 사용한 이메일</label>
<input id="email" type="email" name="email" class="form-control"
placeholder="your@email.com" aria-describedby="emailHelp" required>
<small id="emailHelp" class="form-text text-muted">
가입할 때 사용한 이메일을 입력하세요.
</small>
<small class="invalid-feedback">이메일을 입력하세요.</small>
</div>
<div class="form-group">
<button class="btn btn-success btn-block" type="submit"
aria-describedby="submitHelp">로그인 링크 보내기</button>
<small id="submitHelp" class="form-text text-muted">
데모에 처음 오신거라면 <a href="#" th:href="@{/findpassword}">계정을 먼저 만드세요.</a>
</small>
</div>
</form>
</div>
<div th:replace="fragments.html :: footer"></div>
</div>
<script th:replace="fragments.html :: form-validation"></script>
</body>
</html>
logged-in-by-email
<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head th:replace="fragments.html :: head"></head>
<body class="bg-light">
<nav th:replace="fragments.html :: main-nav"></nav>
<div class="container">
<div class="py-5 text-center" th:if="${error}">
<p class="lead">데모 패스워드 찾기</p>
<div class="alert alert-danger" role="alert" th:text="${error}">
로그인 할 수 없습니다.
</div>
</div>
<div class="py-5 text-center" th:if="${error == null}">
<p class="lead">데모 패스워드 찾기</p>
<h2>이메일을 통해 임시 로그인 했습니다. <a th:href="@{/settings/password}">패스워드를 변경</a>하세요.</h2>
</div>
</div>
</body>
</html>
반응형
'Server Programming > Spring Boot Full-Stack Programming' 카테고리의 다른 글
| [Spring Boot] 공부하기 (0) | 2022.09.29 |
|---|---|
| [스프링 풀스택 클론 코딩 - 계정 설정] (2-11) 패스워드 찾기 (0) | 2022.09.06 |
| [스프링 풀스택 클론 코딩 - 계정 설정] (2-9) 닉네임 변경 (0) | 2022.09.05 |
| 인텔리J 단축키 (0) | 2022.09.05 |
| [스프링 풀스택 클론 코딩 - 계정 설정] (2-8) ModelMapper 적용 (0) | 2022.09.05 |
