💫 Mvc03
■■■ Spring MVC 프로젝트 실습 03 ■■■
○ Perspective
: JavaEE
○ 다이나믹 웹 프로젝트 생성 (비STS 버전)
: Mvc03
○ 기본 환경 구성 및 라이브러리 설정
: Mvc00 (우리가 임의로 구성해둔 샘플)로 부터
src, WebContent 디렉터리 복사 & 덮어쓰기
○ 실습 성격
: 데이터 송수신 관련 실습(Spring MVC 버전)
JDBC 모듈 추가 활용
SimpleDriverDataSource 클래스(객체) 활용
○ 기능 구현
: 사용자로부터 이름, 전화번호 정보를 입력받아 데이터베이스에 저장
저장된 이름, 전화번호 항목을 데이터베이스로부터 읽어 화면에 구성
○ 사전 작업
- TBL_MEMBERLIST 테이블 생성
- MEMBERLISTSEQ 시퀀스 생성
- 샘플 데이터 입력 및 조회
○ 기본 레이아웃(페이지 화면 구성)
이름 [ ] → <input type="text">
전화 [ ] → <input type="text">
< 회원 추가 > → <button type="button">
전체 인원 수 : 2명 → <p>...</p>
------------------ → <table>...</table>
번호 이름 전화
1 노.. 010...
2 김.. 010...
------------------
○ 물리적 파일 구성
- Mvc03_scott.sql → 데이터베이스 관련 객체 구성 및 실습 데이터 준비
- MemberDTO.java → 사용자 정의 자료형 클래스(DTO 활용)
- IMemberDAO.java → 인터페이스
- MemberDAO.java → 데이터베이스 액션 처리 클래스
Connection 객체에 대한 의존성 주입
(의존성 주입을 위한 준비 필요)
- MemberListController.java → 사용자 정의 컨트롤러 클래스
리스트 출력 액션
DAO 객체에 대한 의존성 주입
(의존성 주입을 위한 준비 필요)
- MemberList.jsp → 리스트 출력용 뷰
회원 데이터 입력(추가) 폼 화면 구성
- MemberInsertController.java→ 사용자 정의 컨트롤러 클래스
회원 데이터 추가 액션
DAO 객체에 대한 의존성 주입
(의존성 주입을 위한 준비 필요)
- web.xml → DispatcherServlet 객체 등록
URL 매핑 주소 등록
- dispatcher-servlet.xml → 컨트롤러 객체 등록
URL 매핑 주소 등록
SimpleDriverDataSource 객체 등록
의존 객체 주입 설정
DAO 객체 등록
- memberlist.do → 이클립스 실행 과정에서 요청을 위한 빈 파일
○ 사용자 최초 요청 주소
http://localhost:3306/Mvc03/memberlist.do
# Mvc03_scott.sql
테이블 생성, 시퀀스 생성, 쿼리문 준비하는 과정! 코드 생략!
# MemberDTO.java
package com.test.mvc;
public class MemberDTO
{
// 주요 속성 구성
private int mid;
private String name, telephone;
// 사용자 정의 생성자 없음 → default 생성자 자동 삽입
// getter/setter 구성
public int getMid()
{
return mid;
}
public void setMid(int mid)
{
this.mid = mid;
}
public String getName()
{
return name;
}
public void setName(String name)
{
this.name = name;
}
public String getTelephone()
{
return telephone;
}
public void setTelephone(String telephone)
{
this.telephone = telephone;
}
}
# IMemberDAO.java
인터페이스
package com.test.mvc;
import java.sql.SQLException;
import java.util.ArrayList;
public interface IMemberDAO
{
// 회원 데이터 추가(등록) 메소드 선언
public int add(MemberDTO member) throws SQLException;
// 전체 인원 수 확인 메소드 선언
public int count() throws SQLException;
// 회원 리스트 확인 메소드 선언
public ArrayList<MemberDTO> list() throws SQLException;
}
# MemberDAO.java
- 데이터베이스 액션 처리
- IMemberDAO 인터페이스 구현
package com.test.mvc;
import java.sql.Connection;
import java.sql.PreparedStatement;
import java.sql.ResultSet;
import java.sql.SQLException;
import java.util.ArrayList;
import javax.sql.DataSource;
public class MemberDAO implements IMemberDAO
{
// ※ Connection 객체에 대한 의존성 주입을 위한 준비
// ① 인터페이스 형태의 데이터타입을 취하는 속성 구성
private DataSource dataSource;
// ② setter 구성
public void setDataSource(DataSource dataSource)
{
this.dataSource = dataSource;
}
// ※ IMemberDAO 인터페이스의 메소드 오버라이딩
@Override
public int add(MemberDTO member) throws SQLException
{
int result = 0;
Connection conn = dataSource.getConnection();
String sql = "INSERT INTO TBL_MEMBERLIST(MID, NAME, TELEPHONE) VALUES(MEMBERLISTSEQ.NEXTVAL, ?, ?)";
PreparedStatement pstmt = conn.prepareStatement(sql);
pstmt.setString(1, member.getName());
pstmt.setString(2, member.getTelephone());
result = pstmt.executeUpdate();
pstmt.close();
return result;
}
@Override
public int count() throws SQLException
{
int result = 0;
Connection conn = dataSource.getConnection();
String sql = "SELECT COUNT(*) AS COUNT FROM TBL_MEMBERLIST";
PreparedStatement pstmt = conn.prepareStatement(sql);
ResultSet rs = pstmt.executeQuery();
while(rs.next())
{
result = rs.getInt("COUNT");
}
rs.close();
pstmt.close();
return result;
}
@Override
public ArrayList<MemberDTO> list() throws SQLException
{
ArrayList<MemberDTO> result = new ArrayList<MemberDTO>();
Connection conn = dataSource.getConnection();
String sql = "SELECT MID, NAME, TELEPHONE FROM TBL_MEMBERLIST ORDER BY MID";
PreparedStatement pstmt = conn.prepareStatement(sql);
ResultSet rs = pstmt.executeQuery();
while(rs.next())
{
MemberDTO dto = new MemberDTO();
dto.setMid(rs.getInt("MID"));
dto.setName(rs.getString("NAME"));
dto.setTelephone(rs.getString("TELEPHONE"));
result.add(dto);
}
rs.close();
pstmt.close();
return result;
}
}
# MemberList.jsp
처음 보여지는 페이지(입력창, 회원 수, 회원 리스트), 회원 추가 버튼 클릭 시 액션 처리
<%@ page contentType="text/html; charset=UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%
request.setCharacterEncoding("UTF-8");
String cp = request.getContextPath();
%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>MemberList.jsp</title>
<link rel="stylesheet" type="text/css" href="css/main.css">
<style type="text/css">
*{inline-height: 150%}
#customers td {text-align: center;}
#submitBtn
{
height: 150%;
width: 250px;
font-size: 18px;
font-weight: bold;
font-family: 맑은 고딕;
color: #343;
margin: 10px;
}
#err
{
color: red;
font-size: small;
display: none;
}
</style>
<script type="text/javascript" src="http://code.jquery.com/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function()
{
$("#submitBtn").click(function()
{
$("#err").css("display", "none");
if($("#name").val()=="" || $("#telephone").val()=="")
{
$("#err").css("display", "inline");
return;
}
$("#memberForm").submit();
});
});
</script>
</head>
<body>
<div>
<h1>회원 관리</h1>
<hr />
</div>
<div>
<form action="memberinsert.do" method="post" id="memberForm">
이름 <input type="text" name="name" id="name" class="control" required="required">
<br>
전화 <input type="text" name="telephone" id="telephone" class="control" required="required">
<br>
<button type="button" id="submitBtn">회원 추가</button>
<span id="err">모든 항목을 입력해야 합니다.</span>
</form>
<p>전체 인원 수 : ${count }명</p>
<table id="customers" style="width: 500px;" class="table">
<tr>
<th>번호</th><th>이름</th><th>전화번호</th>
</tr>
<c:forEach var="member" items="${memberList }">
<tr>
<td>${member.mid }</td>
<td>${member.name }</td>
<td>${member.telephone }</td>
</tr>
</c:forEach>
</table>
</div>
</body>
</html>
# MemberListController.java
- memberlist.do 가 요청되면 연결되는 컨트롤러
- 전체 회원 리스트, 인원 수 확인 액션 수행
package com.test.mvc;
import java.util.ArrayList;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import org.springframework.web.servlet.ModelAndView;
import org.springframework.web.servlet.mvc.Controller;
// ※ Spring 의 『Controller』 인터페이스를 구현하는 방법을 통해
// 사용자 정의 컨트롤러 클래스를 구성한다.
// cf. Controller Annotation 활용
public class MemberListController implements Controller
{
// 인터페이스 자료형을 취하는 속성 구성
private IMemberDAO dao;
// setter 메소드 구성
public void setDao(IMemberDAO dao)
{
this.dao = dao;
}
@Override
public ModelAndView handleRequest(HttpServletRequest request, HttpServletResponse response) throws Exception
{
// 액션 코드
ModelAndView mav = new ModelAndView();
int count = 0;
ArrayList<MemberDTO> memberList = new ArrayList<MemberDTO>();
try
{
count = dao.count();
memberList = dao.list();
}
catch (Exception e)
{
System.out.println(e.toString());
}
mav.setViewName("/WEB-INF/view/MemberList.jsp");
mav.addObject("count", count);
mav.addObject("memberList", memberList);
return mav;
}
}
# MemberInsertController.java
- memberinsert.do 가 요청되면 연결되는 컨트롤러
- 회원 추가 액션 수행
package com.test.mvc;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import org.springframework.web.servlet.ModelAndView;
import org.springframework.web.servlet.mvc.Controller;
// ※ Spring 의 『Controller』 인터페이스를 구현하는 방법을 통해
// 사용자 정의 컨트롤러 클래스를 구성한다.
// cf. Controller Annotation 활용
public class MemberInsertController implements Controller
{
private IMemberDAO dao;
public void setDao(IMemberDAO dao)
{
this.dao = dao;
}
@Override
public ModelAndView handleRequest(HttpServletRequest request, HttpServletResponse response) throws Exception
{
// 액션 코드
ModelAndView mav = new ModelAndView();
request.setCharacterEncoding("UTF-8");
String name = request.getParameter("name");
String tel = request.getParameter("telephone");
try
{
MemberDTO member = new MemberDTO();
member.setName(name);
member.setTelephone(tel);
dao.add(member);
}
catch (Exception e)
{
System.out.println(e.toString());
}
mav.setViewName("redirect:memberlist.do");
return mav;
}
}
➰체크➰
1. redirect:memberlist.do
데이터가 입력되면 다시 리스트 페이지로 이동하는데,
처음 요청하던 것 처럼 "/WEB-INF....." 이렇게 요청하면 안된다!
그러면 입력받은 데이터를 가지고 클라이언트를 만날 수 없다. 리다이렉트로 불러주자!!!!
# Web.xml
.do로 요청받은 url 이 있으면 dispatcher-servlet 너가 일하렴!
<servlet>
<servlet-name>dispatcher</servlet-name>
<servlet-class>org.springframework.web.servlet.DispatcherServlet</servlet-class>
</servlet>
<servlet-mapping>
<servlet-name>dispatcher</servlet-name>
<url-pattern>*.do</url-pattern>
</servlet-mapping>
# dispatcher-servlet.xml
<?xml version="1.0" encoding="UTF-8"?>
<beans xmlns="http://www.springframework.org/schema/beans"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xmlns:p="http://www.springframework.org/schema/p"
xmlns:context="http://www.springframework.org/schema/context"
xsi:schemaLocation="http://www.springframework.org/schema/beans
http://www.springframework.org/schema/beans/spring-beans-3.0.xsd
http://www.springframework.org/schema/context
http://www.springframework.org/schema/context/spring-context-3.0.xsd">
<context:component-scan base-package="org.springframework.samples.petclinic.web" />
<!-- ※ 사용자 정의 Controller 객체 등록 및 URL 매핑 주소 등록 -->
<!-- - 『name=""』 속성에 매핑 주소를 등록한다. -->
<!-- 이 과정에서 Front Controller 가 갖고있는 확장자의 형태로 구성한다. -->
<!-- - 『class= ""』 속성은 -->
<!-- Controller 객체의 패키지 경로가 포함된 클래스 이름을 등록한다. -->
<!-- DataSource → SimpleDriverDataSource -->
<bean id="localDataSource" class="org.springframework.jdbc.datasource.SimpleDriverDataSource">
<property name="driverClass" value="oracle.jdbc.driver.OracleDriver"></property>
<property name="url" value="jdbc:oracle:thin:@211.238.142.173:1521:xe"></property>
<property name="username" value="scott"></property>
<property name="password" value="tiger"></property>
</bean>
<!-- DataSource → SimpleDriverDataSource -->
<bean id="remoteDataSource" class="org.springframework.jdbc.datasource.SimpleDriverDataSource">
<property name="driverClass" value="oracle.jdbc.driver.OracleDriver"></property>
<property name="url" value="jdbc:oracle:thin:@211.238.142.174:1521:xe"></property>
<property name="username" value="scott"></property>
<property name="password" value="tiger"></property>
</bean>
<!-- MemberDAO -->
<bean id="memberDAO" class="com.test.mvc.MemberDAO">
<property name="dataSource">
<ref bean="localDataSource"></ref>
<!-- <ref bean="remoteDataSource"></ref> -->
</property>
</bean>
<!-- MemberListController -->
<bean name="/memberlist.do" class="com.test.mvc.MemberListController">
<property name="dao">
<ref bean="memberDAO"></ref>
</property>
</bean>
<!-- MemberInsertController -->
<bean name="/memberinsert.do" class="com.test.mvc.MemberInsertController">
<property name="dao">
<ref bean="memberDAO"></ref>
</property>
</bean>
</beans>