-1- 로그인
1. index.jsp
- 로그인 링크 눌러서 Login.java로 get 방식으로 감.
<a href = "${pageContext.request.contextPath }/member/login">로그인</a>
${pageContext.request.contextPath}
-- 현재 페이지의 기본경로 -- /프로젝트명
2. Login.java
- doGet() -- 로그인 폼 불러옴. (login.jsp)
RequestDispatcher dis = request.getRequestDispatcher("/member/login.jsp");
dis.forward(request, response);
3. login.jsp
- id 와 pwd 입력하고 로그인 버튼을 눌러 submit 하면 Login.java 로 post 방식으로 감.
<form action="${pageContext.request.contextPath }/member/login" method = "post">
4. Login.java
- doPost() -- 로그인에 성공하면 index.jsp로 가고, 로그인에 실패하면 login.jsp에 실패 메시지 띄움.
- 로그인 한 id값은 로그인 해 있는 동안 계속 가지고 있어야 할 정보이기 때문에 session에 값을 담음.
--- pwd.equals(vo.getPwd()) && vo != null 로 순서를 바꾸면,
검색된 vo가 없을 경우 vo.getPwd()가 없게 되므로 nullpointerror 뜸.
=> 이렇게 되면 &&의 앞 조건이 false가 돼서 뒤 조건까지 넘어가지 않고 바로 error 처리 됨.
String path = "/member/login.jsp"; // 뷰페이지 경로 담기. (실패시)
if(vo != null && pwd.equals(vo.getPwd())) { // id로 검색된 게 있고 pwd도 일치함
HttpSession session = request.getSession(); // session 획득
session.setAttribute("loginId", id); //계속 기억할 필요가 있는 것 -- session
path = "/index.jsp"; // 로그인 성공시 뷰페이지 주소 바꿔줌.
} else {
request.setAttribute("msg", "로그인실패"); //계속 기억할 필요없는 것 -- request
}
RequestDispatcher dis = request.getRequestDispatcher(path);
dis.forward(request, response);
4-1. login.jsp
${} EL 표현식은 값이 있으면 그 값을 보여주고, 없으면 error 대신 아무것도 띄우지 않는다.
${msg }<br/>
-2- 회원가입
1. login.jsp
- 회원가입 링크를 누르면 Join.java 로 get 방식으로 감.
<a href = "${pageContext.request.contextPath}/member/join">회원가입</a>
2. Join.java
- doGet() -- 회원가입 폼을 불러오기 위해 /member/join.jsp로 감
RequestDispatcher dis = request.getRequestDispatcher("/member/join.jsp");
dis.forward(request, response);
3. join.jsp
- id를 입력하고 id중복체크 버튼을 누르면 새 윈도우 창이 열림.
<head>
<script>
function idcheck(){
let win = open('idcheck.jsp', 'win', 'width=300, height=150 top=300, left=300');
}
</script>
</head>
<body>
<input type="text" name="id">
<input type="button" value="id중복체크" onclick="idcheck()">
</body>
open('이 창에 띄울 jsp페이지', '새 윈도우 이름', '윈도우 설정');
-- 새 윈도우(팝업창)를 생성
-- 윈도우 설정 : width:가로길이, height:세로길이, top:수직위치, left:수평위치, ...
-- 리턴값 : 생성된 윈도우 객체
4. idcheck.jsp
- 윈도우 창이 열리자마자 function() 함수 실행됨.
- open() 함수로 새 페이지가 열리는 것도 get 방식임. --> join.jsp(opener)에 입력한 id 값이 idcheck.jsp에 그대로 뜸.
- 체크 버튼을 눌러 submit 하면 post 방식으로 IdCheck.java 로 넘어감. --> function()의 else 실행
- ${flag} 는 입력한 id 값이 DB에 있는지 검색해서 그 결과가 null이 될 때 true. (즉, 검색결과 없음으로 중복 아님)
- 아이디가 중복이 아닐 때에는 "사용가능한 아이디" 메시지가 form 아래의 <div></div> 사이에 출력됨.
--- 아이디 사용 버튼을 누르면 a() 함수 호출. 현재 윈도우창(idcheck.jsp)에 적은 아이디를 회원가입폼 (join.jsp)에 넣고 창 닫기.
- 아이디가 중복일 때에는 "중복된 아이디" 메시지가 form 아래의 <div></div>사이에 출력됨.
<head>
<script>
window.onload = function() {
if ('${pageContext.request.method}' == 'GET') { // method가 get일때
ff.id.value = opener.document.f.id.value; // join.jsp에 입력한 값 가져오기
} else { // method가 post일때
let html = "";
if ('${flag}' == 'true') {
html = "사용가능한 아이디";
let val = '${id}'
ff.id.value = val;
html += "<input type='button' value='아이디사용' onclick='a(\""+val+"\")'>";
} else {
html = "중복된 아이디";
}
let div = document.getElementById("res");
div.innerHTML = html;
}
}
function a(id){
opener.document.f.id.value = id; // 팝업창에 적은 아이디를 회원가입폼에 넣기
close(); // 현재 윈도우창 닫기
}
</script>
</head>
<body>
<h3>id중복체크</h3>
<form action="${pageContext.request.contextPath}/member/idcheck" method="post" name="ff">
id:<input type="text" name="id">
<input type="submit" value="체크">
</form>
<div id = 'res'> </div>
</body>
${pageContext.request.method}
-- 전송방식 값을 갖는 속성 (GET, POST)
opener : 팝업창을 띄운 주체 (join.jsp)
openee : 팝업창 본인 (idcheck.jsp)
"<input type='button' value='아이디사용' onclick='a(\""+val+"\")'>"
- 따옴표를 다 써서 \"를 써서 따옴표 분리해줌. -- 이스케이프 문자 ""asdf"" -> \""asdf"\"
-- /" 를 쓰지 않으면 "val" 이라는 문자열(String)으로 처리됨. 우리는 문자열이 아니라 변수로 쓰고 싶은거임!!
close();
-- 현재 윈도우 창 닫기
5. IdCheck.java
- idcheck의 기능은 id값이 중복인지 아닌지만 검사하면 되기 때문에 doGet()만 만들어 사용.
- id 값과 동일한 id값을 가진 vo가 있는지 service 메소드로 db 검색함. -- 그 결과를 flag에 담아 if문 실행.
- flag의 값을 request에 담음
- id가 중복되지 않으면 flag값(true)과 id값을 request에 담아 idcheck.jsp로 넘어감. --> "사용가능한 아이디"
- id가 중복이면 id값을 담지 않고 flag값(false)만 담은 채 idcheck.jsp로 넘어감. --> "중복된 아이디"
- request는 response 되어야 종료됨. (Join.java에서 회원가입을 완료 해야 response 전달됨)
-- 즉, 아직 request는 살아있기 때문에 값을 가지고 서버 내에서 이동함.
====> idcheck.jsp의 function()에서 else문이 반복 실행됨. (id가 중복인 한)
---- 계속 post방식으로 Servlet으로 이동하고 doPost()는 doGet()을 호출함.
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
String id = request.getParameter("id");
MemberService service = new MemberService();
MemberVo vo = service.getMember(id); // id로 검색
//id 중복여부 체크
boolean flag = (vo == null); // 중복되지 않으면(null이면) true, 중복이면 false
request.setAttribute("flag", flag);
if(flag) { // id가 중복되지 않았다면
//ff.id.value = opener.document.f.id.value; 역할
request.setAttribute("id", id); //idcheck.jsp에 출력하기 위해서 request에 담음
}
RequestDispatcher dis = request.getRequestDispatcher("/member/idcheck.jsp");
dis.forward(request, response); // 서버 내에서 이동. request 살아있음. 여전히 post 방식으로 전송됨.
}
protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
doGet(request, response);
}
6. join.jsp
- id 중복체크를 마치면 다시 회원가입 폼으로 돌아옴.
- 폼을 다 채우고 가입버튼을 눌러 submit 하면 Join.java로 post 방식으로 감.
<h3>회원가입</h3>
<form name = "f" action="${pageContext.request.contextPath}/member/join" method="post">
<table border="1">
<tr><th>가입</th><td><input type="submit" value="가입"></td></tr>
</table>
</form>
7. Join.java
- 회원가입 폼에 입력한 값을 변수에 담고 service 메소드를 통해 DB에 넣음.
- 회원가입 request를 종료시키기 위해 response를 redirect로 전달. --- request에 저장한 데이터 모두 삭제됨.
--- forward 방식을 쓰면 request가 종료되지 않기 때문에 같은 정보로 회원가입이 계속 재실행됨. -> error!!
String id = request.getParameter("id");
String pwd = request.getParameter("pwd");
String name = request.getParameter("name");
String email = request.getParameter("email");
MemberService service = new MemberService();
service.join(new MemberVo(id, pwd, name, email));
response.sendRedirect(request.getContextPath()+"/index.jsp");
response.sendRedirect(request.getContextPath()+"/index.jsp");
redirect : 클라이언트에게 페이지를 새로 요청하도록 시킴.
--> request가 종료되며 request에 저장된 데이터 모두 삭제됨.
--> 클라이언트가 외부에서 접근해오기 때문에 이동할 페이지의 기본 경로가 필요함. /프로젝트명/
request.getContextPath() : 이동할 페이지의 기본 경로
-3- 로그아웃
1. index.jsp
- 로그아웃 링크를 누르면 Logout.java로 이동
<a href="${pageContext.request.contextPath }/member/logout">로그아웃</a>
2. Logout.java
- doGet() -- 로그인 했을 때 session에 담은 id값을 무효화시킴 -> 로그아웃 처리됨
- 단계가 하나밖에 없으므로 doPost() 까지 필요하진 않음.
HttpSession session = request.getSession(false); //쓰던 세션 가져와라. 새 세션 말고.
session.invalidate(); // 세션 무효화 -> 자동으로 새 세션 만들어짐
RequestDispatcher dis = request.getRequestDispatcher("/index.jsp");
dis.forward(request, response);
-4- 내 정보 확인
1. index.jsp
- 내정보확인 링크를 누르면 session에 담긴 id값과 함께 MyInfo.java로 넘어감.
<a href="${pageContext.request.contextPath}/member/myinfo?id=${sessionScope.loginId}">내정보확인</a>
2. MyInfo.java
-5- 탈퇴
1. index.jsp
- 탈퇴 링크를 누르면 session에 담긴 id값과 함께 Out.java로 넘어감.
<a href="${pageContext.request.contextPath }/member/out?id=${sessionScope.loginId}">탈퇴</a>
0. 총 코드