오늘이라도

[Web] 16. MyBatis로 회원 정보 관리 구현 본문

취업성공패키지 SW 개발자 교육/Web

[Web] 16. MyBatis로 회원 정보 관리 구현

upcake_ 2020. 5. 29. 09:43
반응형

https://github.com/upcake/Class_Examples

교육 중에 작성한 예제들은 깃허브에 올려두고 있습니다. 

gif 파일은 클릭해서 보는 것이 정확합니다.


 - MyBatis로 회원 정보 관리 구현 -

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>회원가입 입력 화면</title>
</head>
<body>
<div align="center">
	<form action="memberInsert.jsp" method="post">
	<table border="1">
		<tr>
			<th>이름</th>
			<td><input type="text" name="irum" required="required" /></td>
		</tr>
		<tr>
			<th>아이디</th>
			<td><input type="text" name="id" required="required" /></td>
		</tr>
		<tr>
			<th>비밀번호</th>
			<td><input type="password" name="pw" required="required" /></td>
		</tr>
		<tr>
			<th>나이</th>
			<td><input type="number" name="age" required="required" /></td>
		</tr>
		<tr>
			<th>주소</th>
			<td><input type="text" name="addr" required="required" /></td>
		</tr>
		<tr>
			<th>전화번호</th>
			<td><input type="text" name="tel" required="required" /></td>
		</tr>
		<tr>
			<td colspan="2" align="center"> 
				<input type="submit" value="회원가입" />
				<input type="reset" value="초기화" />
				<input type="button" value="회원 목록 보기" onclick="location.href='memberList.jsp'" />
			</td>
		</tr>
	</table>
	</form>
</div>
</body>
</html>

▲MemberMain.html : 회원가입 입력 화면

 

▼memberMapper.xml : SQL 문장을 작성하는 곳

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE mapper
PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN"
"http://mybatis.org/dtd/mybatis-3-mapper.dtd">
<mapper namespace="com.hanul.mybatis.memberMapper.xml">
	<!-- SQL 문장 작성 -->
	<!-- 
		<insert | delete | update | select 속성="값" 속성="값 ~~>
			- id 속성 : DAO에서 설정한 값 ▶ session.insert("memberInsert", dto);
			- parameterType 속성 : 매개 변수 타입(클래스타입, 기본데이터타입) : 생략 가능
			- 입력 값 표기 : dto.getIrum() → #{dto 內 속성명} ▶ #{irum}
			- SQL 문장의 마지막에 세미콜론(;)은 입력하지 않는다. 
			- resultType 속성 : select 쿼리를 수행했을 때 결과 타입
		</insert | delete | update | select>
	 -->
	 <!-- id에는 DAO에서 정한 메서드 이름을 적는다. -->
	 <!-- 여기서 MemberDTO는 SqlMapConfig에서 지정한 alias이다. -->
	 <insert id="memberInsert" parameterType="MemberDTO">
	 	INSERT INTO member VALUES(#{irum}, #{id}, #{pw}, #{age}, #{addr}, #{tel})
	 </insert>
	 
	 <!-- 가져오는 칼럼이 MemberDTO 타입 -->
	 <select id="memberSearchAll" resultType="MemberDTO">
	 	SELECT * FROM member
	 </select>
	 
	 <delete id="memberDelete" parameterType="String">
	 	DELETE FROM member WHERE id = #{id}
	 </delete>
	 
	 <select id="getById" parameterType="String" resultType="MemberDTO">
	 	SELECT * FROM member WHERE id = #{id}
	 </select>
	 
	  <update id="memberUpdate" parameterType="MemberDTO">
	 	UPDATE member SET irum = #{irum}, pw = #{pw}, age = #{age},
	 						 addr = #{addr}, tel = #{tel} WHERE id = #{id} 
	 </update>
	
</mapper>

 

▼MemberDAO.java : 기능을 담당하는 클래스

package com.hanul.study;

import java.io.InputStream;
import java.util.List;

import org.apache.ibatis.io.Resources;
import org.apache.ibatis.session.SqlSession;
import org.apache.ibatis.session.SqlSessionFactory;
import org.apache.ibatis.session.SqlSessionFactoryBuilder;

public class MemberDAO {
	//기존 JDBC 모델에서는 Connection(DB 연결)을 먼저 만들었지만,
	//myBatis 경우 SqlSessionFactory 객체를 먼저 생성
	private static SqlSessionFactory sqlMapper;
	//스태틱 블록(초기화 블록) : 가장 먼저, 단 한번만 실행 되는 블록
	static {
		String resource = "com/hanul/mybatis/SqlMapConfig.xml";
		try {
			InputStream inputStream = Resources.getResourceAsStream(resource);
			sqlMapper = new SqlSessionFactoryBuilder().build(inputStream);
		} catch (Exception e) {
			e.printStackTrace();
			System.out.println("SqlSessionFactory Exception!!!");
		}
	} //static
	
	//회원 가입
	public int memberInsert(MemberDTO dto) {
		//SqlSessionFactory(sqlMapper)에서 session 활성화
		SqlSession session = sqlMapper.openSession();
		int succ = 0;
		succ = session.insert("memberInsert", dto); //insert SQL insert 쿼리 : memberMapper.xml
		session.commit();	//커밋
		session.close();	//session 비활성화
		return succ;
	} //memberInsert()
	
	//전체 회원 검색
	public List<MemberDTO> memberSearchAll() {
		SqlSession session = sqlMapper.openSession();
		//mybatis에서는 arraylist가 아닌 list를 사용한다
		List<MemberDTO> list = null;
		//파라미터에 식별자 이름을 적는다. 
		list = session.selectList("memberSearchAll");
		session.close();
		return list;
	} //memberSearchAll()
	
	//회원 삭제
	public int memberDelete(String id) {
		SqlSession session = sqlMapper.openSession();
		int succ = 0;
		succ = session.delete("memberDelete", id);
		session.commit();
		session.close();
		return succ;
	} //memberDelete()
	
	//ID 검색
	public MemberDTO getById(String id) {
		SqlSession session = sqlMapper.openSession();
		MemberDTO dto = null;
		//정보를 하나만 받을 때는 selectOne 사용
		dto = session.selectOne("getById", id);
		session.close();
		return dto;
	} //getById()
	
	//회원 정보 수정
	public int memberUpdate(MemberDTO dto) {
		SqlSession session = sqlMapper.openSession();
		int succ = 0;
		succ = session.update("memberUpdate", dto);
		session.commit();
		session.close();
		return succ;
	} //memberUpdate()
} //class

 

 

<%@page import="com.hanul.study.MemberDAO"%>
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%
request.setCharacterEncoding("utf-8");
%>

<!-- dto 객체 생성 -->
<jsp:useBean id="dto" class="com.hanul.study.MemberDTO">
	<jsp:setProperty property="*" name="dto"/>
</jsp:useBean>
<%
MemberDAO dao = new MemberDAO();
int succ = dao.memberInsert(dto);
if(succ > 0) {
	out.println("<script>alert('가입 성공!')");
	out.println("location.href='memberList.jsp'</script>");
} else {
	out.println("<script>alert('가입 실패!')");
	out.println("location.href='memberList.jsp'</script>");
}
%>

▲memberInsert.jsp : 회원 가입 기능 jsp

 

 

<%@page import="com.hanul.study.MemberDTO"%>
<%@page import="java.util.List"%>
<%@page import="com.hanul.study.MemberDAO"%>
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%
request.setCharacterEncoding("utf-8");
MemberDAO dao = new MemberDAO();
List<MemberDTO> list = dao.memberSearchAll();
pageContext.setAttribute("list", list);
%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>전체 회원 목록 조회</title>
<script type="text/javascript">
function fnDelete(id){
	//alert("id : " + id);
	if(confirm("정말 삭제하시겠습니까?")) {
		location.href="memberDelete.jsp?id=" + id;
		//Get 방식으로 정보를 넘길때 띄어쓰기 안하게 주의할 것
	}
}
</script>
</head>
<body>
<div align="center">
	<h3>전체 회원 목록 조회</h3>
	<table border="1" width="80%">
		<tr>
			<th>이름</th>
			<th>아이디</th>
			<th>비밀번호</th>
			<th>나이</th>
			<th>주소</th>
			<th>전화번호</th>
			<th>삭제</th>
			<th>수정</th>
		</tr>
		<!-- for문을 이용한 출력 -->
		<%--
			for(int i = 0; i < list.size(); i++) {
				out.println("<tr align='center'>");
					out.println("<td>" + list.get(i).getIrum() + "</td>");
					out.println("<td>" + list.get(i).getId() + "</td>");
					out.println("<td>" + list.get(i).getPw() + "</td>");
					out.println("<td>" + list.get(i).getAge() + "</td>");
					out.println("<td>" + list.get(i).getAddr() + "</td>");
					out.println("<td>" + list.get(i).getIrum() + "</td>");
				out.println("</tr>");
			}
		--%>
		<!-- ---------------------------------------------------------------------------------------- -->
		<!-- 향상된 for문을 이용한 출력 -->
		<%--
			for(MemberDTO dto : list) {
				out.println("<tr align='center'>");
				out.println("<td>" + dto.getIrum() + "</td>");
				out.println("<td>" + dto.getId() + "</td>");
				out.println("<td>" + dto.getPw() + "</td>");
				out.println("<td>" + dto.getAge() + "</td>");
				out.println("<td>" + dto.getAddr() + "</td>");
				out.println("<td>" + dto.getTel() + "</td>");
				out.println("</tr>");
			}
		--%>
		<!-- ---------------------------------------------------------------------------------------- -->
		<!-- JSTL을 이용한 출력 -->
		<c:forEach var="i" items="${list }">
			<tr align="center">
				<td>${i.irum }</td>
				<td>${i.id }</td>
				<td>${i.pw }</td>
				<td>${i.age }</td>
				<td>${i.addr }</td>
				<td>${i.tel }</td>
				<td><input type="button" value="삭제" onclick="fnDelete('${i.id }')"/></td>
				<!-- id값을 넘길때 따옴표로 묶어줘야 문자를 입력해도 오류가 안난다. -->
				<td><input type="button" value="수정" onclick="location.href='memberDetail.jsp?id=${i.id}'"/></td>
			</tr>
		</c:forEach>
		<tr align="center">
			<td colspan="8">
				<input type="button" value="회원가입" onclick="location.href='MemberMain.html'"/>
			</td>
		</tr>
	</table>
</div>
</body>
</html>

▲memberList.jsp : 회원 목록 조회 화면

 

 

<%@page import="com.hanul.study.MemberDAO"%>
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%
request.setCharacterEncoding("utf-8");
String id = request.getParameter("id");
MemberDAO dao = new MemberDAO();
int succ = dao.memberDelete(id);
if(succ > 0) {
	out.println("<script>alert('삭제 성공!')");
	out.println("location.href='memberList.jsp'</script>");
} else {
	out.println("<script>alert('삭제 실패!')");
	out.println("location.href='memberList.jsp'</script>");
}
%>

▲memberDelete.jsp : 회원 삭제 기능 jsp

 

 

<%@page import="com.hanul.study.MemberDTO"%>
<%@page import="com.hanul.study.MemberDAO"%>
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%
request.setCharacterEncoding("utf-8");
String id = request.getParameter("id");
MemberDAO dao = new MemberDAO();
MemberDTO dto = dao.getById(id);
pageContext.setAttribute("dto", dto);
%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>memberDetail</title>
<style type="text/css">
.in {
	background-color: pink;
}
</style>
<script type="text/javascript">
function fnSubmit() {
	if(confirm("정말 수정하시겠습니까?")) {
		return true;
	}
	return false;
}

function fnReset() {
	if(confirm("정말 초기화하시겠습니까?")) {
		return true;
	}
	return false;
}
</script>
</head>
<body>
<div align="center">
	<form action="memberUpdate.jsp" method="post" onsubmit="return fnSubmit()" onreset="return fnReset()">
		<input type="hidden" name="id" value="${dto.id }" />
		<table border="1">
			<tr>
				<th>이름</th>
				<td><input type="text" name="irum" value="${dto.irum }" class="in" required="required" /></td>
			</tr>
			<tr>
				<th>아이디</th>
				<td>${dto. id }</td>
			</tr>
			<tr>
				<th>비밀번호</th>
				<td><input type="password" name="pw" value="${dto.pw }" class="in" required="required" /></td>
			</tr>
			<tr>
				<th>나이</th>
				<td><input type="number" name="age" value="${dto.age }" class="in" required="required" /></td>
			</tr>
			<tr>
				<th>주소</th>
				<td><input type="text" name="addr" value="${dto.addr }" class="in" required="required"/></td>
			</tr>
			<tr>
				<th>전화번호</th>
				<td><input type="text" name="tel" value="${dto.tel }" class="in" required="required"/></td>
			</tr>
			<tr align="center">
				<td colspan="2">
					<input type="submit" value="수정하기" />
					<input type="reset" value="초기화하기" />
					<input type="button" value="목록보기" onclick="location.href='memberList.jsp'" />				
				</td>
			</tr>
		</table>
	</form>
</div>
</body>
</html>

▲memberDetail.jsp : 회원 정보 수정 화면

 

 

<%@page import="com.hanul.study.MemberDAO"%>
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%
request.setCharacterEncoding("utf-8");
%>
<jsp:useBean id="dto" class="com.hanul.study.MemberDTO">
	<jsp:setProperty property="*" name="dto"/>
</jsp:useBean>

<%
MemberDAO dao = new MemberDAO();
int succ = dao.memberUpdate(dto);
if(succ > 0) {
	out.println("<script>alert('수정 성공!');");
	out.println("location.href='memberList.jsp';</script>");
} else {
	out.println("<script>alert('수정 실패!');");
	out.println("location.href='memberList.jsp';</script>");
}
%>

▲memberUpdate.jsp

반응형