회원가입 및 MYSQL 연동
개발환경 : MySQL 8.0, Eclipse 2020-03
회원가입 구현을 위해,
- 회원가입 jsp 페이지를 만든다.
- DB와 연동하기 위해 DAO 코드를 만든다.
- DAO 함수를 사용하는 jsp를 만든다.
1) 회원가입 jsp 페이지를 만든다.
회원정보는 ID, Password, UserName, UserGender, UserEmail이다.
join.jsp
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta name="viewport" content="width=device-width", initial-scale="1">
<link rel="stylesheet" href="css/bootstrap.css">
<title>JSP JSW 게시판 웹사이트 </title>
</head>
<body>
<nav class="navbar navbar-default">
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed"
data-toggle="collapse" data-target="#bs-example-navbar-collapse-1"
aria-expanded="false">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="main.jsp">JSP 게시판 메인</a>
</div>
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<ui class="nav navbar-nav">
<li><a href="main.jsp">메인</a></li>
<li><a href="bbs.jsp">게시판</a></li>
</ui>
<ui class="nav navbar-nav navbar-right">
<li class="dropdown">
<a href="#" class="dropdown-toggle"
data-toggle="dropdown" role="button" aria-haspopup="true"
aria-expanded="false">접속하기<span class="caret"></</span></a>
<ul class="dropdown-menu">
<li><a href="login.jsp">로그인</a></li>
<li class="active"><a href="join.jsp">회원가입</a></li>
</ul>
</li>
</ui>
</div>
</nav>
<div class="container">
<div class="col-lg-4"></div>
<div class="col-lg-4">
<div class="jumbotron" style="padding-top: 20px;">
<form method="post" action="joinAction.jsp">
<h3 style="text-align: center;">회원가입 화면</h3>
<div class="form-group">
<input type="text" class="form-control" placeholder="아이디" name="userID" maxlength="20">
</div>
<div class="form-group">
<input type="password" class="form-control" placeholder="비밀번호" name="userPassword" maxlength="20">
</div>
<div class="form-group">
<input type="text" class="form-control" placeholder="이름" name="userName" maxlength="20">
</div>
<div class="form-group" style="text-align: center;">
<div class="btn-group" data-toggle="buttons">
<label class="btn btn-primary active">
<input type="radio" name="userGender" autoComplete="off" value="남자" checked>남자
</label>
<label class="btn btn-primary">
<input type="radio" name="userGender" autoComplete="off" value="여자" checked>여자
</label>
</div>
</div>
<div class="form-group">
<input type="email" class="form-control" placeholder="이메일" name="userEmail" maxlength="50">
</div>
<input type="submit" class="btn btn-primary form-control" value="회원가입">
</form>
</div>
<div class="col-lg-4"></div>
</div>
<script src="http://code.jquery.com/jquery-3.1.1.min.js"></script>
<script src="js/bootstrap.js"></script>
</body>
</html>Nav-bar는 교육영상을 참고해서 만들었고, 입력받는 칸들을 다음과 같이 input으로 받도록 만든다. 성별은 btn, type은 radio.
2) DB와 연동하기 위해 DAO 코드를 만든다.
UserDAO 클래스 파일 아래에 join 함수를 만든다.
package user;
import java.sql.Connection;
import java.sql.DriverManager;
import java.sql.PreparedStatement;
import java.sql.ResultSet;
public class UserDAO {
private Connection conn;
private PreparedStatement pstmt;
private ResultSet rs;
public UserDAO() {
try {
String dbURL = "jdbc:mysql://localhost:3306/BBS";
String dbID = "root";
String dbPassword = "root";
Class.forName("com.mysql.jdbc.Driver");
conn = DriverManager.getConnection(dbURL,dbID,dbPassword);
}catch (Exception e) {
e.printStackTrace();
}
}
public int login(String userID, String userPassword) {
String SQL = "SELECT userPassword FROM USER WHERE userID = ?";
try {
pstmt = conn.prepareStatement(SQL);
pstmt.setString(1, userID);
rs = pstmt.executeQuery();
if(rs.next()) {
if(rs.getString(1).contentEquals(userPassword)) {
return 1;
}
else
return 0;
}
return -1;
} catch (Exception e) {
e.printStackTrace();
}
return -2;
}
public int join(User user) {
String SQL = "INSERT INTO USER VALUES( ?, ?, ?, ?, ?)";
try {
pstmt = conn.prepareStatement(SQL);
pstmt.setString(1, user.getUserID());
pstmt.setString(2, user.getUserPassword());
pstmt.setString(3, user.getUserName());
pstmt.setString(4, user.getUserGender());
pstmt.setString(5, user.getUserEmail());
return pstmt.executeUpdate();
}catch(Exception e){
e.printStackTrace();
}
return -1;
}
}String SQL = "INSERT INTO USER VALUES( ?, ?, ?, ?, ?)";SQL 쿼리이다. 새로운 데이터를 삽입하는 쿼리이다. ?에는 아래의 각 변수를 넣을 수 있다.
pstmt = conn.prepareStatement(SQL);
pstmt.setString(1, user.getUserID());
pstmt.setString(2, user.getUserPassword());
pstmt.setString(3, user.getUserName());
pstmt.setString(4, user.getUserGender());
pstmt.setString(5, user.getUserEmail());
return pstmt.executeUpdate();preparestatement에 SQL 문자열을 넣고,
SQL문자열 첫번째 ? 에는 1, user.getUserID를 넣고, 2,3,4,5도 차례로 넣는다.
Pstmt로 executeUpdate() 한다. 데이터를 변경해야하니까.
3) DAO 함수를 사용하는 jsp를 만든다.
joinAction.jsp
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%@ page import="user.UserDAO" %>
<%@ page import="java.io.PrintWriter"%>
<% request.setCharacterEncoding("UTF-8"); %>
<jsp:useBean id="user" class="user.User" scope="page"/>
<jsp:setProperty name="user" property="userID"/>
<jsp:setProperty name="user" property="userPassword"/>
<jsp:setProperty name="user" property="userName"/>
<jsp:setProperty name="user" property="userGender"/>
<jsp:setProperty name="user" property="userEmail"/>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>join action page</title>
</head>
<body>
<%
String userID = null;
if(session.getAttribute("userID")!=null);{
userID = (String) session.getAttribute("userID");
}
if(userID != null){
PrintWriter script = response.getWriter();
script.println("<script>");
script.println("alert('이미 로그인 되어 있습니다.')");
script.println("location.href='main.jsp'");
script.println("</script>");
}
if(user.getUserID() == null || user.getUserPassword()==null || user.getUserName()==null || user.getUserGender()==null || user.getUserEmail()==null){
PrintWriter script = response.getWriter();
script.println("<script>");
script.println("alert('입력이 안 된 사항이 있습니다.')");
script.println("history.back()");
script.println("</script>");
}else{
UserDAO userDAO = new UserDAO();
int result = userDAO.join(user);
if(result==-1){
PrintWriter script = response.getWriter();
script.println("<script>");
script.println("alert('이미 존재하는 아이디 입니다.')");
script.println("history.back()");
script.println("</script>");
}else{
session.setAttribute("userID",user.getUserID());
PrintWriter script = response.getWriter();
script.println("<script>");
script.println("location.href = 'main.jsp'");
script.println("</script>");
}
}
%>
</body>
</html>
계속 나오는 코드이니 보고가자.
String userID = null;
if(session.getAttribute("userID")!=null);{
userID = (String) session.getAttribute("userID");
}Session에 userID값을 저장해 어떤 유저가 하는 행동인지 식별한다.
겹치는 ID가 이미 DB에 있는지, 입력하지 않은 정보가 있는지 식별하여 DB에 데이터를 넣도록 만든다.
https://github.com/jsw4215