JSP) 관리자 권한 변경 - Referer, dataset

안녕하세요, 코린이의 코딩 학습기 채니 입니다.

 

개인 포스팅용으로 내용에 오류 및 잘못된 정보가 있을 수 있습니다.

---

관리자 - 권한 변경

memberList.jsp

// 검색바 생략
    <table id="tbl-member">
		<thead>
			<tr>
				<th>아이디</th>
				<th>이름</th>
				<th>회원권한</th>	<%-- select 태그로 처리 --%>
				<th>성별</th>
				<th>생년월일</th>
				<th>이메일</th>
				<th>전화번호</th>
				<th>포인트</th> <%-- 세자리콤마 DecimalFormat --%>
				<th>취미</th>
				<th>가입일</th> <%-- 날짜형식 yyyy-MM-dd --%>
			</tr>
		</thead>
		<tbody>
		<% if(memberList == null || memberList.isEmpty()) { %>
			<tr>
				<td colspan="10" align="center">검색 결과가 없습니다.</td>
			</tr>
		<% } else { 
			for(Member member : memberList) { %>
				<tr>
					<td><%= member.getMemberId() %></td>
					<td><%= member.getMemberName() %></td>
					<td>
						<select class="member-role" data-member-id="<%= member.getMemberId() %>">
							<option value="A" <%= MemberRole.A == member.getMemberRole() ? "selected" : ""%>>관리자</option>
							<option value="U" <%= MemberRole.U == member.getMemberRole() ? "selected" : "" %>>일반</option>
						</select>
					</td>
					<td><%= member.getGender() == null ? "" : (member.getGender() == Gender.M) ? "남" : "여" %></td>
					<td><%= member.getBirthday() != null ? member.getBirthday() : "" %></td>
					<td><%= member.getEmail() != null ? member.getEmail() : "" %></td>
					<td><%= member.getPhone() %></td>
					<td><%= new DecimalFormat("#,###").format(member.getPoint()) %></td>
					<td><%= member.getHobby() != null ? member.getHobby() : "" %></td>
					<td><%= new SimpleDateFormat("yyyy-MM-dd").format(member.getEnrollDate()) %></td>
				</tr>
			<% }
			} %>
		</tbody>
	</table>
	
	<div id="pagebar">
		<%= request.getAttribute("pagebar") %>
	</div>
</section>
<script>
document.querySelectorAll(".member-role").forEach((select) => {
	select.onchange = (e) => {
		console.log(e.target.value);
	}
});

데이터 변경 시

select 태그가 변경될 때마다 e.target.value값을 찍어보았습니다.

잘 출력되는 것을 확인할 수 있고, 이를 이용하여 권한 변경을 해줄 수 있을 것 같습니다.

 

※ dataset

태그 자체에 데이터를 저장하는 dataset을 이용하여 memberId값을 저장해주었습니다.

data- 로 시작하고 member-id가 key값, member.getMemberRole()이 value값이 됩니다.

실제 저장은 해당 태그의 dataset이라는 속성의 key값이 속성명, value값이 속성값이 되어 저장됩니다.

이 때는, -으로 연결된 key값이 카멜케이싱으로 변환되어 저장됩니다.

 

setter도 마찬가지로 카멜케이싱으로 속성명을 지정하면, HTML태그에서는 -으로 연결되어 변환!

 

---

POST 요청으로 권한 변경

- POST 요청은 반드시 폼을 통해야 하므로, hidden form 생성

 

memberList.jsp

<form action="<%= request.getContextPath()%>/admin/memberRoleUpdate" method="POST" name="memberRoleUpdateFrm">
	<input type="hidden" name="memberId"/>
	<input type="hidden" name="memberRole"/>
</form>
<script>
document.querySelectorAll(".member-role").forEach((select) => {
	select.onchange = (e) => {
		if(confirm(`해당 회원의 권한을 \${e.target.value}로 변경하시겠습니까?`)) {
			const frm = document.memberRoleUpdateFrm;
			frm.memberId.value = e.target.dataset.memberId;
			frm.memberRole.value = e.target.value;
			frm.submit();
		} else {
			//원상복구
			e.target.querySelector("[selected]").selected = true;
		} 
	}
});
</script>

확인 버튼을 눌렀다면, 생성한 form의 memberId, memberRole에 변경하고자 하는 dataset의 memberId 값, value 값을 대입해준 후 submit하였습니다.

만일 취소 버튼을 눌렀다면, 원상복구 시켜야 하므로 [selected]를 가져와 해당 값을 true로 변경해주었습니다.

 

Controller

AdminMemberRoleUpdateServlet

@WebServlet("/admin/memberRoleUpdate")
public class AdminMemberRoleUpdateServlet extends HttpServlet {
	private static final long serialVersionUID = 1L;
	private MemberService memberService = new MemberService();
	
	/**
	 * @see HttpServlet#doPost(HttpServletRequest request, HttpServletResponse response)
	 */
	protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
		try {
			// 1. 사용자입력처리
			String memberId = request.getParameter("memberId");
			MemberRole memberRole = MemberRole.valueOf(request.getParameter("memberRole"));
			Member member = new Member();
			member.setMemberId(memberId);
			member.setMemberRole(memberRole);
			
			// 2. 업무로직
			int result = memberService.updateMemberRole(member);
			
			// 3. redirect
			String referer = request.getHeader("Referer");
			System.out.println("referer = " + referer);
			response.sendRedirect(referer);
		} catch(Exception e) {
			e.printStackTrace();
			throw e;
		}
	}
}

 

Service

MemberService

public int updateMemberRole(Member member) {
    Connection conn = getConnection();
    int result = 0;
    try {
        result = memberDao.updateMemberRole(conn, member);
        commit(conn);
    } catch(Exception e) {
        rollback(conn);
        throw e;
    } finally {
        close(conn);
    }
    return result;
}

 

Dao

MemberDao

// updateMemberRole = update member set member_role = ? where member_id = ?
public int updateMemberRole(Connection conn, Member member) {
    PreparedStatement pstmt = null;
    int result = 0;
    String sql = prop.getProperty("updateMemberRole");

    try {
        pstmt = conn.prepareStatement(sql);
        pstmt.setString(1, member.getMemberRole().name());
        pstmt.setString(2, member.getMemberId());
        result = pstmt.executeUpdate();
    } catch (SQLException e) {
        throw new MemberException("회원 권한 변경 오류!", e);
    } finally {
        close(pstmt);
    }
    return result;
}

권한이 잘 변경되어있는 것을 확인할 수 있습니다.

 

만일 redirect를 '/admin/memberList'로 한다면, 검색한 내역들이 풀려버리기 때문에, 다시 찾기 번거로울 것입니다.

이전 요청 내역을 저장하고 있는 Header의 Referer를 이용하여 변경 후에도 해당 페이지에 그대로 머물고 있는 듯이 처리해주었습니다.

@콘솔출력값
referer = http://localhost:9090/mvc2/admin/memberFinder?searchType=gender&searchKeyword=F&cPage=2
302