야나도 프로젝트

나도 개발자 될수있어

Web Programming

MVC패턴 - 회원가입/ 로그인 구현

jmeen 2021. 8. 17. 17:30
728x90

<title>Hello HTML</title>
</head>
<body>
	<h3>Hello, HTML</h3>
	<p>이것은 Jaemin이 만든 첫번째 HTML입니다.</p>

	<ul>
		<li><a href="<%=request.getContextPath() %>/users?a=joinform">회원가입</a></li>
		<li><a href="<%=request.getContextPath() %>/users?a=loginform">로그인</a></li>
	</ul>

회원가입과 로그인을 구현해보자.

 

1. DB 테이블 생성

CREATE TABLE users (
    no number primary key,
    name varchar2(20) NOT NULL,
    password varchar2(20) NOT NULL,
    email varchar2(128) NOT NULL UNIQUE,
    gender char(1) CHECK(gender IN ('M', 'F')),
    created_at date DEFAULT sysdate);
    
CREATE SEQUENCE seq_users_pk
    START WITH 1
    INCREMENT BY 1;
    
INSERT INTO users (no, name, password, email, gender)
VALUES(seq_users_pk.nextval, '관리자', '12345678', 'admin@example.com', 'M');

commit;

 

2. UserVo 생성

- Vo 클래스는 특별한 점은 없다.

package com.example.emaillist.vo;
import java.util.Date;
public class UserVo {
	// 필드
	private Long no;
	private String name;
	private String password;
	private String email;
	private String gender;
	private Date createdat;
	
	public Long getNo() {
		return no;
	}
	public void setNo(Long no) {
		this.no = no;
	}
	public String getName() {
		return name;
	}
	public void setName(String name) {
		this.name = name;
	}
	public String getPassword() {
		return password;
	}
	public void setPassword(String password) {
		this.password = password;
	}
	public String getEmail() {
		return email;
	}
	public void setEmail(String email) {
		this.email = email;
	}
	public String getGender() {
		return gender;
	}
	public void setGender(String gender) {
		this.gender = gender;
	}
	public Date getCreatedat() {
		return createdat;
	}
	public void setCreatedat(Date createdat) {
		this.createdat = createdat;
	}
	@Override
	public String toString() {
		return "UserVo [no=" + no + ", name=" + name + ", password=" + password + ", email=" + email + ", gender="
				+ gender + ", createdat=" + createdat + "]";
	}
}

 

3. UserDao, UserDaoImpl 생성

package com.example.emaillist.dao;
import java.util.List;
import com.example.emaillist.vo.UserVo;

public interface UserDao {
	public UserVo getUserByEmailandPassword(String email, String password);
	public int insert(UserVo vo);
}
package com.example.emaillist.dao;

import java.sql.Connection;
import java.sql.DriverManager;
import java.sql.PreparedStatement;
import java.sql.ResultSet;
import java.sql.SQLException;

import com.example.emaillist.vo.UserVo;

public class UserDaoImpl implements UserDao {

	// Connection
	private Connection getConnection() throws SQLException {
		Connection conn = null;
		try {
			Class.forName("oracle.jdbc.driver.OracleDriver");
			// connection 얻기
			String dburl = "jdbc:oracle:thin:@127.0.0.1:1521:xe";
			conn = DriverManager.getConnection(dburl, "C##BITUSER", "bituser");
		} catch (ClassNotFoundException e) {
			System.out.println("드라이버 로드 실패");
		}
		return conn;
	}

	// 로그인용
	@Override
	public UserVo getUserByEmailandPassword(String email, String password) {
		UserVo vo = null;
		Connection conn = null;
		PreparedStatement pstmt = null;
		ResultSet rs = null;

		try {
			conn = getConnection();
			String sql = "SELECT no, name, email, gender FROM users WHERE email=? and password=?";
			pstmt = conn.prepareStatement(sql);
			pstmt.setString(1, email);
			pstmt.setString(2, password);
			rs = pstmt.executeQuery();

			if (rs.next()) {
				// 결과값이 있으면
				Long no = rs.getLong(1);
				String name = rs.getString(2);
				String email_str = rs.getString(3);
				String gender = rs.getString(4);

				vo = new UserVo();
				vo.setName(name);
				vo.setNo(no);
				vo.setEmail(email_str);
				vo.setGender(gender);
				System.out.println("User  Found" + vo);
			} else {
				System.out.println("User Not Found");
			}
		} catch (Exception e) {
			// TODO: handle exception
		} finally {
			try {
				rs.close();
				conn.close();
				pstmt.close();
			} catch (Exception e) {
				e.printStackTrace();
			}
		}
		return vo;
	}

	@Override
	public int insert(UserVo vo) {

		Connection conn = null;
		PreparedStatement pstmt = null;
		int Insertedcount = 0;

		try {
			conn = getConnection();
			String sql = "INSERT INTO USERS(no, name, password, email, gender) Values(seq_users_pk.nextval, ?, ?, ? ,?)";
			pstmt = conn.prepareStatement(sql);
			pstmt.setString(1, vo.getName());
			pstmt.setString(2, vo.getPassword());
			pstmt.setString(3, vo.getEmail());
			pstmt.setString(4, vo.getGender());

			Insertedcount = pstmt.executeUpdate();

		} catch (SQLException e) {
			e.printStackTrace();
		} finally {
			try {
				pstmt.close();
				conn.close();
			} catch (Exception e) {
				e.printStackTrace();
			}
		}
		return Insertedcount;
	}
}

이번엔 로그인을 처리하는 코드가 들어갔다. 

SELECT no, name, email, gender FROM users WHERE email=? and password=?

위 코드를 를 이용해서 입력받은 이메일과 패스워드가 일치하는 사람을 찾는것이다.

만약 있다면 그사람의 내용을 vo로 리턴해준다.

 

4. UserServlet 생성

이제 HTML페이지와 java 파일을 연결해주는 서블릿을 만들 차례다.

 

4-1. doGet override

- 대체로 들렸다 바로 이동하는 내용으로 구성되어있다.

	@Override
	protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
		String actionName = req.getParameter("a");
		// 가입을 누른경우 이동
		if ("joinform".equals(actionName)) {
			RequestDispatcher rd = req.getRequestDispatcher("/WEB-INF/views/users/joinform.jsp");
			rd.forward(req, resp);
		} else if ("joinsuccess".equals(actionName)) {
			// a= joinsuccess
			// 가입성공했으면 이동 페이지
			RequestDispatcher rd = req.getRequestDispatcher("/WEB-INF/views/users/joinsuccess.jsp");
			rd.forward(req, resp);
		} else if ("loginform".equals(actionName)) {
			// a = loginform
			// 로그인 폼 페이지로
			RequestDispatcher rd = req.getRequestDispatcher("/WEB-INF/views/users/loginform.jsp");
			rd.forward(req, resp);
		} else {
			resp.sendError(404); // page not found
		}

	}

4-2. doPost Override

- doPost가 대체적으로 값을 입력받아 그것으로 추가를하든, 로그인을 하든, 삭제를 하든 하는 곳을 구현한다.

<body>
	<h1>Join Form</h1>
		<form method="POST" action="<%= request.getContextPath() %>/users">
		<input type="hidden" name="a" value="join">
		<label for="name">이름<label>
			<input type="text" name="name" id="name"/><br />
		<label for="password">비밀번호</label>
			<input type="text" name="password" id= "password"/><br/>
		<label for="email">이메일</label>
			<input type="text" name="email" id= "email"/><br/>
		<label for="gender">성별</label>
			<input type="radio" name="gender" value="F" checked/>여성
			<input type="radio" name="gender" value="M"/>남성<br/>
		<input type="submit" value="가입"/>
		</form>
		
			<a href="<%=request.getContextPath() %>">메인홈으로</a> 

</body>

위의 가입 폼을 보면, form으로 묶여있고, 여기에 각각 name의 파라미터들이 들어있다.

가장 위의 "a"라는 값의 이름으로 구분이 되게 되고, 그 뒤에 post냐, get이냐 구분되어 메소드를 활용한다.

이 폼은 Post 메소드를 이용하여 doPost를 활용한다. 

두개의 폼에서 오는 내용이라 두개로 나눴다.

@Override
	protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
		String actionName = req.getParameter("a");
		if ("join".equals(actionName)) {
			UserVo vo = new UserVo();
			String name = req.getParameter("name");
			String password = req.getParameter("password");
			String email = req.getParameter("email");
			String gender = req.getParameter("gender");

			vo.setName(name);
			vo.setPassword(password);
			vo.setEmail(email);
			vo.setGender(gender);

			System.out.println("uservo : " + vo);
			UserDao dao = new UserDaoImpl();
			int insertcount = dao.insert(vo);
			if (insertcount == 1) {
				System.out.println("가입성공");
				resp.sendRedirect(req.getContextPath() + "/users?a=joinsuccess");
			} else {
				System.out.println("가입 실패");
				resp.sendRedirect(req.getContextPath() + "/users?a=joinform");
			}

- a가 join이면 위의 내용이 실행된다.  form에 있던 name, password, email, gender가 각각 필드값에 저장된다.

그리고 uservo 객체가 생성되고, 그 안에 값을 하나씩 넣어 vo에 값을 채워나간다.

그리고나서 userdaoimple의 insert 메소드를 사용하여 DB에 등록한다. 


다음은 로그인 폼이다.

<body>
	<h1>Login</h1>
	<form method="post" action="<%=request.getContextPath()%>/users">
	<!-- action parameters -->
		<input type="hidden" name="a" value="login"/>
		<label for="email">이메일</label>	
		<input type="text" name="email" id ="email"><br>
		<label for="password">패스워드</label>	
		<input type="text" name="password" id ="password"><br>
		<input type="submit" value="로그인">
	</form>
		<a href="<%=request.getContextPath() %>">돌아가기</body>

a의 값이 login이다. 그리고 값은 이메일과 패스워드가 있다.

		} else if ("login".equals(actionName)) {
			// 로그인 수행
			// 파라미터 확인
			String email = req.getParameter("email");
			String password = req.getParameter("password");
            
			UserDao dao = new UserDaoImpl();
			UserVo vo = dao.getUserByEmailandPassword(email, password);
            
			if (vo == null) {
				// 사용자가 없거나 비밀번호가 틀렸거나
				System.err.println("사용자 없음!");
				// 로그인 폼으로 돌아가기
				resp.sendRedirect(req.getContextPath() + "/users?a=loginform");
			} else {
				// 사용자 찾음
				System.out.print("사용자 찾음");
				// 홈페이지로 리다이렉트
				resp.sendRedirect(req.getContextPath());
			}
		} else {
			resp.sendRedirect(req.getContextPath());
		}

	}

이것으로 수행되는 메서드는 다음과 같다. 

이메일과 패스워드를 가지고 위에서 간단히 설명한 getUserBy.... 메소드를 구동하고, vo객체를 리턴받는다.

만약 리턴받은 vo객체가 null이면, 해당되는 사용자가 없다는것이다. 

그리고 리다이렉트를 하여 초기페이지로 돌아가거나, 로그인페이지로 돌아갈수 있게 하였다.

 

 

이렇게 회원가입과 로그인을 구현해보았다.

 

'Web Programming' 카테고리의 다른 글

Session  (0) 2021.08.18
Web programming : Cookie  (0) 2021.08.18
웹프로그래밍 - MVC 패턴  (0) 2021.08.17
JSP 프로그래밍 연습  (0) 2021.08.13
JSP 태그  (0) 2021.08.13