반응형
세션 Tracking
서블릿이나 JSP로 작성된 웹 페이지들간의 클라이언트 상태유지를 위해 사용되는 기술을 의미한다.
서로 관련이 없던 페이지들간에 연관성을 설정하는 방법이다.
같은 웹사이트이지만, 다른 페이지에서는 이 사람이 로그인 한 사실을 모르기 때문에, 그 로그인한 정보를 다른 페이지에게 로그인이 되어있는 값으로 세션에 있는 값을 참고하여, 상태를 유지시킨다.
세션 session
세션은 브라우저 당 유일한 세션이 하나씩 발급이 되고, 유지시간은 30분이다.
정보가 서버에 저장이 되어서, 쿠키보다 보안이 유리하다.
세션이 발급되면 세션ID가 쿠키에 저장이되고, 웹사이트에서 이동할 때 이 세션ID를 통해서 웹사이트 안에서 정보가 저장되어있는 값으로 이동이 가능하다.
할당된 세션은 가만히 있으면 30분유지, 브라우저 종료시 즉시 세션으로 할당받은 공간과 ID가 사라진다.
로그인 form
<%@ 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>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js"></script>
<style type="text/css">
#box {
width: 400px;
margin: auto;
margin-top: 200px;
}
input[type="button"] {
width: 100px;
}
</style>
<script type="text/javascript">
function send(f) {
let mem_id = f.mem_id.value.trim();
let mem_pwd = f.mem_pwd.value.trim();
if(mem_id=="") {
alert("아이디를 입력해주세요");
f.mem_id.value="";
f.mem_id.focus();
return;
} else if(mem_pwd=="") {
alert("비밀번호를 입력해주세요");
f.mem_pwd.value="";
f.mem_pwd.focus();
return;
}
f.action = "login.do"; // MemberLoginAction
f.submit();
}// end:send()
</script>
<script type="text/javascript">
// 이 안에 있는 html이 전부 호출이 될 때 실행이 된다.
// javascript 초기화
// window.onload = function(){};
// jQuery 초기화
$(document).ready(function(){
// showMessage(); 이렇게 바로 사용하면 하얀 화면에서 메세지가 나와서 이상하다.
setTimeout(showMessage, 100); // 0.1초후에 메시지 띄워라
});
function showMessage(){
// login_form.do?reason=fail_id
// JSP el 사용
if("${ param.reason == 'fail_id' }" == "true"){
alert("아이디가 틀립니다.");
}
}
</script>
</head>
<body>
<form>
<div id="box">
<div class="panel panel-primary">
<div class="panel-heading"><h5>로그인</h5></div>
<div class="panel-body">
<table class="table">
<tr>
<th>아이디</th>
<!-- form parameter -->
<td><input class="form-control" name="mem_id"></td>
</tr>
<tr>
<th>비밀번호</th>
<!-- form parameter -->
<td><input class="form-control" type="password" name="mem_pwd"></td>
</tr>
<tr>
<td colspan="2" align="center">
<input class="btn btn-success" type="button" value="메인화면" onclick="location.href='list.do'">
<input class="btn btn-primary" type="button" value="로그인" onclick="send(this.form)">
</td>
</tr>
</table>
</div>
</div>
</div>
</form>
</body>
</html>
LoginForm Action
package action.member;
import java.io.IOException;
import dao.MemberDao;
import db.vo.MemberVo;
import jakarta.servlet.ServletException;
import jakarta.servlet.annotation.WebServlet;
import jakarta.servlet.http.HttpServlet;
import jakarta.servlet.http.HttpServletRequest;
import jakarta.servlet.http.HttpServletResponse;
import jakarta.servlet.http.HttpSession;
/**
* Servlet implementation class MemberLoginAction
*/
@WebServlet("/member/login.do")
public class MemberLoginAction extends HttpServlet {
private static final long serialVersionUID = 1L;
/**
* @see HttpServlet#service(HttpServletRequest request, HttpServletResponse response)
*/
protected void service(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
// 로그인 후 다른 화면으로 가야하기에, redirect 해준다.
// login.do?mem_id=dad&mem_pwd=dad
// 0. 수신인코딩 설정하기
request.setCharacterEncoding("utf-8");
// 1. parameter 받기
String mem_id = request.getParameter("mem_id");
String mem_pwd = request.getParameter("mem_pwd");
// 2. mem_id를 이용해서 MemberVo를 얻어온다
MemberVo user = MemberDao.getInstance().selectOne(mem_id);
if(user==null) { // 아이디가 없는(틀린) 경우
// 아이디가 틀렸으니 reason=fail_id라고 값을 다시 보내준다.
// Session Tracking 방법 중 하나 (GET)
response.sendRedirect("login_form.do?reason=fail_id");
return;
}
// 비밀번호가 틀린 경우
if(user.getMem_pwd().equals(mem_pwd)==false) {
response.sendRedirect("login_form.do?reason=fail_pwd&mem_id=" + mem_id);
return;
}
// 로그인 완료시 : 현재 로그인된 객체(user)정보를 session에 저장
HttpSession session = request.getSession();
// user안에는 name,id,pwd등등 모든 정보가 들어있는 객체가 들어있다.
session.setAttribute("user", user);
// main 페이지 이동
response.sendRedirect("list.do");
}
}
아이디가 틀렸을 경우의 로직
비밀번호가 틀렸을 때의 로직
(비밀번호를 가져오기 위해서 getter를 이용해주고, 동일한지 체크 후, Redirect로 reason=fail_pwd 값을 보내준다)
// 비밀번호가 틀린 경우
if(user.getMem_pwd().equals(mem_pwd)==false) {
response.sendRedirect("login_form.do?reason=fail_pwd&mem_id=" + mem_id);
return;
}
function showMessage(){
// login_form.do?reason=fail_id
// JSP el 사용
if("${ param.reason == 'fail_id' }" == "true"){
alert("아이디가 틀립니다.");
}
if("${ param.reason == 'fail_pwd' }" == "true"){
alert("비밀번호가 틀립니다.");
}
}
기존에 입력해놓은 아이디는 동일한 경우 그대로 parameter로 넘겨줘서 받아준다.
<tr>
<th>아이디</th>
<!-- form parameter -->
<td><input class="form-control" name="mem_id" value="${ param.mem_id }"></td>
</tr>
세션 ID가 저장이 되어있다.
list에 로그인이 된 경우 되지 않은 경우를 추가
(session에 정보가 저장되어 있는것을 활용)
<!-- 로그인이 안된경우 -->
<c:if test="${ empty sessionScope.user }">
<input class="btn btn-primary go" type="button" value="로그인" onclick="location.href='login_form.do'">
</c:if>
<!-- 로그인이 된경우 not or ! -->
<c:if test="${ not empty sessionScope.user }">
<b>${ sessionScope.user.mem_name }님 어서오십시오.</b>
<input class="btn btn-primary go" type="button" value="로그아웃" onclick="location.href='logout.do'">
</c:if>
MemberLogoutAction 만들기
package action.member;
import java.io.IOException;
import jakarta.servlet.ServletException;
import jakarta.servlet.annotation.WebServlet;
import jakarta.servlet.http.HttpServlet;
import jakarta.servlet.http.HttpServletRequest;
import jakarta.servlet.http.HttpServletResponse;
import jakarta.servlet.http.HttpSession;
/**
* Servlet implementation class MemberLogoutAction
*/
@WebServlet("/member/logout.do")
public class MemberLogoutAction extends HttpServlet {
private static final long serialVersionUID = 1L;
/**
* @see HttpServlet#service(HttpServletRequest request, HttpServletResponse response)
*/
protected void service(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
// Dispatcher형식으로 호출
HttpSession session = request.getSession();
session.removeAttribute("user");
response.sendRedirect("list.do");
}
}
다시 이 화면으로 돌아온다.
user 값은 sessionScope에 저장이 되어있어서 "user"라는 key 값을 불러서 사용할 수 있는 것이다.
전체 list.do 확인
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>wonder .. let's go</title>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js"></script>
<style type="text/css">
@font-face {
font-family: 'MabinogiClassicR';
src: url('https://fastly.jsdelivr.net/gh/projectnoonnu/noonfonts_2207-01@1.0/MabinogiClassicR.woff2') format('woff2');
font-weight: normal;
font-style: normal;
}
* {
font-family: "MabinogiClassicR";
}
#box {
width: 1000px;
margin: auto;
margin-top: 50px;
}
#title {
text-align: center;
font-weight: bold;
font-size: 32px;
color: skyblue;
text-shadow: 1px 1px 1px gray;
}
.go {
background: skyblue;
border: white;
margin-bottom: 35px;
}
#empty_msg {
text-align: center;
margin-top: 150px;
}
td {
vertical-align : middle !important;
}
</style>
</head>
<body>
<div id="box">
<div id="title">
<h1>방문하신 여러분 환영합니다.</h1>
<img alt="" src="https://www.wonderking.co.kr/img/WonderKingLogo.png">
</div>
<div style="text-align: right; float: right;">
<!-- 로그인이 안된경우 -->
<c:if test="${ empty sessionScope.user }">
<input class="btn btn-primary go" type="button" value="로그인" onclick="location.href='login_form.do'">
</c:if>
<!-- 로그인이 된경우 not or ! -->
<c:if test="${ not empty sessionScope.user }">
<b>${ sessionScope.user.mem_name }님 어서오십시오.</b>
<input class="btn btn-primary go" type="button" value="로그아웃" onclick="location.href='logout.do'">
</c:if>
</div>
<div style="margin-top: 50px; text-align: right; float: right;">
<c:if test="${ empty user }">
<input class="btn btn-primary go" type="button" value="회원가입" onclick="location.href='insert_form.do'">
</c:if>
<c:if test="${ not empty user }">
</c:if>
<input class="btn btn-primary go" type="button" value="캐시충전" onclick="location.href='login_form.do'">
</div>
<table class="table">
<tr class="info">
<th>회원번호</th>
<th>회원명</th>
<th>아이디</th>
<th>비밀번호</th>
<th>우편번호</th>
<th>주소</th>
<th>아이피</th>
<th>가입일자</th>
<th>회원등급</th>
<th>편집</th>
</tr>
<!-- 데이터가 있는 경우 -->
<!-- for(Member Vo vo : list) -->
<c:forEach var="vo" items="${ list }">
<tr>
<td>${ vo.mem_idx }</td>
<td>${ vo.mem_name }</td>
<td>${ vo.mem_id }</td>
<td>${ vo.mem_pwd }</td>
<td>${ vo.mem_zipcode }</td>
<td>${ vo.mem_addr }</td>
<td>${ vo.mem_ip }</td>
<td>${ fn:substring(vo.mem_regdate,0,10) }</td>
<td>${ vo.mem_grade }</td>
<td>
<input class="btn btn-primary" type="button" value="수정">
<input class="btn btn-danger" type="button" value="삭제">
</td>
</tr>
</c:forEach>
</table>
<!-- 데이터가 없는 경우 -->
<c:if test="${ empty requestScope.list }">
<div id="empty_msg">등록된 회원 정보가 없습니다.</div>
</c:if>
</div>
</body>
</html>
수정 삭제 관리자만 할 수 있게 설정
<c:forEach var="vo" items="${ list }">
<tr>
<td>${ vo.mem_idx }</td>
<td>${ vo.mem_name }</td>
<td>${ vo.mem_id }</td>
<td>${ vo.mem_pwd }</td>
<td>${ vo.mem_zipcode }</td>
<td>${ vo.mem_addr }</td>
<td>${ vo.mem_ip }</td>
<td>${ fn:substring(vo.mem_regdate,0,10) }</td>
<td>${ vo.mem_grade }</td>
<td>
<!-- 관리자나 idx값이 해당되는 유저(for문으로 한 번만 적용됨)면 -->
<c:if test="${ (user.mem_grade eq '관리자') or (user.mem_idx eq vo.mem_idx) }">
<input class="btn btn-primary" type="button" value="수정">
<input class="btn btn-danger" type="button" value="삭제">
</c:if>
</td>
</tr>
</c:forEach>
<c:if test="${ (user.mem_grade eq '관리자') or (user.mem_idx eq vo.mem_idx) }">
<input class="btn btn-primary" type="button" value="수정">
<input class="btn btn-danger" type="button" value="삭제" onclick="del('${vo.mem_idx}');">
</c:if>
list에 script 추가
<script type="text/javascript">
$(document).ready(function(){
setTimeout(showMessage, 100);
});
function showMessage() {
if("${ param.reason == 'fail_delete'}" == "true") {
alert("관리자 계정은 삭제할 수가 없습니다.");
}
}
</script>
MemberDeleteAction 추가
package action.member;
import java.io.IOException;
import dao.MemberDao;
import db.vo.MemberVo;
import jakarta.servlet.ServletException;
import jakarta.servlet.annotation.WebServlet;
import jakarta.servlet.http.HttpServlet;
import jakarta.servlet.http.HttpServletRequest;
import jakarta.servlet.http.HttpServletResponse;
import jakarta.servlet.http.HttpSession;
/**
* Servlet implementation class MemberDeleteAction
*/
@WebServlet("/member/delete.do")
public class MemberDeleteAction extends HttpServlet {
private static final long serialVersionUID = 1L;
/**
* @see HttpServlet#service(HttpServletRequest request, HttpServletResponse response)
*/
protected void service(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
// Redirect 방식으로 사용
// /member/delete.do?mem_idx=3
// 1. parameter 받기
int mem_idx = Integer.parseInt(request.getParameter("mem_idx"));
// 관리자가 아닌 일반 계정이면, session 만료
// 2. 로그인한 유저가 일반 / 관리자 인지 판단
HttpSession session = request.getSession();
// Scope 영역에는 모든 타입을 저장할 수 있게 설정했기에 Object 타입으로 받게 되어있다.
// MemberVo는 Object 타입의 자식이기에 다운캐스팅 해야 사용이 가능하다.
MemberVo user = (MemberVo) session.getAttribute("user");
// 로그인 유저가 일반유저면 로그인정보 삭제
if(user.getMem_grade().equals("일반")) {
session.removeAttribute("user");
}
// 3. 삭제 DB delete
if(user.getMem_grade().equals("관리자") && user.getMem_idx() == mem_idx) {
response.sendRedirect("list.do?reason=fail_delete");
return;
} else {
int res = MemberDao.getInstance().delete(mem_idx);
response.sendRedirect("list.do");
}
}
}
list
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>wonder .. let's go</title>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js"></script>
<style type="text/css">
@font-face {
font-family: 'MabinogiClassicR';
src: url('https://fastly.jsdelivr.net/gh/projectnoonnu/noonfonts_2207-01@1.0/MabinogiClassicR.woff2') format('woff2');
font-weight: normal;
font-style: normal;
}
* {
font-family: "MabinogiClassicR";
}
#box {
width: 1000px;
margin: auto;
margin-top: 50px;
}
#title {
text-align: center;
font-weight: bold;
font-size: 32px;
color: skyblue;
text-shadow: 1px 1px 1px gray;
}
.go {
background: skyblue;
border: white;
margin-bottom: 35px;
}
#empty_msg {
text-align: center;
margin-top: 150px;
}
td {
vertical-align : middle !important;
}
</style>
<script type="text/javascript">
function del(mem_idx) {
if(confirm("정말 삭제 하시겠습니까?")==false) return;
// 삭제요청
location.href = "delete.do?mem_idx=" + mem_idx; // MemberDeleteAction
// 본인계정은 삭제 후에 session을 삭제시켜서 로그아웃 시켜야한다.
// 관리자계정은 본인삭제가 불가능하게 만들어야 한다.
}
</script>
<script type="text/javascript">
$(document).ready(function(){
setTimeout(showMessage, 100);
});
function showMessage() {
if("${ param.reason == 'fail_delete'}" == "true") {
alert("관리자 계정은 삭제할 수가 없습니다.");
}
}
</script>
</head>
<body>
<div id="box">
<div id="title">
<h1>방문하신 여러분 환영합니다.</h1>
<img alt="" src="https://www.wonderking.co.kr/img/WonderKingLogo.png">
</div>
<div style="text-align: right; float: right;">
<!-- 로그인이 안된경우 -->
<c:if test="${ empty sessionScope.user }">
<input class="btn btn-primary go" type="button" value="로그인" onclick="location.href='login_form.do'">
</c:if>
<!-- 로그인이 된경우 not or ! -->
<c:if test="${ not empty sessionScope.user }">
<b>${ sessionScope.user.mem_name }님 어서오십시오.</b>
<input class="btn btn-primary go" type="button" value="로그아웃" onclick="location.href='logout.do'">
</c:if>
</div>
<div style="margin-top: 50px; text-align: right; float: right;">
<c:if test="${ empty user }">
<input class="btn btn-primary go" type="button" value="회원가입" onclick="location.href='insert_form.do'">
</c:if>
<c:if test="${ not empty user }">
</c:if>
<input class="btn btn-primary go" type="button" value="캐시충전" onclick="location.href='login_form.do'">
</div>
<table class="table">
<tr class="info">
<th>회원번호</th>
<th>회원명</th>
<th>아이디</th>
<th>비밀번호</th>
<th>우편번호</th>
<th>주소</th>
<th>아이피</th>
<th>가입일자</th>
<th>회원등급</th>
<th>편집</th>
</tr>
<!-- 데이터가 있는 경우 -->
<!-- for(Member Vo vo : list) -->
<c:forEach var="vo" items="${ list }">
<tr>
<td>${ vo.mem_idx }</td>
<td>${ vo.mem_name }</td>
<td>${ vo.mem_id }</td>
<td>${ vo.mem_pwd }</td>
<td>${ vo.mem_zipcode }</td>
<td>${ vo.mem_addr }</td>
<td>${ vo.mem_ip }</td>
<td>${ fn:substring(vo.mem_regdate,0,10) }</td>
<td>${ vo.mem_grade }</td>
<td>
<!-- 관리자나 idx값이 해당되는 유저(for문으로 한 번만 적용됨)면 -->
<c:if test="${ (user.mem_grade eq '관리자') or (user.mem_idx eq vo.mem_idx) }">
<input class="btn btn-primary" type="button" value="수정">
<input class="btn btn-danger" type="button" value="삭제" onclick="del('${vo.mem_idx}');">
</c:if>
</td>
</tr>
</c:forEach>
</table>
<!-- 데이터가 없는 경우 -->
<c:if test="${ empty requestScope.list }">
<div id="empty_msg">등록된 회원 정보가 없습니다.</div>
</c:if>
</div>
</body>
</html>
package action.member;
import jakarta.servlet.RequestDispatcher;
import jakarta.servlet.ServletException;
import jakarta.servlet.annotation.WebServlet;
import jakarta.servlet.http.HttpServlet;
import jakarta.servlet.http.HttpServletRequest;
import jakarta.servlet.http.HttpServletResponse;
import java.io.IOException;
import dao.MemberDao;
import db.vo.MemberVo;
/**
* Servlet implementation class MemberModifyFormAction
*/
@WebServlet("/member/modify_form.do")
public class MemberModifyFormAction extends HttpServlet {
private static final long serialVersionUID = 1L;
/**
* @see HttpServlet#service(HttpServletRequest request, HttpServletResponse response)
*/
protected void service(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
// /member/modify_form?mem_idx=10
int mem_idx = Integer.parseInt(request.getParameter("mem_idx"));
// mem_idx에 해당되는 회원정보 얻어온다
MemberVo vo = MemberDao.getInstance().selectOne(mem_idx);
// request binding
request.setAttribute("vo", vo);
// Dispatcher형식으로 호출
String forward_page = "member_modify_form.jsp";
RequestDispatcher disp = request.getRequestDispatcher(forward_page);
disp.forward(request, response);
}
}
member_insert_form을 복사해서 수정할 것만 수정하자
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js"></script>
<style type="text/css">
@font-face {
font-family: 'MabinogiClassicR';
src: url('https://fastly.jsdelivr.net/gh/projectnoonnu/noonfonts_2207-01@1.0/MabinogiClassicR.woff2') format('woff2');
font-weight: normal;
font-style: normal;
}
* {
font-family: "MabinogiClassicR";
}
/* .all {
postion: relative;
width: 100%;
background: url(https://www.nintendo.co.kr/wallpapers/file/Kirby_Star_Allies/Kirby_Star_Allies-01.jpg) no-repeat 100% 0 fixed;
background-size: cover;
}
.all::before {
content: "";
opactiy: 0.5;
position: absolute;
top: 0px;
left: 0px;
right: 0px;
bottom: 0px;
background-color: #000;
} */
#title {
text-align: center;
margin: 50px;
}
#box {
width: 60vw;
margin: auto;
margin-top: 50px;
margin-bottom: 200px;
}
th {
vertical-align: middle !important;
text-align: right;
font-size: 14px;
}
#id_msg {
display: inline-block;
width: 300px;
height: 20px;
margin-left: 10px;
}
#footer {
width: 100%;
text-align: center;
}
</style>
<!-- 주소검색 API -->
<script src="//t1.daumcdn.net/mapjsapi/bundle/postcode/prod/postcode.v2.js"></script>
<script type="text/javascript">
function find_addr(){
var themeObj = {
bgColor: "#C4F7FF" // 바탕배경색
};
new daum.Postcode({
theme: themeObj,
oncomplete: function(data) {
// input 태그에 넣는 것이니 value 값을 넣어야 한다.
$("#mem_zipcode").val(data.zonecode);
$("#mem_addr").val(data.address);
}
}).open();
}// end:find_addr()
function send(f){
let mem_name = f.mem_name.value.trim();
let mem_pwd = f.mem_pwd.value.trim();
let mem_zipcode = f.mem_zipcode.value.trim();
let mem_addr = f.mem_addr.value.trim();
if(mem_name=='') {
alert("이름을 입력하세요");
f.mem_name.value="";
f.mem_name.focus();
return;
}
if(mem_pwd=='') {
alert("비밀번호을 입력하세요");
f.mem_pwd.value="";
f.mem_pwd.focus();
return;
}
if(mem_zipcode=='') {
alert("우편번호를 입력하세요");
f.mem_zipcode.value="";
f.mem_zipcode.focus();
return;
}
if(mem_addr=='') {
alert("주소를 입력하세요");
f.mem_addr.value="";
f.mem_addr.focus();
return;
}
f.action="modify.do"; // MemberModifyAction
f.submit();
}// end:send()
</script>
<script type="text/javascript">
$(document).ready(function(){
// element + attribute selector
// 기본 select 표시 화면이 내 grade가 나오게끔 설정
$("select[name='mem_grade']").val("${vo.mem_grade}");
});
</script>
</head>
<body>
<div id="title"><h4>글로벌 IT 온라인 ver 1.0.05</h4>
<img alt="" src="https://www.wonderking.co.kr/upload/img/write/notice/wUZw05Sl87KakaoTalk_20240502_110610130.png">
</div>
<div id="title"><h2>회원가입을 환영합니다.</h2></div>
<form class="form-inline">
<input type="hidden" name="mem_idx" value="${ vo.mem_idx }">
<div id="box">
<div class="panel panel-primary">
<div class="panel-heading"><h4>회원정보수정</h4></div>
<div class="panel-body">
<table class="table">
<tr>
<th>이름</th>
<td>
<input style="width:50%" class="form-control" name="mem_name" value="${ requestScope.vo.mem_name }">
</td>
</tr>
<tr>
<th>아이디</th>
<td>
<input style="width:50%" class="form-control" name="mem_id" value="${ vo.mem_id }" readonly="readonly">
</td>
</tr>
<tr>
<th>비밀번호</th>
<td>
<input style="width:50%" class="form-control" type="password" name="mem_pwd" value="${ vo.mem_pwd }">
</td>
</tr>
<tr>
<th>우편번호</th>
<td>
<!-- 한 줄에 표시해주기 위해서 form-inline으로 잡아준다. -->
<input style="width:50%" class="form-control" name="mem_zipcode" id="mem_zipcode" value="${ vo.mem_zipcode }">
<input class="btn btn-info" type="button" value="주소검색" onclick="find_addr();">
</td>
</tr>
<th>주소</th>
<td>
<!-- 한 줄에 표시해주기 위해서 form-inline으로 잡아준다. -->
<input style="width:100%" class="form-control" name="mem_addr" id="mem_addr" value="${ vo.mem_addr }">
</td>
</tr>
<tr>
<th>회원등급</th>
<td>
<!-- 로그인 유저가 관리자면 회원등급 수정 가능 -->
<c:if test="${ user.mem_grade eq '관리자' }">
<select name="mem_grade" class="form-control" style="width:50%">
<option value="일반">일반</option>
<option value="관리자">관리자</option>
</select>
</c:if>
<!-- 로그인 유저가 일반이면 회원등급 수정 불가능 -->
<c:if test="${ user.mem_grade eq '일반' }">
<input style="width:50%" class="form-control" name="mem_grade" value="${ vo.mem_grade }" readonly="readonly">
</c:if>
</td>
</tr>
<tr>
<td colspan="2" align="center">
<input class="btn btn-success" type="button" value="목록보기" onclick="location.href='list.do'">
<input class="btn btn-primary" type="button" value="수정하기" onclick="send(this.form);">
</td>
</tr>
</table>
</div>
</div>
</div>
</form>
<div id="footer">
<img alt="" src="../image/footer.JPG">
</div>
</body>
</html>
MemberModifyAction
package action.member;
import jakarta.servlet.RequestDispatcher;
import jakarta.servlet.ServletException;
import jakarta.servlet.annotation.WebServlet;
import jakarta.servlet.http.HttpServlet;
import jakarta.servlet.http.HttpServletRequest;
import jakarta.servlet.http.HttpServletResponse;
import java.io.IOException;
import dao.MemberDao;
import db.vo.MemberVo;
/**
* Servlet implementation class MemberModifyAction
*/
@WebServlet("/member/modify.do")
public class MemberModifyAction extends HttpServlet {
private static final long serialVersionUID = 1L;
/**
* @see HttpServlet#service(HttpServletRequest request, HttpServletResponse response)
*/
protected void service(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
// /member/modify.do?mem_idx=7&mem_name=이름석자&mem_id=ㅁㄴㄻㄴㄹ&mem_pwd=sfafas
// &mem_zipcode=55712&mem_addr=전북특별자치도+남원시+아영면+흥부로+16&mem_grade=일반
request.setCharacterEncoding("utf-8");
int mem_idx = Integer.parseInt(request.getParameter("mem_idx"));
String mem_name = request.getParameter("mem_name");
String mem_id = request.getParameter("mem_id");
String mem_pwd = request.getParameter("mem_pwd");
String mem_zipcode = request.getParameter("mem_zipcode");
String mem_addr = request.getParameter("mem_addr");
String mem_grade = request.getParameter("mem_grade");
// vo 생성자
MemberVo vo = new MemberVo(mem_name, mem_id, mem_pwd, mem_zipcode, mem_addr, mem_grade, mem_idx);
int res = MemberDao.getInstance().update(vo);
// Redirect 형식으로 추출
response.sendRedirect("list.do");
}
}
Dao
public int update(MemberVo vo) {
// TODO Auto-generated method stub
int res = 0;
Connection conn = null;
PreparedStatement pstmt = null;
String sql = "update member set mem_name=?,mem_id=?,mem_pwd=?,mem_zipcode=?,mem_addr=?,mem_grade=? where mem_idx=? ";
try {
// 1. Connection 얻어오기
conn = DBService.getInstance().getConnection();
// 2. PreparedStatement
pstmt = conn.prepareStatement(sql);
// 3. pstmt parameter index 채우기
pstmt.setString(1, vo.getMem_name());
pstmt.setString(2, vo.getMem_id());
pstmt.setString(3, vo.getMem_pwd());
pstmt.setString(4, vo.getMem_zipcode());
pstmt.setString(5, vo.getMem_addr());
pstmt.setString(6, vo.getMem_grade());
pstmt.setInt(7, vo.getMem_idx());
// 4. DB update
res = pstmt.executeUpdate();
} catch (Exception e) {
// TODO: handle exception
e.printStackTrace();
} finally {
// 예외 처리에서 무조건 실행되는 부분
// 마무리 작업(열린역순으로 닫기)
// 한 번에 잡아서 try catch 하기 : alt + shift + s
try {
if (pstmt != null)
pstmt.close();
if (conn != null)
conn.close();
} catch (SQLException e) {
// TODO Auto-generated catch block
e.printStackTrace();
}
}
return res;
}// end:update()
Vo
public MemberVo(String mem_name, String mem_id, String mem_pwd, String mem_zipcode, String mem_addr,
String mem_grade, int mem_idx) {
super();
this.mem_name = mem_name;
this.mem_id = mem_id;
this.mem_pwd = mem_pwd;
this.mem_zipcode = mem_zipcode;
this.mem_addr = mem_addr;
this.mem_grade = mem_grade;
this.mem_idx = mem_idx;
}
반응형
'javaScript↗' 카테고리의 다른 글
| 웹 파일 업로드 (Ajax를 이용한 처리) (0) | 2024.06.28 |
|---|---|
| 웹 파일 업로드 (0) | 2024.06.27 |
| Ajax를 이용한 회원관리 예제 (0) | 2024.06.25 |
| [오류해결]프로젝트 xar 파일로 import시, 오류날 때 (0) | 2024.06.24 |
| Ajax 실전 활용 게시판 예시 (비밀번호 체크) (0) | 2024.06.24 |