JSP&Servlet/기초정리

MyBatis 회원정보수정 기능 구현

줘니(•̀ᴗ•́)و 2023. 2. 15. 12:27
728x90

* MyBatis 실습하면서 배우기!

 

- 회원정보수정 만들기

 

 

0) Main.jsp 파일에서 실습 부분

 

 

 

전 포스팅에 있는 헤더의 개인정보 수정에 update.jsp 파일을 연결해준 부분.

이제 연결해서 수행할 파일들을 만들어 줄 것이다!

 

 

 

1) update.jsp 파일

 

 

 

<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
   
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
	<head>
		<title>Forty by HTML5 UP</title>
		<meta charset="UTF-8" />
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
		<link rel="stylesheet" href="assets/css/main.css" />
		
	</head>
	<style>
	
	</style>
	<body style="text-align: center;">

		<!-- Wrapper -->
			<div id="wrapper">
				<!-- Menu -->
					<nav id="Update">	
						<ul class="actions vertical">
							<li><h5>회원정보수정</h5></li>
							<!-- 1. 데이터 전송을 위한 form 태그의 기본 내용 : action(UpdateService), name, submit -->
							<form action="UpdateService" method="post">
								<li>접속한 Email : ${member.email}</li>
								<li><input type="password" name="pw" placeholder="PW를 입력하세요" style="width: 500px; margin: 0 auto;"></li>
								<li><input type="text" name="tel" placeholder="전화번호를 입력하세요" style="width: 500px; margin: 0 auto;"></li>
								<li><input type="text" name="address" placeholder="집주소를 입력하세요" style="width: 500px; margin: 0 auto;"></li>
								<li><input type="submit" value="JoinUs" class="button fit" style="width: 500px; margin: 0 auto;"></li>
							</form>
						</ul>
					</nav>			
			</div>
		<!-- Scripts -->
			<script src="assets/js/jquery.min.js"></script>
			<script src="assets/js/jquery.scrolly.min.js"></script>
			<script src="assets/js/jquery.scrollex.min.js"></script>
			<script src="assets/js/skel.min.js"></script>
			<script src="assets/js/util.js"></script>
			<!--[if lte IE 8]><script src="assets/js/ie/respond.min.js"></script><![endif]-->
			<script src="assets/js/main.js"></script>
	</body>
</html>

 

 

 

2) UpdateService 서블릿 파일 - 임시(최종아님!!!! 최종은 맨 아래에)

여기는 차근차근 해 나가 보자!

 

1. 요청된 값에 대한 인코딩

2. 요청받은 데이터 가져오기

3. DB 연결을 위해 만들어진 DAO를 통해 실제 update 기능 수행할 메소드 연결

4. 수정 성공 시 수정하고 메인페이지로

 

우선 이거 먼저 수행한 코드

 

package com.smhrd.controller;

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 javax.servlet.http.HttpSession;

import com.smhrd.model.MemberDAO;
import com.smhrd.model.MemberVO;


@WebServlet("/UpdateService")
public class UpdateService extends HttpServlet {
	private static final long serialVersionUID = 1L;

	protected void service(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {

		// 1. 요청된 값에 대한 인코딩 -> 비밀번호, 전화번호, 주소(한글포함)
		request.setCharacterEncoding("utf-8");
		
		// 2. 요청받은 데이터 가져오기
		String pw = request.getParameter("pw");
		String tel = request.getParameter("tel");
		String address = request.getParameter("address");

		// 3. DB 연결을 위해 만들어진 DAO를 통하여 실제 update 기능을 수행할 수 있는 메소드 연결하기
		MemberDAO dao = new MemberDAO();
		// 3개 데이터 한번에 묶을 수 있는 MemberVO 객체 생성
		MemberVO vo = new MemberVO(pw, tel, address);
		// MemberDAO에 만들어놓은 update 메소드 불러오기
		int result = dao.update(vo);
		
		// 4. 수정 성공 시 수정하고 메인페이지로
		// n행이 업데이트 되었습니다. -> int
		if(result > 0) {
			// 수정 성공
			session.setAttribute("member", vo);
		}
		RequestDispatcher rd = request.getRequestDispatcher("main.jsp");
		rd.forward(request, response);
	}

}

 

 

 

3) MemberVO 추가할 부분 (최종 이후 없어도 될,,)

 

	// 3개의 데이터를 받을 수 있는 생성자 메소드
	public MemberVO(String pw, String tel, String address) {
		this.pw = pw;
		this.tel = tel;
		this.address = address;
	}

 

 

 

4) MemberDAO 파일에 update 메소드 추가

 

public int update(MemberVO vo) {
		
	// 1. connection 빌려오기
	SqlSession session = sqlSessionFactory.openSession(true);
		
	// 2. sql 문장 실행 - 수행하고 싶은 sql 문장 연결하기(mapper.xml)
	int cnt = 0;
	try {
		cnt = session.update("update", vo);		
	} finally {
		// 3. 객체 닫기
		session.close();
	}
	return cnt;
}

 

 

 

5) MemberMapper.xml 파일에 sql문 작성

: mapper태그 안에 update문 추가

 

★ 여기서 보면 where절에 "email" 데이터가 필요하게 됨!  

그래서 UpdateService 서블릿 파일 내용에 추가할 게 생김!

 

<update id="update" parameterType="com.smhrd.model.MemberVO">
	update web_member set pw=#{pw}, tel=#{tel}, address=#{address} where email=#{email}
</update>

 

 

 

6) UpdateService 서블릿 파일 - 최종

: 보낼 sql문(update문) where절에 "email" 데이터가 필요!

로그인 성공 시 생성된 session에 데이터(email, pw, tel, address)가 저장되어 있음

 

 

5. 그 session에 저장된 email 데이터를 불러와 vo에 같이 묶어주기

(pw, tel, address 데이터는 요청받은 데이터(입력데이터)를 가져오기 때문에 session에 저장된 데이터를 가져오는 게 아님)

 

 

1) 세션은 내장객체가 아니라 객체를 먼저 생성하고 저장된 데이터를 불러와줘야 한다.

: HttpSession session = request.getSession();

주의!) 세션에서 바로 email 데이터에 접근할 수 있는 게 아님!(session엔 데이터 4개가 들어가 있음)

2) 먼저 "member" 세션에 있는 4개 데이터를 하나로 묶을 수 있는 MemberVO 객체 이용해 "memberSession"에 담아준다!(다운캐스팅 필요)

: MemberVO memberSession = (MemberVO)session.getAttribute("member");

3) memberSession에 담긴 4개의 데이터(MemberVO에 있는 4개 데이터 받을 수 있는 생성자에 담긴) 중 email만 꺼내줘!(MemberVO - getter 메소드): String email = memberSession.getEmail();

 

 

6. pw, tel, address 중 일부만 수정했을 때

: 수정하지 않은 부분(사용자가 아무것도 입력하지 않을 시)

session에 저장된 값을 불러와 그 데이터 그대로 유지되게 만들자!

 

 

 

package com.smhrd.controller;

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 javax.servlet.http.HttpSession;

import com.smhrd.model.MemberDAO;
import com.smhrd.model.MemberVO;


@WebServlet("/UpdateService")
public class UpdateService extends HttpServlet {
	private static final long serialVersionUID = 1L;

	protected void service(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {

		// 1. 요청된 값에 대한 인코딩 -> 비밀번호, 전화번호, 주소(한글포함)
		request.setCharacterEncoding("utf-8");
		
		// 2. 요청받은 데이터 가져오기
		String pw = request.getParameter("pw");
		String tel = request.getParameter("tel");
		String address = request.getParameter("address");
		
		// 5. session에 저장된 email데이터를 불러와 vo에 같이 묶어주기
		HttpSession session = request.getSession();
		MemberVO memberSession = (MemberVO)session.getAttribute("member");
		String email = memberSession.getEmail();
		
		// 6. 3개 중 일부만 수정했을 때
		if(pw.equals("")) {
			pw = memberSession.getPw();
		}
		if(tel.equals("")) {
			tel = memberSession.getTel();
		}
		if(address.equals("")) {
			address = memberSession.getAddress();
		}
        
		// 3. DB 연결을 위해 만들어진 DAO를 통하여 실제 update 기능을 수행할 수 있는 메소드 연결하기
		MemberDAO dao = new MemberDAO();
		MemberVO vo = new MemberVO(email, pw, tel, address);
		// MemberDAO에 만들어놓은 update 메소드 불러오기
		int result = dao.update(vo);
		
		// 4. 수정 성공 시 수정하고 메인페이지로
		// n행이 업데이트 되었습니다. -> int
		if(result > 0) {
			// 수정 성공
			session.setAttribute("member", vo);
		}
		RequestDispatcher rd = request.getRequestDispatcher("main.jsp");
		rd.forward(request, response);
	}

}

 

 

 

내가 해냈다! 😁😁

나는 해낸다!

 

 

 

728x90