우당탕탕 개발일지
46일차_로그인, Cookie vs HttpSession 본문
저번 시간 이어서..!
Git hub
https://github.com/ujin302/Web2024/tree/main/projectJSP
1. 프로젝트명 : projectJSP
기능
- 로그인
- id, pwd 유효성 검사
- id, pwd DB에서 값 확인
Java
- MemberDAO
jsp
- memberLogin.jsp
- memberLoginForm.jsp
memberLoginForm.jsp
로그인 화면
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
<form action="./memberLogin.jsp" method="post">
<table border="1" >
<tr>
<th>아이디</th>
<td>
<input data-checkId="false" size="20" id="id" name="id" placeholder="아이디 입력">
<div id="idDiv"></div>
</td>
</tr>
<tr>
<th>비밀번호</th>
<td>
<input type="password" size="30" class="pwd" id="pwd" name="pwd" placeholder="비밀번호 입력">
<div id="pwdDiv"></div>
</td>
</tr>
<tr>
<td colspan="2" align="center">
<input type="submit" value="로그인" onclick="loginCheck(event)">
<input type="button" value="회원가입" onclick="location.href='./memberWriteForm.jsp'">
</td>
</tr>
</table>
</form>
<script type="text/javascript" src="../js/memberLogin.js"></script>
</body>
</html>
memberLogin.js: loginCheck()
값을 입력하지 않고 '로그인' 버튼 클릭 시, 아래와 같이 문구가 발생한다.
// 로그인
function loginCheck(e) {
if(document.getElementById('id').value == ''){
document.getElementById('idDiv').innerText = '아이디를 입력하세요.';
e.preventDefault();
}
if(document.getElementById('pwd').value == ''){
document.getElementById('pwdDiv').innerText = '비밀번호를 입력하세요.';
e.preventDefault();
}
document.getElementById('id').value = '';
document.getElementById('pwd').value = '';
}
memberJoin.js: idDiv, pwdDiv 초기화
아이디, 비밀번호 모두 빈값이 아니어야 로그인 버튼을 클릭할 수 있다.
// idDiv 초기화
document.getElementById('id').addEventListener("focus", () => {
document.getElementById('idDiv').innerText = '';
});
// pwdDiv 초기화
document.getElementById('pwd').addEventListener("focus", () => {
document.getElementById('pwdDiv').innerText = '';
});
마루로 꾸며봄 ㅎ
2. 인증수단: Cookie vs HttpSession
https://velog.io/@chelsea/%EB%84%A4%ED%8A%B8%EC%9B%8C%ED%81%AC-HTTP-Cookie-vs-Session
2-1. Cookie
로그인 성공 시, 서버에서 쿠키를 생성하여 클라이언트에 저장한다.
쿠키에는 로그인 정보가 담겨있다.
기존에는 get 방식으로 url 주소에 포함하여 전송하였다. 이렇게 되면 중요한 데이터가 손쉽게 노출되어 안전성이 떨어진다. 따라서 쿠키를 사용하게 된다.
memberLogin.jsp
로그인 성공 여부를 처리하는 부분이다.
해당 부분에서 로그인 성공 시, 쿠키를 사용한다.
쿠키 생성
- Cookie cookie = new Cookie(쿠키이름, 쿠키값)
쿠키 유효기간
- cookie.setMaxAge(지속할 시간 지정, 초 단위);
클라이언트에게 쿠키 저장
- response.addCookie(생성한 쿠키객체);
<%@page import="java.net.URLEncoder"%>
<%@page import="DAO.MemberDAO"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%
MemberDAO memberDAO = MemberDAO.getInstance();
String id = request.getParameter("id");
String pwd = request.getParameter("pwd");
String loginName = memberDAO.login(id, pwd);
%>
<%if(loginName == null) {
// 페이지 이동
response.sendRedirect("loginFail.jsp");
}else {
// 쿠키
Cookie cookie = new Cookie("memName", loginName);
cookie.setMaxAge(3*60*10); // 초 단위
response.addCookie(cookie); // 클라이언트에 저장
Cookie cookie2 = new Cookie("memId", id);
cookie.setMaxAge(3*60*10); // 초 단위
response.addCookie(cookie2); // 클라이언트에 저장
response.sendRedirect("loginOk.jsp");
}
%>
loginOk.jsp
로그인 성공 시, 쿠키를 저장하여 해당 jsp파일 호출된다. 쿠키에 저장되어 있는 데이터를 가지고 화면에 출력한다.
쿠키 추출
특정 쿠키만 추출할 수 없기에 배열로 모든 쿠키를 받아온다.
getName(): 쿠키 이름 추출
>> 쿠키 생성 시, 삽입했던 쿠키 이름
getValue(): 쿠키 값 추출
>> 쿠키 생성 시, 삽입했던 값
- Cookie[] ar = request.getCookies();
- cookie.getName();
- cookie.getValue();
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%
String name = null;
String id = null;
// 쿠키 받기
Cookie[] ar = request.getCookies(); // 특정 쿠키만을 가져오지 못하고, 모든 쿠키를 한번에 추출
if(ar != null) {
for(Cookie c : ar) {
String cookieName = c.getName();
String cookieValue = c.getValue();
System.out.println("쿠키명: " + cookieName);
System.out.println("쿠키값: " + cookieValue);
System.out.println();
if(cookieName.equals("memName")) name = c.getValue();
if(cookieName.equals("memId")) id = c.getValue();
}
}
%>
<%=name %>
출력값을 보면 위에서 추가했던 쿠키 2개가 출력된 것이 아니라 3개가 출력되었다.
마지막 쿠키는 컴퓨터 정보이다. 이를 통해 사용자를 찾아낼 수 있다.
2-2. HttpSession
: 웹 서버에 저장
// session: JSP 내장 객체! 따라서 세션 객체를 생성하지 않고 사용 가능
// HttpSession session = request.getSession();
memberLogin.jsp
<%@page import="java.net.URLEncoder"%>
<%@page import="DAO.MemberDAO"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%
MemberDAO memberDAO = MemberDAO.getInstance();
String id = request.getParameter("id");
String pwd = request.getParameter("pwd");
String loginName = memberDAO.login(id, pwd);
%>
<%if(loginName == null) {
// 페이지 이동
response.sendRedirect("loginFail.jsp");
}else {
// 세션
session.setAttribute("memName", loginName); // 기본 30분
session.setAttribute("memId", id);
response.sendRedirect("loginOk.jsp");
}
%>
3. Connection Pool
웹 컨테이너(WAS)가 실행되면서 DB와 미리 connection(연결)을 해놓은 객체들을 pool에 저장해두었다가 클라이언트 요청이 오면 connection을 빌려주고, 처리가 끝나면 다시 connection을 반납받아 pool에 저장하는 방식
( Pool은 connection을 저장하는 공간이다! )
사용법
MemberDAO 생성자
Context context = new InitialContext();
- 컨텍스트 생성
- InitialContext 객체를 생성하여 JNDI 컨텍스트를 가져옴.
- 이 컨텍스트를 통해 JNDI 리소스 조회
context.lookup("java:comp/env/jdbc/mysql");
- 리소스 조회
- lookup 메서드를 사용하여 등록된 리소스 조회
DataSource
- 데이터베이스 연결을 풀링하고 관리하기 위해 사용되는 인터페이스
public MemberDAO() {
Context context; // Context 인터페이스
try {
context = new InitialContext(); // InitialContext 객체로 생성
ds = (DataSource) context.lookup("java:comp/env/jdbc/mysql"); // Tomcat의 경우에만
} catch (NamingException e) {
e.printStackTrace();
}
}
기존에 드라이버를 직접 연결할 때는 getConnection 함수를 오버로드를 하였다.
Connection Pool 방법을 사용할 때는 DataSource의 getConnection 함수를 호출하여 사용한다.
출처
https://velog.io/@mstar228/Connection-Pool%EC%9D%B4%EB%9E%80
'비트캠프 > 이론 및 정리' 카테고리의 다른 글
| 49일차_MyBatis (0) | 2024.09.10 |
|---|---|
| 48일차_페이징, MyBatis 맛보기 (0) | 2024.09.09 |
| 47일차_회원정보 수정 (0) | 2024.09.09 |
| 45일차_회원가입 (0) | 2024.09.05 |
| 45일차_JSP 전역 vs 지역, 주석 (2) | 2024.09.05 |
