로그아웃
jsp 코드
<%-- 로그아웃 #4 : Logout : form 태그 달기(post 방식) --%>
<li class="nav-item">
<form action="/auth/customLogout" method="post">
<button type="submit" class="btn">Logout</button>
<%-- TODO: csrf 보안 토큰 : 해킹 방지 토큰 --%>
<input type="hidden" name="${_csrf.parameterName}" value="${_csrf.token}"/>
</form>
</li>csrf보안 토큰을 주어야 해킹을 방지할 수 있다.
post방식으로 해야 보안에 안전하다
사실 로그아웃은 스프링이 알아서 다 해주기에 configuration만 잘 해주면된다.
회원가입
Service에 save함수 만들기
코드
// todo : 회원가입 save
public Member save(Member member){
Member member2 = memberRepository.save(member);
return member2;
}저장할 함수이다. 전에 만들었던 것과 동일하기에 설명은 생략한다.
Repository 함수 만들기
@GetMapping("/register")
public String addMember(){
return "auth/register.jsp";
}
// 2) 저장버튼 클릭시 실행될 함수
@PostMapping("/regist")
public RedirectView createMember(@ModelAttribute Member member){
//todo 매개변수 전달된 member가 DB에 있으면 insert안 해도 됨 = 이미 가입 되있다는 뜻
if (memberService.existsById(member.getEmail())) {
return new RedirectView("/error"); // 이미가입되있다는 에러가 뜨게
}
//todo 위의 에러를 통과하면 새로운 회원이므로 insert한다.
Member newMember = new Member(
member.getEmail(),
passwordEncoder.encode(member.getPassword()),// 패스워드는 암호화 해서 넣어줘야함
member.getName(),
member.getCodeName());
memberService.save(member);
return new RedirectView("/auth/customLogin");
}회원가입 페이지로 가게하는 controller를 하나만들었다.
저장버튼 클릭시 실행될 저장함수
-
일단 객체를 받아야하므로 @ModelAttribute로 객체를 받아준다.
-
memberService의 existsById()를 이용해서 회원가입하려는 아이디가이미 존재하는 아이디인지를 확인하고, 만약 있다면 에러메세지를 뜨게한다.
-
존재하지 않는다면 새로운 객체를 만들어서 id, password, name, codeName을 생성자로 넣어준다. 이때 새로운 객체를 만드는 이유는 passwordEncoder로 암호화를 해줘야하기에 원래 객체를 사용하지 못한다.
-
새로운 객체를 저장함수로 저장하면된다.
회원가입 페이지 jsp
회원가입을 진행할 폼이 있을 페이지를 제작해보자. form은 부트스트랩 테마에서 가져왔다.
1.
<form class="user" action="/auth/regist" method="post">
2.
<div class="form-group">
<input
type="email"
lass="form-control form-control-user mb-3"
id="exampleInputEmail"
placeholder="Email Address"
name="email"/>
</div>
3.
<button
type="submit"
class="btn btn-primary btn-user w-100 mb-3" >회원가입
</button>
4.
<input type="hidden" name="${_csrf.parameterName}" value="${_csrf.token}"/>-
action에 controller함수가 실행될 url을 넣어주고, 제출방식을 post방식으로 만들어준다.
-
제출을 할때 name속성값과 저장 객체의 속성의 이름을 맞추어준다. id뿐만이 아니라 pw, 이름, 권한도 모두 맞추어 주어야한다.
-
마지막에 버튼의 type을 submit으로 해주면 된다.
-
보안토큰을 걸어준다.
에러 페이지 만들기jsp
결과
회원가입시 새로운 정보가 잘 들어오는 것을 확인했다.
로그인 유무별 화면 조정
로그인 성공시 로그인 버튼을 보여줄 필요없고, 로그아웃 상태시 로그아웃을 보여줄 필요가 없다. 그러므로 이걸 상황별로 나타나게 만들어보자.
<%-- TODO: 회원로그인/ 회원가입 --%>
<%-- 사용법 : <sec:authorize access="isAnonymous()">html태그</sec:authorize> --%>
<%-- => isAnonymous() : 로그인 안했다면 html 태그가 화면에 보임 --%>
<sec:authorize access="isAnonymous()">
<%-- 회원가입 #2 : register --%>
<li class="nav-item">
<a class="nav-link active" aria-current="page" href="/auth/register">회원가입</a>
</li>
<%-- 로그인 #3 : Login --%>
<li class="nav-item">
<a class="nav-link active" aria-current="page" href="/auth/customLogin">Login</a>
</li>
</sec:authorize>
<%-- TODO: 로그아웃 처리 --%>
<%-- 사용법 : <sec:authorize access="isAuthenticated()">html태그</sec:authorize> --%>
<%-- => isAnonymous() : 로그인 했다면 html 태그가 화면에 보임 --%>
<sec:authorize access="isAuthenticated()">
<%-- 로그아웃 #4 : Logout : form 태그 달기(post 방식) --%>
<li class="nav-item">
<form action="/auth/customLogout" method="post">
<button type="submit" class="btn">Logout</button>
<%-- TODO: csrf 보안 토큰 : 해킹 방지 토큰 --%>
<input type="hidden" name="${_csrf.parameterName}" value="${_csrf.token}"/>
</form>
</li>
</sec:authorize>sec:authorize태그를 이용해서 이 기능을 추가할 수 있다. access 속성값으로 로그인과 로그아웃을 설정 할 수 있다. 로그인이 되어있다면 isAuthenticated()을 값으로, 로그아웃이 되어있다면 isAnonymous()으로 해주면 된다. 이 태그안에 폼을 넣어주면 그 폼은 로그인여부에 따라 보이고 안 보이고가 결정된다.
