간단한 회원가입 실습

준비

💡

servlet-name: memberapp

web.xml

<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns="http://java.sun.com/xml/ns/javaee" xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_3_0.xsd" id="WebApp_ID" version="3.0">
  <display-name>03_MemberTest</display-name>
  <servlet>
	<servlet-name>memberapp</servlet-name>
	<servlet-class>org.springframework.web.servlet.DispatcherServlet</servlet-class>
  </servlet>
  <servlet-mapping>
	<servlet-name>memberapp</servlet-name>
	<url-pattern>*.me</url-pattern>
  </servlet-mapping>
	
	<filter>
	<filter-name>encodingFilter</filter-name>
	<filter-class>org.springframework.web.filter.CharacterEncodingFilter</filter-class>
	<init-param>
	<param-name>encoding</param-name>
	<param-value>utf-8</param-value>
	</init-param>
	</filter>
	
	<filter-mapping>
	<filter-name>encodingFilter</filter-name>
	<url-pattern>/*</url-pattern>
	</filter-mapping>
  
  
  <welcome-file-list>
    <welcome-file>index.html</welcome-file>
    <welcome-file>index.htm</welcome-file>
    <welcome-file>index.jsp</welcome-file>
    <welcome-file>default.html</welcome-file>
    <welcome-file>default.htm</welcome-file>
    <welcome-file>default.jsp</welcome-file>
  </welcome-file-list>
</web-app>

memberapp-servlet.xml

💡

WEB-INF 폴더 내에서 마우스 우클릭-New-Spring-Spring Bean Configuration File로 생성한다. 앞서 <servlet-name>memberapp</servlet-name> 코드가 있으므로 파일명도 동일하게 시작한다.

<?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:context="http://www.springframework.org/schema/context"
	xmlns:util="http://www.springframework.org/schema/util"
	xsi:schemaLocation="http://www.springframework.org/schema/beans http://www.springframework.org/schema/beans/spring-beans-4.0.xsd
		http://www.springframework.org/schema/context http://www.springframework.org/schema/context/spring-context-4.0.xsd
		http://www.springframework.org/schema/util http://www.springframework.org/schema/util/spring-util-4.0.xsd">

<!-- 찾을 폴더(패키지) 등록 -->
<context:component-scan base-package="com.member"/>

<!-- 등록 -->
<bean id="viewResolver" class="org.springframework.web.servlet.view.InternalResourceViewResolver">
<property name="prefix" value="WEB-INF/jsp/"></property>
<property name="suffix" value=".jsp"></property>
</bean>

<!-- db설정(ds정의) -->
<bean id="ds" class="org.springframework.jndi.JndiObjectFactoryBean">
<property name="jndiName">
	<value>jdbc/spring</value>
</property>
<property name="resourceRef" value="true"></property>
</bean>

<!-- template 설정 -->
<bean id="template" class="org.springframework.jdbc.core.JdbcTemplate">
	<property name="dataSource" ref="ds"></property>
</bean>

</beans>

META-INF 내의 context.xml에 코드 추가

<Resource name="jdbc/spring" auth="Container" 
  type="javax.sql.DataSource" 
  driverClassName="oracle.jdbc.driver.OracleDriver"
  url="jdbc:oracle:thin:@localhost:1521:xe" 
  username="scott" password="1234"
  maxTotal="20" maxIdle="20"
  maxWaitMillis="-1"
  />

SQL 디벨로퍼에서 테이블 생성

테이블명: springmember

컬럼명: id/pass/name/addr/memo/reg_date

컨트롤러 생성

💡

src내에 com.member.controller 패키지 생성하고 하위에 MemberController.java 클래스 파일 생성. @Controller 어노테이션과 @Autowired 어노테이션 포함.

MemberController.java

package com.member.controller;

import java.util.List;

import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestMethod;
import org.springframework.web.servlet.ModelAndView;

import com.member.model.MemberDAOImpl;
import com.member.model.MemberDTO;

@Controller
public class MemberController {
	@Autowired
	private MemberDAOImpl dao;
	
	//추가 폼으로 가기
	@RequestMapping(value="member_insert.me",method=RequestMethod.GET)
	public String insert() {
		return "memberForm";
	}
	
	//추가
	@RequestMapping(value="member_insert.me",method=RequestMethod.POST)
	public String insert(MemberDTO user) {
		dao.insert(user);
		return "redirect:member_list.me";
	}
	
	//전체보기
	@RequestMapping("member_list.me")
	public String memberList(Model model, String id) {
		List<MemberDTO> memberlist=dao.getMemberList();
		model.addAttribute("memberlist", memberlist);
		return "memberList";
	}
	
	//상세보기
	@RequestMapping("member_view.me")
	public String view (Model model, String id) {
		MemberDTO m=dao.findById(id);
		model.addAttribute("member",m);
		return "memberView";
	}
	
	//수정하기 폼으로 이동
	@RequestMapping(value="member_update.me", method=RequestMethod.GET)
	public String update(Model model, String id) {
		MemberDTO m=dao.findById(id);
		model.addAttribute("user",m);
		return "updateForm";
	}
	
	//수정하기
	@RequestMapping(value="member_update.me", method=RequestMethod.POST)
	public String update(MemberDTO user) {
		dao.update(user);
		return "redirect:member_list.me";
	}
	
	//삭제하기
	@RequestMapping("member_delete.me")
	public String delete(String id) {
		dao.delete(id);
		return "redirect:member_list.me";
	}
	
	
}

💡

com.member.model 패키지 내에 MemberDTO.java, MemberDAO인터페이스, MemberDAOImpl.java 클래스 파일 생성

MemberDTO.java

테이블의 컬럼명과 동일하게 객체들을 생성하고 getter, setter 구현

package com.member.model;

import org.springframework.stereotype.Component;

@Component
public class MemberDTO {
	private String id;
	private String pass;
	private String name;
	private String addr;
	private String memo;
	private String reg_date;
	
	public String getId() {
		return id;
	}
	public void setId(String id) {
		this.id = id;
	}
	public String getPass() {
		return pass;
	}
	public void setPass(String pass) {
		this.pass = pass;
	}
	public String getName() {
		return name;
	}
	public void setName(String name) {
		this.name = name;
	}
	public String getAddr() {
		return addr;
	}
	public void setAddr(String addr) {
		this.addr = addr;
	}
	public String getMemo() {
		return memo;
	}
	public void setMemo(String memo) {
		this.memo = memo;
	}
	public String getReg_date() {
		return reg_date;
	}
	public void setReg_date(String reg_date) {
		this.reg_date = reg_date;
	}
}

MemberDAO.java

package com.member.model;

import java.util.List;

public interface MemberDAO {

	//추가
	public void insert(MemberDTO user);
	//전체보기
	public List<MemberDTO> getMemberList();
	//상세보기
	public MemberDTO findById(String id);
	//수정
	public void update(MemberDTO user);
	//삭제
	public void delete(String id);
}

MemberDAOImpl.java

db연동에 필요한 메소드 구현

package com.member.model;

import java.sql.ResultSet;
import java.sql.SQLException;
import java.util.List;

import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.jdbc.core.JdbcTemplate;
import org.springframework.jdbc.core.RowMapper;
import org.springframework.stereotype.Repository;

@Repository
public class MemberDAOImpl implements MemberDAO{
	@Autowired
	private JdbcTemplate template;
	
	//추가
	public void insert(MemberDTO user) {
		String sql="insert into springmember values(?,?,?,?,?,sysdate)";
		Object[]param=new Object[] {
				user.getId(), user.getPass(), user.getName(), user.getAddr(), user.getMemo()
		};
		template.update(sql, param);
	}

	//전체보기
	public List<MemberDTO> getMemberList() {
		String sql="select * from springmember";
		List<MemberDTO> memberlist=template.query(sql, new RowMapper<MemberDTO>() {
			@Override
			public MemberDTO mapRow(ResultSet rs, int arg1) throws SQLException {
				MemberDTO m=new MemberDTO();
				m.setId(rs.getString("id"));
				m.setPass(rs.getString("pass"));
				m.setName(rs.getString("name"));
				m.setAddr(rs.getString("addr"));
				m.setMemo(rs.getString("memo"));
				m.setReg_date(rs.getString("reg_date"));
				return m;
			}
		});
		return memberlist;
	}

	//상세보기
	public MemberDTO findById(String id) {
		String sql="select * from springmember where id='"+id+"'";
		MemberDTO m=template.queryForObject(sql, new RowMapper<MemberDTO>() {
			@Override
			public MemberDTO mapRow(ResultSet rs, int arg1) throws SQLException {
				MemberDTO user=new MemberDTO();
				user.setAddr(rs.getString("addr"));
				user.setId(rs.getString("id"));
				user.setMemo(rs.getString("memo"));
				user.setName(rs.getString("name"));
				user.setPass(rs.getString("pass"));
				user.setReg_date(rs.getString("reg_date"));
				return user;
			}
		});
		return m;
	}

	
	//수정
	public void update(MemberDTO user) {
		String sql="update springmember set pass=?, name=?, addr=?, memo=? where id=?";
		Object[] param=new Object[] {
				user.getPass(), user.getName(), user.getAddr(), user.getMemo(), user.getId()
		};
		template.update(sql, param);
	}

	//삭제
	public void delete(String id) {
		String sql="delete from springmember where id='"+id+"'";
		template.update(sql);
	}

}

JSP 파일 생성

💡

index.jsp 실행 후 회원입력 링크 <a href="member_insert.me">를 누르면 회원가입 폼으로 이동한다.

index.jsp (WebContent 폴더 내에 생성)

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
<a href="member_insert.me">[회원입력]</a>
<a href="member_list.me">[회원전체보기]</a>
</body>
</html>

💡

MemberController.java에 @RequestMapping 어노테이션으로 value=member_insert.me를 적고 method=RequestMethod.GET 혹은 method=RequestMethod.POST 방식으로 구분하여 단순히 폼으로 이동 memberForm 하는 건지 db에 회원정보가 입력 dao.insert(user)되도록 하는 건지 분리되어 있다.

memberForm.jsp (회원가입 양식)

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
<h2>회원가입</h2>
<form action="member_insert.me" method="post">
<table>
<tr>
	<td>아이디</td>
	<td><input type="text" name="id" id="id"></td>
</tr>
<tr>
	<td>비밀번호</td>
	<td><input type="password" name="pass" id="pass"></td>
</tr>
<tr>
	<td>성명</td>
	<td><input type="text" name="name" id="name"></td>
</tr>
<tr>
	<td>주소</td>
	<td><input type="text" name="addr" id="addr"></td>
</tr>
<tr>
	<td>메모</td>
	<td><textarea rows="5" cols="25" name="memo" id="memo"></textarea></td>
</tr>
<tr>
	<td colspan="2" align="center">
	<input type="submit" value="가입">
	<input type="reset" value="취소"></td>
</tr>
</table>
</form>
</body>
</html>

💡

insert되고 나면 "redirect:member_list.me"; 에 의해 회원 전체보기 jsp로 이동한다.

memberList.jsp (회원 전체보기)

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
<a href="member_insert.me">추가하기</a>/전체보기<br/>
<c:forEach items="${memberlist}" var="member">
아이디: <a href="member_view.me?id=${member.id}">${member.id}</a><br/>
비밀번호: ${member.pass}<br/>
성명: ${member.name}<br/>
주소: ${member.addr}<br/>
메모: ${member.memo}<br/>
가입일: ${member.reg_date}<br/><br/>
</c:forEach>
</body>
</html>

💡

memberList.jsp에서 아이디에 링크를 걸어서 회원 정보 상세보기를 할 수 있다.

memberView.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
<h3>상세보기</h3>
아이디: ${member.id}<br/>
비밀번호: ${member.pass}<br/>
성명: ${member.name}<br/>
주소: ${member.addr}<br/>
메모: ${member.memo}<br/>
가입일: ${member.reg_date}<br/><br/>
<input type="button" value="수정" onclick="location.href='member_update.me?id=${member.id}'">
<input type="button" value="삭제" onclick="location.href='member_delete.me?id=${member.id}'">
</body>
</html>

💡

수정 버튼을 누르면 member_update.me 로 이동한다. 수정할 수 있는 (input type이 살아있는) 폼 양식으로 이동한다.

updateForm.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
</head>
<body>
<h2>개인정보 수정</h2>
<form action="member_update.me" method="post">
<input type="hidden" name="id" id="id" value="${user.id}">
<table>
<tr>
	<td>아이디</td>
	<td>${user.id}</td>
</tr>
<tr>
	<td>비밀번호</td>
	<td><input type="password" name="pass" id="pass" value="${user.pass}"></td>
</tr>
<tr>
	<td>성명</td>
	<td><input type="text" name="name" id="name" value="${user.name}"></td>
</tr>
<tr>
	<td>주소</td>
	<td><input type="text" name="addr" id="addr" value="${user.addr}"></td>
</tr>
<tr>
	<td>메모</td>
	<td><textarea rows="5" cols="25" name="memo" id="memo" >${user.memo}</textarea></td>
</tr>
<tr>
	<td colspan="2" align="center">
	<input type="submit" value="확인">
	<input type="reset" value="취소"></td>
</tr>
</table>
</form>
</body>
</html>

💡

확인 submit을 누르면 member_update.me 로 이동한다. db에 회원정보가 변경되는 것이다. 변경된 후에는 회원 전체보기로 redirect한다.

Maven (JDBC template 방식) (0)	2020.10.13
Mybatis 회원가입 (0)	2020.10.08
@Service 추가 간단한 주소록 (0)	2020.10.08
간단한 주소록 만들기 (스프링 컨테이너) (0)	2020.10.06
스프링 설치 및 간단 주소록 만들기 (0)	2020.10.05

내 블로그 - 관리자 홈 전환	`Q` `Q`
새 글 쓰기	`W` `W`

글 수정 (권한 있는 경우)	`E` `E`
댓글 영역으로 이동	`C` `C`

이 페이지의 URL 복사	`S` `S`
맨 위로 이동	`T` `T`
티스토리 홈 이동	`H` `H`
단축키 안내	`Shift` + `/` `⇧` + `/`

cozy coding