본문 바로가기
✨ Back-end/Servlet

[Servlet / JSP / SQL / Template / Session] 회원 관리 폼 만들기 (3) - 회원 등록 (DB에 데이터 저장)

by 환풍 2023. 2. 27.
728x90
반응형

이전까지 webapp / content에 있는 board_list.jsp 까지 보았다.

 

이곳에서 LOGIN을 누르면 Session값을 받아와 로그인 하기를 만들어 보려고 한다.

header.jsp이다.

<c: choose> 를 사용해 when, otherwise를 나누어주었다. when은 ~~일 때, otherwise는 그렇지 않을 때 이다.

즉, if 와 else if와 유사한 구문이라고 생각할 수 있다.

 

when을 사용하여 session값을 불러온 값이 not empty 비어있지 않을 때 로그인이 되어야 하지만, 

아직 회원가입조차 하지 않았으므로 joinForm.me를 눌러 회원가입부터 조져보자.

 

MemberController.java (서블릿)

join.jsp로 가라고한다.

 

join.jsp

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
<%@ 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>
<style type="text/css">
.joinDiv{
   width: 40%;
   padding: 10px;
   margin: 0 auto;
}
.joinDiv > div{
   margin-bottom: 16px;
}
.joinDiv > div > div:first-child {
   font-weight: bold;
   font-style: italic;
}
.joinDiv > div > div:last-child {
   margin-bottom: 10px;
}
</style>
</head>
<body>
<form action="join.me" method="post">
   <div class="joinDiv">
      <div>
         <div>ID.</div>
         <div>
            <input type="text" class="myInput" name="memId" required="required">
         </div>
      </div>
      <div>
         <div>PASSWORD.</div>
         <div>
            <input type="text" class="myInput" name="memPw" required="required">
         </div>
      </div>
      <div>
         <div>NAME.</div>
         <div>
            <input type="text" class="myInput" name="memName" required="required">
         </div>
      </div>
      <div>
         <div>TELL.</div>
         <div>
            <input type="text" class="myInput" name="memTell" required="required">
         </div>
      </div>
      <div>
         <div>EMAIL.</div>
         <div>
            <input type="text" class="myInput" name="memEmail" required="required">
         </div>
      </div>
      <div>
         <div>GENDER</div>
         <div>
            <input type="radio" name="gender" value="남" checked>
            <input type="radio" name="gender" value="여">
         </div>
      </div>
      <div>
         <input type="submit" class="btn btn-full" value="J O I N">
      </div>
   </div>
</form>
</body>
</html>
cs

 

memId와 memPw, memName, memTell, memEmail을 입력하고 J O I N 버튼을 누르면,

input 태그로 submit을 받아가 form 내의 모든 input의 name값을 join.me 서블릿에 전달한다.

 

MemberController.java (서블릿)

문자열로 받은 name값들을 다시 한번 String으로 저장한 뒤, member-mapper.xml으로 가자.

 

그 전에 configuration.xml에서 

mapper resource가 들어가 있는지 확인해준다.

 

membermapper.xml

회원 가입을 위해 <insert> 구문에 SQL 쿼리를 작성한다. 이때 처음에 만들었떤 데이터 베이스 쿼리 명과 DTO 자바 클래스로 만들었던 변수 명이 동일해야 하며, 자바 변수를 쓸 때에는 #{ 변수명 } 을 써준다.

 

MemberService.java (인터페이스)

이후 service 패키지에 있는 MemberService 인터페이스로 들어와 메소드를 만들어 준다.

 

매개변수 및 리턴 타입 결정 방법(우선적으로 실행 시 쿼리를 작성)
매개변수 : 쿼리 실행 시 빈 값을 채울 용도
1. 쿼리에서 채워 줄 값이 없을 경우 : 매개변수 없음
2. 채워줄 값이 하나일 경우
 2-1) 채워줄 값이 숫자인 경우 : 매개변수 int형 하나
 2-2) 채워줄 값이 문자인 경우 : 매개변수 String형 하나
3. 채워줄 값이 여러개인 경우 : 매개변수는 DTO 객체.
리턴타입 : 쿼리 실행 결과를 어떻게 받아올지에 대한 정의
INSERT, UPDATE, DELETE 쿼리 실행 결과는
리턴타입을 int 혹은 void 사용하면됨.
SELECT 쿼리 결과의 리턴타입은 크게 두 가지로 나뉨.
조회결과 데이터가 무조건 한줄만 조회 : DTO 객체.
조회 결과 데이터가 0줄이상 가변적일 경우 : List<DTO> 객체.

MemberServiceImpl.java (클래스)

이후 MemberServiceImple 클래스로 들어와 오버라이드해주며 sqlSession 작업을 마무리 해준다.

 

MemberController.java (서블릿)

아까 하지 않았던 작업을 마무리 해주면 된다.

member로 새로운 객체를 생성하여 각각 데이터들을 로그인 폼에서 타이핑 했던 값으로 넣어줄 수 있다.

 

memberService는 무엇인지 아래에서 확인해보자.

서블릿 초반에 생성해주었던 인터페이스를 받아와 meber 값을 모두 넣어주면 완성된다.


 

 

회원 등록이 DB 데이터에 정상적으로 박혀있는것을 확인할 수 있다.

728x90
반응형

댓글