Java 웹 개발

21.10.19 - 웹 개발 입문 47일차

개발이란 2021. 10. 19. 19:05

홈페이지 구현하기(2)

 

<알아둘 것>

세션(session)의 특징
= 세션은 서버에서 관리하는 사용자를 위한 저장소이다.
= 세션은 서버에 총 1개 존재한다.
= 세션에서 각 사용자는 16진수 32자리로 구성된 세션ID로 구분한다.
= 웹 서비스에서는 사용자가 Browser이다.

= 세션에 저장된 정보는 사용자가 임의로 볼 수 없다.
= 보안 수준이 매우 높음
= 가장 중요한 정보를 이곳에 저장

= 1개의 세션으로 모든 사용자 정보를 관리해야 한다.
= 사용자가 늘어날 수록 저장해야할 정보가 많아진다.
= 대규모 서비스일 수록 세션을 안쓰려고 노력하는 편이다.

= 일정시간동안 요청이없는 세션은 자동으로 소멸 처리가 된다.
= 시간은 web.xml 파일에서 지정이 가능하다.

= 이러한 저장소를 scope 객체라고 부른다(page, request, session, application)

= (주의) 로그인과 세션은 동일한 개념이 아니므로 만료시 꼭 소멸시킬 필요가 없다

 

- ex> 세션 예제 ( 세션ID는 다른 Browser로 접근시 계속 변경된다 )

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>

<h1>세션 ID : <%=session.getId() %></h1>
<h1>신규 세션? : <%=session.isNew() %></h1>

 

- 템플릿페이지 header.jsp 수정

로그인, 로그아웃 상태에 따른 보여지는 메뉴 변경

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Homepage</title>
</head>
<body>

	<table border="1" width="1000" align="center">
		<tbody align="center">
			<tr>
				<td>
					<br>
					<img src="/home/resource/image/apple.png" width="250" height="50">
					<h3>Apple 공식사이트</h3>
				</td>
			</tr>
			<tr>
				<td>
					 <%
					 	String root = request.getContextPath();
					 %>
                     
					 <%if(login){ %>
					 <a href="<%=root%>/index.jsp">홈으로</a>
				   	 <a href="<%=root%>/member/logout.txt">로그아웃</a>
					 <a href="<%=root%>/member/mypage.jsp">내정보</a>
				     <a href="#">게시판</a>
					 <%}else{ %>
					 <a href="<%=root%>/index.jsp">홈으로</a>
					 <a href="<%=root%>/member/join.jsp">회원가입</a>
					 <a href="<%=root%>/member/login.jsp">로그인</a>
					 <a href="#">게시판</a>
					<%} %>
				</td>
			</tr>
			<tr>
				<td>

 

 

- 로그아웃 페이지 만들기

- 로그아웃 처리 서블릿(MemberLogoutServlet.java) 만들기

package home.servlet.member;

import java.io.IOException;

import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

@WebServlet(urlPatterns = "/member/logout.txt")
public class MemberLogoutServlet extends HttpServlet{
	@Override
	protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
		try {
			//세션에서의 사용자의 로그인 정보를 삭제
			//= 서블릿에서는 세션을 req.getSession() 형태로 접근
			req.getSession().removeAttribute("ses");//세션의 항목삭제 명령
			//req.getSession().invalidate();//세션파괴명령
			
			resp.sendRedirect(req.getContextPath());	
		}
		catch(Exception e) {
			e.printStackTrace();
			resp.sendError(500);
		}
	}
}

 

 

- 내 정보 보기 페이지 만들기

- 내 정보 보기 메인 페이지(mypage.jsp) 만들기

이메일, 전화번호 정보가 없으면 'null'이 나올 수 있다.

-> null이 안나오게 MemberDto에 만든 기능을 사용해야 한다

	public String getMemberEmailString() {
		if(memberEmail == null) 
			return "";
		else
			return memberEmail;
	}
    
    	public String getMemberPhoneString() {
		if(memberPhone == null)
			return "";
		else
			return memberPhone;
	}

 

<%@page import="home.beans.MemberDto"%>
<%@page import="home.beans.MemberDao"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%-- 입력 : 현재 로그인한 회원ID - String memberId --%>
<%
	String memberId = (String) session.getAttribute("ses");
%>

<%-- 처리 : 회원정보(MemberDto) --%>
<%
	MemberDao memberDao = new MemberDao();
	MemberDto memberDto = memberDao.get(memberId);
%>

<%-- 출력 --%>   
<jsp:include page="/template/header.jsp"></jsp:include>

<h2>회원 상세 정보</h2>

<table border="1" width="300">
	<tbody>
		<tr>
			<th width="25%">아이디</th>
			<td><%=memberDto.getMemberId()%></td>
		</tr>
		<tr>
			<th>닉네임</th>
			<td><%=memberDto.getMemberNick()%></td>
		</tr>
		<tr>
			<th>생년월일</th>
			<td><%=memberDto.getMemberBirthDay()%></td>
		</tr>	
		<tr>
			<th>이메일</th>
			<td><%=memberDto.getMemberEmailString()%></td>
		</tr>
		<tr>
			<th>전화번호</th>
			<td><%=memberDto.getMemberPhoneString()%></td>
		</tr>		
		<tr>
			<th>가입일시</th>
			<td><%=memberDto.getMemberJoin()%></td>
		</tr>
		<tr>
			<th>포인트</th>
			<td><%=memberDto.getMemberPoint()%></td>
		</tr>
		<tr>
			<th>등급</th>
			<td><%=memberDto.getMemberGrade()%></td>
		</tr>							
	</tbody>
</table>

<h3><a href="password.jsp">비밀번호 변경</a></h3>
<h3><a href="edit.jsp">개인정보 변경</a></h3>
<h3><a href="quit.txt">회원 탈퇴</a></h3>

<jsp:include page="/template/footer.jsp"></jsp:include>

 

 

 

- 비밀번호 변경 페이지 만들기

- 비밀번호 변경 메인 페이지(password.jsp) 만들기

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>

<jsp:include page="/template/header.jsp"></jsp:include>

<h2>비밀번호 변경</h2>

<form action="password.txt" method="post">

	<table>
		<tbody>
			<tr>
				<th>현재 비밀번호</th>
				<td>
					<input type="password" name="memberPw" required>
				</td>
			</tr>
			<tr>
				<th>바꿀 비밀번호</th>
				<td>
					<input type="password" name="changePw" required>
				</td>
			</tr>
		</tbody>
		<tfoot>
			<tr>
				<td colspan="2" align="center">
					<input type="submit" value="변경">
				</td>
			</tr>
		</tfoot>
	</table>

</form>

<%if(request.getParameter("error") != null){ %>
	<h4><font color="red">입력하신 정보가 일치하지 않습니다</font></h4>
<%} %>

<jsp:include page="/template/footer.jsp"></jsp:include>

 

 

- 비밀번호 변경 처리 서블릿(MemberPasswordServlet.java) 만들기

입력 부분 객체로 받을 지, 낱개로 받을 지 선택 해서 진행

package home.servlet.member;

import java.io.IOException;

import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

import home.beans.MemberDao;
import home.beans.MemberDto;

@WebServlet(urlPatterns = "/member/password.txt")
public class MemberPasswordServlet extends HttpServlet{
	@Override
	protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
		try {
			//입력
			req.setCharacterEncoding("UTF-8");

			//ex : 객체
			MemberDto memberDto = new MemberDto();
			memberDto.setMemberId((String)req.getSession().getAttribute("ses"));
			memberDto.setMemberPw(req.getParameter("memberPw"));
			String changePw = req.getParameter("changePw");

			//ex : 낱개
			//String memberId = (String)req.getSession().getAttribute("ses");
			//String memberPw = req.getParameter("memberPw");
			//String changePw = req.getParameter("changePw");

			//처리
			MemberDao memberDao = new MemberDao();
			boolean success = memberDao.editPassword(memberDto, changePw);
			//boolean success = memberDao.editPassword(memberId, memberPw, changePw);

			//출력
			if(success) {
				resp.sendRedirect("password_success.jsp");
			}
			else {
				resp.sendRedirect("password.jsp?error");
			}
		}
		catch(Exception e) {
			e.printStackTrace();
			resp.sendError(500);
		}
	}
}

 

 

- 비밀번호 변경 완료 페이지 (password_success.jsp) 만들기

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>

<jsp:include page="/template/header.jsp"></jsp:include>

<h2>비밀번호 변경 완료</h2>

<h5><a href="<%=request.getContextPath()%>">메인 페이지로</a></h5>
<h5><a href="mypage.jsp">내 정보 보기</a></h5>

<jsp:include page="/template/footer.jsp"></jsp:include>

 

 

 

- 개인정보 변경 페이지 만들기

- 개인정보 변경 메인 페이지(edit.jsp) 만들기

현재 계정 정보 먼저 나오게 구현하기

<%@page import="home.beans.MemberDto"%>
<%@page import="home.beans.MemberDao"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>

<%-- 입력 : memberId (session) --%>
<%
	String memberId= (String) session.getAttribute("ses");
%>

<%-- 처리 --%>
<%
	MemberDao memberDao = new MemberDao();
	MemberDto memberDto = memberDao.get(memberId);
%>

<%-- 출력 --%>
<jsp:include page="/template/header.jsp"></jsp:include>

<h2>개인정보 변경</h2>

<form action="edit.txt" method="post">

	<table>
		<tbody>
			<tr>
				<th>비밀번호</th>
				<td>
					<input type="password" name="memberPw" required>
				</td>
			</tr>
			<tr>
				<th>닉네임</th>
				<td>
					<input type="text" name="memberNick" value="<%=memberDto.getMemberNick()%>" required>
				</td>
			</tr>
			<tr>
				<th>생년월일</th>
				<td>
					<input type="date" name="memberBirth" value="<%=memberDto.getMemberBirthDay()%>" required>
				</td>
			</tr>
			<tr>
				<th>이메일</th>
				<td>
					<input type="email" name="memberEmail" value="<%=memberDto.getMemberEmailString()%>">
				</td>
			</tr>
			<tr>
				<th>전화번호</th>
				<td>
					<input type="tel" name="memberPhone" value="<%=memberDto.getMemberPhoneString()%>">
				</td>
			</tr>									
		</tbody>
		<tfoot>
			<tr>
				<td colspan="2" align="center">
					<input type="submit" value="변경">
				</td>
			</tr>
		</tfoot>
	</table>

</form>

<%if(request.getParameter("error") != null){ %>
	<h4><font color="red">입력하신 정보가 일치하지 않습니다</font></h4>
<%} %>

<jsp:include page="/template/footer.jsp"></jsp:include>

 

- 개인정보 변경 처리 서블릿(MemberEditServlet.java) 만들기

package home.servlet.member;

import java.io.IOException;

import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

import home.beans.MemberDao;
import home.beans.MemberDto;

@WebServlet(urlPatterns = "/member/edit.txt")
public class MemberEditServlet extends HttpServlet{
	@Override
	protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
		try {
			//입력 : MemberDto
			//= 세션 : memberId
			//= 파라미터 : memberPw, memberNick, memberBirth, memberEmail, memberPhone
			req.setCharacterEncoding("UTF-8");
			MemberDto memberDto = new MemberDto();
			memberDto.setMemberId((String)req.getSession().getAttribute("ses"));//세션
			memberDto.setMemberPw(req.getParameter("memberPw"));//파라미터
			memberDto.setMemberNick(req.getParameter("memberNick"));//파라미터
			memberDto.setMemberBirth(req.getParameter("memberBirth"));//파라미터
			memberDto.setMemberEmail(req.getParameter("memberEmail"));//파라미터
			memberDto.setMemberPhone(req.getParameter("memberPhone"));//파라미터

			//처리
			MemberDao memberDao = new MemberDao();
			boolean success = memberDao.edit(memberDto);

			//출력
			if(success) {
				resp.sendRedirect("edit_success.jsp");
			}
			else {
				resp.sendRedirect("edit.jsp?error");
			}
		}
		catch(Exception e) {
			e.printStackTrace();
			resp.sendError(500);
		}
	}
}

 

 

- 개인정보 변경 완료 페이지 (edit_success.jsp) 만들기

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>

<jsp:include page="/template/header.jsp"></jsp:include>

<h2>개인정보 변경 완료</h2>

<h5><a href="<%=request.getContextPath()%>">메인 페이지로</a></h5>
<h5><a href="mypage.jsp">내 정보 보기</a></h5>

<jsp:include page="/template/footer.jsp"></jsp:include>