회원 정보 수정 기능 구현

Jang Seok Woo·2020년 9월 8일

웹개발

목록 보기

1/31

회원 정보 수정 기능

개발환경 : Oracle11g, JSP

회원 정보 수정기능을 만들어보자.

우선 회원정보 수정란을 만든다.

<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="userUpdate.jsp">회원정보 수정</a></li>
	<li><a href="logoutAction.jsp">로그아웃</a></li>
	</ul>	
</li>
</ui>

다음으로 회원정보 수정을 눌렀을 때 나타날 페이지를 만든다

기존의 회원가입 페이지에 각 정보란에 해당 유저의 데이터를 띄워두도록 하자.

userUpdate.jpg

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ page import="java.io.PrintWriter"%>
<%@ page import="user.User"%>
<%@ page import="user.UserDAO"%>
<!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>
	<%
		String userID = null;
		if(session.getAttribute("userID") != null) {
			userID = (String) session.getAttribute("userID");
			System.out.println("userUpdate.jsp : userID"+userID);
		}else if (session.getAttribute("userID") == null) {
			PrintWriter script = response.getWriter();
			script.println("<script>");
			script.println("alert('로그인을 하세요.')");
			script.println("location.href='login.jsp'");
			script.println("</script>");
		}
		
		User user = new UserDAO().getUser(userID);
		if (!userID.equals(user.getUserID())) {
			PrintWriter script = response.getWriter();
			script.println("<script>");
			script.println("alert('권한이 없습니다.')");
			script.println("location.href='login.jsp'");
			script.println("</script>");
		}
	%>
	<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="userUpdateAction.jsp">
				<h3 style="text-align: center;">회원정보 수정</h3>
				<div class="form-group">
					<input type="text" class="form-control" placeholder="아이디" name="userID" maxlength="20" value="<%=user.getUserID()%>" readonly>
				</div>
				<div class="form-group">
					<input type="password" class="form-control" placeholder="비밀번호" name="userPassword" maxlength="20" value="<%=user.getUserPassword()%>">
				</div>
				<div class="form-group">
					<input type="text" class="form-control" placeholder="이름" name="userName" maxlength="20" value="<%=user.getUserName()%>">
				</div>
				<div class="form-group" style="text-align: center;">
					<div class="btn-group" data-toggle="buttons">
						
							<%
							if(user.getUserGender().equals("MAN")){
								System.out.println("userUpdate:user.getUserGender_inside 1 : " + user.getUserGender());
							%>
								<label class="btn btn-primary active">
							<% }else {
								System.out.println("userUpdate:user.getUserGender_inside 2 : " + user.getUserGender());
							%>
								<label class="btn btn-primary">
							<%}%>
						
							
							<input type="radio" name="userGender" autoComplete="off" value="MAN" checked>남자
						</label>
						
							<%
							if(user.getUserGender().equals("WOMAN")){ 
								System.out.println("userUpdate:user.getUserGender_inside 3 : " + user.getUserGender());
							%>
								<label class="btn btn-primary active">
							<% }else {
								System.out.println("userUpdate:user.getUserGender_inside 4 : " + user.getUserGender());
							%>
								<label class="btn btn-primary">
							<%}%>
						
							<input type="radio" name="userGender" autoComplete="off" value="WOMAN" checked>여자
						</label>
					</div>
				</div>
				<div class="form-group">
					<input type="email" class="form-control" placeholder="이메일" name="userEmail" maxlength="50" value="<%=user.getUserEmail()%>">
				</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>

우선 가장 먼저 import로 user와 userDAO를 가져온다.

<%@ page import="java.io.PrintWriter"%>
<%@ page import="user.User"%>
<%@ page import="user.UserDAO"%>

userID를 통해 로그인 한상태인지 확인을 한후, 로그인 한 해당 유저의 정보를 Oracle로부터 불러온다.

String userID = null;
		if(session.getAttribute("userID") != null) {
			userID = (String) session.getAttribute("userID");
			System.out.println("userUpdate.jsp : userID"+userID);
		}else if (session.getAttribute("userID") == null) {
			PrintWriter script = response.getWriter();
			script.println("<script>");
			script.println("alert('로그인을 하세요.')");
			script.println("location.href='login.jsp'");
			script.println("</script>");
		}
		
		User user = new UserDAO().getUser(userID);
		if (!userID.equals(user.getUserID())) {
			PrintWriter script = response.getWriter();
			script.println("<script>");
			script.println("alert('권한이 없습니다.')");
			script.println("location.href='login.jsp'");
			script.println("</script>");
		}

여기서 getUser함수로 user의 정보를 불러오게 되는데 어떻게 불러올지 생각해본다.
먼저 Oracle에 날려보낼 쿼리를 찾아본다.

Select * from user_bbs where userid=’아이디’;

해당 쿼리를 생각해냈으면 실제로 터미널에서 오라클에 날려보고, 실제 데이터를 가져오는지 눈으로 확인한다.

그리고 userDAO.java 파일에 getUser 함수를 만든다.

	public User getUser(String userID) {
		String SQL = "SELECT * FROM USER_BBS WHERE USERID='"+userID+"'";
		try {
			stmt = conn.createStatement();
			System.out.println("getUser:execute_before" + SQL);
			rs=stmt.executeQuery(SQL);
			User user = new User();
			if(rs.next()) {
			user.setUserID(rs.getString(1));
			System.out.println("getUser:user.getUserID" + user.getUserID());
			user.setUserPassword(rs.getNString(2));
			user.setUserName(rs.getString(3));
			user.setUserGender(rs.getString(4));
			user.setUserEmail(rs.getString(5));
			return user;
			}
		}catch(Exception e){
			System.out.println("exeption");
			e.printStackTrace();
		}
		System.out.println("return: -1");
		return null;
	}

쿼리를 날린 후 해당 데이터를 user 클래스 변수에 담는다. 이때 중요한 건 if(resultset.next()) 함수로 둘러쌓고 데이터를 접근해야지만 데이터를 가져올 수 있다.

<div class="form-group">
<input type="text" class="form-control" placeholder="아이디" name="userID" maxlength="20" value="<%=user.getUserID()%>" readonly>
</div>

그리고 다음과 같이 입력받는 칸에 value를 따로 추가하여 받아온 user 데이터를 넣어준다.

맨 윗칸인 userID는 readonly를 붙여 수정할 수 없도록 한다. userID를 기반으로 데이터 검색을 해 update해야 하기 때문인데, 수정완료를 눌렀을 시 Oracle에 날릴 쿼리를 생각해보면 이해가 간다.

	public int modify(User user) {
		String SQL = "UPDATE user_bbs SET userID='" + user.getUserID() + "'"+", userPassword='" + user.getUserPassword() + "'"+", userName='" + user.getUserName() + "'"
																								+", userGender='" + user.getUserGender() + "'"+", userEmail="+ "'" + user.getUserEmail() + "' WHERE userID='"+ user.getUserID() +"'";
		try {
			stmt = conn.createStatement();
			System.out.println("executeupdate_before");
			return stmt.executeUpdate(SQL);
		}catch(Exception e){
			System.out.println("exeption");
			e.printStackTrace();
		}
		System.out.println("return: -1");
		return -1;
	}

UPDATE user_bbs SET userPassword=’비밀번호’, username=’이름’, userGender=’MAN/WOMAN’, userEmail=’이메일’ WHERE userID=’아이디’;

이런식으로 날릴건데 데이터를 찾는 기준이 아이디가 되고 각 페이지를 넘어갈 시에도 userID를 기준으로 데이터를 접근하는 primary key가 되기 때문에 아이디는 수정불가하도록 설정해준다.

수정완료를 눌렀을 때, userUpdateAction.jsp 파일로 이동해 DB작업을 한다.

userUpdateAction.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ page import="user.UserDAO" %>
<%@ page import="user.User" %>
<%@ page import="java.io.PrintWriter"%>
<% request.setCharacterEncoding("UTF-8"); %>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>update action page</title>
</head>
<body>
	<%
	String userID = null;
	User user = new User();
	if(session.getAttribute("userID")!=null);{
	user.setUserID((String)session.getAttribute("userID"));
		userID = (String) session.getAttribute("userID");
	}
	if(userID == null){
		PrintWriter script = response.getWriter();
		script.println("<script>");
		script.println("alert('로그인을 하세요')");
		script.println("location.href='login.jsp'");
		script.println("</script>");
	} 
	String userName = null;
	if (request.getParameter("userName") != null) {
		//userName = Integer.parseInt(request.getParameter("bbsID"));
		
		user.setUserName(request.getParameter("userName"));
	}
	if (request.getParameter("userPassword") != null) {
		//userName = Integer.parseInt(request.getParameter("bbsID"));
		
		user.setUserPassword(request.getParameter("userPassword"));
	}
	if (request.getParameter("userGender") != null) {
		//userName = Integer.parseInt(request.getParameter("bbsID"));
		
		user.setUserGender(request.getParameter("userGender"));
	}
	if (request.getParameter("userEmail") != null) {
		//userName = Integer.parseInt(request.getParameter("bbsID"));
		
		user.setUserEmail(request.getParameter("userEmail"));
	}
	
	
	if (!userID.equals(user.getUserID())) {
		PrintWriter script = response.getWriter();
		script.println("<script>");
		script.println("alert('권한이 없습니다.')");
		//script.println("location.href='login.jsp'");
		script.println("</script>");
	}else{
		if(request.getParameter("userPassword") == null || request.getParameter("userName") == null || request.getParameter("userGender") == null || request.getParameter("userEmail") == null
				||request.getParameter("userPassword").equals("") || request.getParameter("userName").equals("")||request.getParameter("userGender").equals("") || request.getParameter("userEmail").equals("")){
			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.modify(user);
			
			System.out.println("update for result int : " + result);
			if (result==-1){
				PrintWriter script = response.getWriter();
				script.println("<script>");
				script.println("alert('수정에 실패했습니다.')");
				script.println("history.back()");
				script.println("</script>");	
			}
			else{
				System.out.println("update user href");
				PrintWriter script = response.getWriter();
				script.println("<script>");
				script.println("location.href = 'main.jsp'");
				script.println("</script>");
			}
		}
	}
	%>	
</body>
</html>

다른 부분의 로직은 해당 유저가 맞는지 빈 칸은 없는지 로그인 되어있는 상태인지 등이고,

중요한 부분은

UserDAO userDAO = new UserDAO();
int result = userDAO.modify(user);

새로 만든 DAO함수 modify 여기서 적용시켜준다.

추가로 userUpdate 를 불러올 때, 남자/여자는 radio 버튼인데 데이터를 불러와 active시켜줄 부분을 정해준다.

	<%
	if(user.getUserGender().equals("MAN")){
								System.out.println("userUpdate:user.getUserGender_inside 1 : " + user.getUserGender());
	%>
<label class="btn btn-primary active">
	<% }else {
								System.out.println("userUpdate:user.getUserGender_inside 2 : " + user.getUserGender());
	%>
	<label class="btn btn-primary">
	<%}%>							
<input type="radio" name="userGender" autoComplete="off" value="MAN" checked>남자
	</label>

해당 데이터가 남자면 남자쪽 버튼이 눌려져있도록, 여자면 여자쪽 버튼이 눌려져 있도록 설정한다.

끝.

Jang Seok Woo

https://github.com/jsw4215

다음 포스트

게시판 검색기능 구현

1개의 댓글

짱아

2023년 2월 15일

User user = new UserDAO().getUser(userID);
if (!userID.equals(user.getUserID())) {
PrintWriter script = response.getWriter();
script.println("");
}에서 내부서버오류가 나네요.... userupdate.jsp입니다

답글 달기