[spring] 클론코딩05 User - 로그인, 세션

클라이언트로 부터 이메일과 비밀번호 데이터를 받아온다. 매퍼 쪽으로 데이터를 2개를 보낼 수 없으니 로그인 전용 LoginVO를 생성 해주었다. 이 데이터를 가지고 DB에서 로그인 시도하는 회원의 정보를 받아온다. null을 리턴하면 해당되는 회원이 존재하지 않는 것이고 email에 해당하는 회원이 존재하면 해당 회원의 전체 정보를 리턴한다.

controller단에서는 클라이언트에서 받아온 비밀번호 데이터와 조회한 회원의 비밀번호 데이터를 비교해서 로그인 여부를 판단한다.

로그인이 성공하게 되면 데이터를 기억하기 위해 세션과 쿠키를 사용한다. 세션의 수명은 브라우저 실행부터 종료까지이고(브라우저가 종료되기 전에 세션의 수명이 다할 수 있는데 이는 세션의 유효시간 때문! 따로 설정이 가능하다) 쿠키는 데이터가 로컬저장소(하드디스크, 기억장치 등)에 저장되기 때문에 세션은 브라우저 별로 사용자를 식별하기 위한 용도로 쓰이고 쿠키는 자동로그인 처리를 할 때 쓰인다.

 

 

 

Controller

---

UsersController

//로그인 검증 요청
@PostMapping("/loginCheck")
public String login(@RequestBody LoginVO login, HttpSession session) throws Exception {
	
	logger.info("/user/loginCheck : post요청");
	
	//파라미터 확인
	System.out.println("로그인 시도한 회원 : " + login);
	
	BCryptPasswordEncoder encoder = new BCryptPasswordEncoder();
	String result = null;
	
	//서비스단 - 로그인 시도한 회원의 모든 회원정보 조회해서 userVO객체에 저장
	UsersVO user = usersService.login(login);
	System.out.println("로그인 시도한 회원의 모든 정보 : " + user);
	
	//아이디 존재 -> 가입된 회원이 존재 -> 비밀번호 확인 필요
	if(user != null) {
		
		//비밀번호 일치 -> 로그인성공
		if(encoder.matches(login.getPw(), user.getPw())) {
			result = "loginSuccess";
			
			//로그인 성공시 로그인 유지를 설정 -> 세션 사용
			//login이라는 이름의 세션에 로그인한 사람의 전체 정보를 저장한다.
			session.setAttribute("login", user);
			System.out.println("login 세션 확인 : " + user);
			
			//브라우저 닫을 때까지 혹은 세션 유효기간이 만료되기 전까지 세션이 사용됨
			//session.setMaxInactiveInterval(60 * 60); //세션 만료시간을 1시간으로 설정
			
		}
		//비밀번호 불일치
		else {
			result = "pwFail";
		}
	}
	//이메일이 존재하지 않음
	else { 
		result = "emailFail";
	}
	return result;
	
}

DB에 비번을 저장할 때 암호화 시켜서 저장했기 때문에 디코딩해서 비교해야하는데 디코딩해서 문자를 가져올 수는 없고 내부적으로 디코딩해서 비교해주는 방법을 사용한다. 클래스 BCryptPasswordEncoder에 함수 matches 사용

encoder.matches(날 것의 문자, 인코딩 된 문자)

클라이언트가 전송한 email과 pw를 가지고 DB에서 회원의 정보를 조회해서 불러온 다음 값 비교를 통해

1. email 값이 없을 경우 클라이언트 측으로 문자열 emailFail 전송
2. pw가 틀린 경우 pwFail 전송
3. 로그인 성공시 loginSuccess 를 전송한다.

 

세션을 사용하는 방법

1. HttpServletRequest 객체 사용 .getSession(); -> 요청 정보를 얻는 동시에 추가적으로 얻을 때 사용
2. HttpSession 객체 사용 -> 그냥 세션만 필요하다 할 때 사용

HttpSession을 사용해 로그인 객체를 세션에 저장한다.

 

 

 

Service

---

UsersService

//로그인 시도 회원정보 조회 처리
@Override
public UsersVO login(LoginVO login) throws Exception {
	return usersDAO.login(login);
}

 

 

 

 

View

---

login.jsp

//로그인 버튼 클릭 이벤트
$('#login-btn').click(function(e) {
	
	if(chk1 && chk2) {
		
		const email = $('#login_email').val();
		const pw = $('#login_pw').val();
		
		//콘솔에 값 출력
		console.log("email: " + email);
		console.log("pw: " + pw);
		
		//json객체에 담기
		const userInfo = {
			email: email,
			pw: pw
		};
		
		$.ajax({
			type: "POST",
			url: "/myapp/user/loginCheck",
			headers: {
				"Content-Type": "application/json",
                "X-HTTP-Method-Override": "POST"
			},
			data: JSON.stringify(userInfo),
			dataType: "text",
			success: function(data) {
				
				console.log("result:" + data);
				
				if(data === "emailFail") {
					$('#alert_msg').html('<p>입력한 사용자 이름을 사용하는 계정을 찾을 수 없습니다. 사용자 이름을 확인하고 다시 시도하세요.</p>');
					$('#login_email').focus();
					
				} else if(data === "pwFail") {
					$('#login_pw').focus();
					$('#alert_msg').html('<p>잘못된 비밀번호입니다. 다시 확인하세요.</p>');
					
				} else if(data === "loginSuccess") {
					alert("로그인성공!");
					self.location="/myapp/post/list";
				}
			}
		}); //통신끝!
	
	} else {
		alert('입력 정보를 다시 확인하세요');
	}
});