상품등록을 관리자만 할 수 있도록
로그인 인증 페이지 만들기
server
tomcat-users.xml
<?xml version="1.0" encoding="UTF-8"?>
<!--
Licensed to the Apache Software Foundation (ASF) under one or more
contributor license agreements. See the NOTICE file distributed with
this work for additional information regarding copyright ownership.
The ASF licenses this file to You under the Apache License, Version 2.0
(the "License"); you may not use this file except in compliance with
the License. You may obtain a copy of the License at
http://www.apache.org/licenses/LICENSE-2.0
Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
--><tomcat-users version="1.0" xmlns="http://tomcat.apache.org/xml" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://tomcat.apache.org/xml tomcat-users.xsd">
<!--
NOTE: By default, no user is included in the "manager-gui" role required
to operate the "/manager/html" web application. If you wish to use this app,
you must define such a user - the username and password are arbitrary. It is
strongly recommended that you do NOT use one of the users in the commented out
section below since they are intended for use with the examples web
application.
-->
<!--
NOTE: The sample user and role entries below are intended for use with the
examples web application. They are wrapped in a comment and thus are ignored
when reading this file. If you wish to configure these users for use with the
examples web application, do not forget to remove the <!.. ..> that surrounds
them. You will also need to set the passwords to something appropriate.
-->
<!-- 톰켓서버에 각각 role 2개를 명시한 것임, 3명의 user가 역할 맡음. -->
<role rolename="tomcat"/>
<role rolename="role1"/>
<role rolename="admin"/> <!-- 새로운 역할 추가 -->
<user username="tomcat" password="tomcat0217" roles="tomcat"/>
<user username="both" password="both0217" roles="tomcat,role1"/>
<user username="role1" password="role0217" roles="role1"/>
<user username="admin" password="admin0217" roles="admin" />
<!-- 추가된 새로운 역할 admin에 대한 사용자와 비밀번호 설정 -->
</tomcat-users>
web.xml
<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns="http://xmlns.jcp.org/xml/ns/javaee" xsi:schemaLocation="http://xmlns.jcp.org/xml/ns/javaee http://xmlns.jcp.org/xml/ns/javaee/web-app_3_1.xsd" id="WebApp_ID" version="3.1">
<display-name>WebStore</display-name>
<welcome-file-list>
<welcome-file>index.html</welcome-file>
<welcome-file>index.htm</welcome-file>
<welcome-file>index.jsp</welcome-file>
<welcome-file>default.html</welcome-file>
<welcome-file>default.htm</welcome-file>
<welcome-file>default.jsp</welcome-file>
</welcome-file-list>
<!-- 404에러가 발생하면 자동으로 exceptionNoPage.jsp 페이지 보여주게 된다. -->
<error-page>
<error-code>404</error-code>
<location>/exceptionNoPage.jsp</location>
</error-page>
<!-- 시큐리티 역할 추가 -->
<security-role>
<description>관리자</description>
<role-name>admin</role-name>
</security-role>
<!-- 제약조건 추가 -->
<security-constraint>
<display-name>WebStore Security</display-name>
<web-resource-collection> <!-- 웹자원 제약조건 설정 -->
<web-resource-name>WebStore</web-resource-name> <!-- 프로젝트 이름 -->
<description></description>
<url-pattern>/addProduct.jsp</url-pattern> <!-- 상품등록 페이지 -->
</web-resource-collection>
<auth-constraint> <!-- 권한 제약조건 설정 -->
<description>권한 관리자명</description>
<role-name>admin</role-name>
</auth-constraint>
</security-constraint>
<login-config> <!-- 시큐리티 인증 설정 -->
<auth-method>FORM</auth-method> <!-- 폼 인증처리 방식 -->
<form-login-config>
<form-login-page>/login.jsp</form-login-page> <!-- 로그인이 성공할 경우 -->
<form-error-page>/login_failed.jsp</form-error-page> <!-- 로그인이 실패할 경우 -->
</form-login-config>
</login-config>
</web-app>
login_failed.jsp
<%@page import="javax.websocket.SendResult"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>로그인 실패</title>
</head>
<body>
<!-- 로그인 인증실패시 error값이 1로 설정되어 다시 로그인 페이지로 이동 -->
<% response.sendRedirect("login.jsp?error=1"); %>
</body>
</html>
login.jsp
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>로그인(login)</title>
<link rel="stylesheet" href="./resources/css/bootstrap.min.css">
</head>
<body>
<jsp:include page="menu.jsp"/>
<div class="jumbotron">
<div class="container">
<h1 class="display-3">로그인</h1>
</div>
</div>
<div class="container" align="center">
<div class="col-md-4 col-md-offset-4">
<h3 class="form-signin-heading">Please sign in</h3>
<% /* 로그인 인증에 실패했을 때 작동하는 부분 */
String error = request.getParameter("error");
if(error != null) { /* 에러가 났음 */
out.println("<div class = 'alert alert-danger'>");
out.println("아이디와 비밀번호를 확인해 주세요!");
out.println("</div>");
}
%>
<form action="j_security_check" class="form-signin" method="post">
<div class="from_group"> <!-- 아이디 입력부분 -->
<label for="inputUserName" class="sr-only">User Name</label> <!-- class="sr-only" : 출력을 숨기는 스타일 -->
<input type="text" class="form-control" placeholder="ID" name='j_username' required autofocus>
</div>
<div class="from_group"> <!-- 비밀번호 입력부분 -->
<label for="inputPassword" class="sr-only">Password</label> <!-- class="sr-only" : 출력을 숨기는 스타일 -->
<input type="password" class="form-control" placeholder="password" name='j_password' required>
</div>
<!-- btn-lg : 버튼크기, btn-success : 초록색 버튼 -->
<button class="btn btn-lg btn-success btn-block" type="submit">로그인</button>
</form>
</div>
</div>
</body>
</html>
logout.jsp
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>로그아웃</title>
</head>
<body>
<%
session.invalidate(); //모든 사용자 삭제함.
response.sendRedirect("addProduct.jsp");
%>
</body>
</html>
로그아웃 버튼 추가
addProduct.jsp
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>상품 등록</title>
<link rel="stylesheet" href="./resources/css/bootstrap.min.css">
<script type="text/javascript" src="./resources/js/vaildation.js"></script>
</head>
<body>
<fmt:setLocale value='<%=request.getParameter("language") %>'/>
<fmt:bundle basename="kr.gov.resourceBundle.message">
<jsp:include page="menu.jsp"/>
<!-- 점보트론 : 대형전광판이라는 의미. 점보트론 안에 다양한 컴포넌트(텍스트,이미지,회사로고 등) 포함 가능 -->
<div class="jumbotron">
<div class="contaner">
<!-- <h1 class="display-3">상품 등록</h1> -->
<h1 class="display-3"><fmt:message key="title" /></h1>
</div>
</div>
<div class="container">
<!-- 한글 혹은 영어로 표시할지 선택하는 부분 -->
<div class="text-right">
<a href="?language=ko">korean</a>||<a href="?language=en">English</a>
<a href="logout.jsp" class="btn btn-sm btn-success pull-right"><b>로그아웃</b></a> <!-- 로그아웃 버튼 -->
</div>
<!-- class = "form-horizontal" : 폼요소들이 수평적으로 배치되도록 해주는 속성 -->
<form action="./processAddProduct.jsp" name="newProduct" class="form-horizontal"
method="post" enctype="multipart/form-data">
<div class="form-group row">
<!-- 화면크기 768px 이상일때 col-sm-?이 부분이 적용되고, div요소의 block특성에 의해
100%너비를 가지면 수직으로 쌓이게 만들어준다. -->
<label class="col-sm-2"><b><fmt:message key="productId" /></b></label>
<div class="col-sm-3">
<input type="text" id="productId" name="productId" class="form-control" placeholder="상품코드를 입력하세요.">
</div>
</div>
<div class="form-group row">
<label class="col-sm-2"><b><fmt:message key="pname" /></b></label>
<div class="col-sm-3">
<input type="text" id="pname" name="pname" class="form-control" placeholder="상품명를 입력하세요.">
</div>
</div>
<div class="form-group row">
<label class="col-sm-2"><b><fmt:message key="unitprice" /></b></label>
<div class="col-sm-3">
<input type="text" id="unitprice" name="unitprice" class="form-control" placeholder="가격을 입력하세요.">
</div>
</div>
<div class="form-group row">
<label class="col-sm-2"><b><fmt:message key="description" /></b></label>
<div class="col-sm-5">
<textarea rows="2" cols="50" name="description" class="form-control"></textarea>
</div>
</div>
<div class="form-group row">
<label class="col-sm-2"><b><fmt:message key="menufecturer" /></b></label>
<div class="col-sm-5">
<input type="text" name="menufecturer" class="form-control" placeholder="제조사를 입력하세요.">
</div>
</div>
<div class="form-group row">
<label class="col-sm-2"><b><fmt:message key="category" /></b></label>
<div class="col-sm-5">
<input type="text" name="category" class="form-control" placeholder="분류를 입력하세요.">
</div>
</div>
<div class="form-group row">
<label class="col-sm-2"><b><fmt:message key="numberOfstock" /></b></label>
<div class="col-sm-5">
<input type="text" id="numberOfstock" name="numberOfstock" class="form-control" placeholder="제고 수를 입력하세요.">
</div>
</div>
<div class="form-group row">
<label class="col-sm-2"><b><fmt:message key="condition" /></b></label>
<div class="col-sm-5">
<input type="radio" name="condition" value="New"><fmt:message key="New" />
<input type="radio" name="condition" value="Old"><fmt:message key="Old" />
<input type="radio" name="condition" value="Refurbished"><fmt:message key="Refurbished" />
</div>
</div>
<!-- 상품 이미지 업로드 부분 -->
<div class="form-group row">
<label class="col-sm-2"><b><fmt:message key="productImage" /></b></label>
<div class="col-sm-5">
<input type="file" name="productImage" class="form-control">
</div>
</div>
<div class="form-group row">
<!-- offset지점은 col의 2만큼 띄움 -->
<div class="col-sm-offset-2 col-sm-10">
<!-- 타입을 button으로 바꾸는 이유 : submit타입을 주게되면 유효성 검사하다가
오류가 발생하더라도 action의 속성값으로 페이지 이동이 일어나기 때문이다. -->
<input type="button" class="btn btn-primary" value="<fmt:message key="button" />" onclick="checkAddProduct()">
</div>
</div>
</form>
</div>
</fmt:bundle>
</body>
</html>
addProduct.jsp 실행
로그인 창이 자동으로 리다이렉트 됨
로그인 완료
상품등록에 로그아웃 버튼 추가됨
위 과정으로 관리자만 상품등록을 할 수 있게 되었다.
