위로
아래
유효성 검사
유효성 검사(validation 밸리데이션)
- 사용자가 폼 페이지에서 입력한 데이터 값이 서버로 전송되기 전에 규칙에 맞게 입력되었는지 검증하는 것
- 사용자가 실수로 유효하지 않은 데이터를 입력하면 오류가 있음을 알려줌
- 자바스크립트가 적격이다. (웹 브라우저 위에서 유효성 검사를 처리하므로 서버에서 처리하는 것보다 서버 과부하도 없고 속도가 빠르다)
밸리데이션 예시
아이디, 비밀번호 공란 금지 예시
더보기
<!-- 메인 페이지 -->
<%@ page language="java" contentType="text/html; charset=EUC-KR"
pageEncoding="EUC-KR"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="EUC-KR">
<title>Insert title here</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.0/jquery.min.js"></script>
<script type="text/javascript">
function checkform(){
var form = document.loginForm;
if(form.id.value == ""){
alert("아이디를 입력해주세요.");
form.id.focus();
return false;
} else if(form.passwd.value == ""){
alert("비밀번호가 비었습니다.");
form.passwd.focus();
return false;
}
form.submit();
}
</script>
</head>
<body>
<form name="loginForm" method="post" action="Validation02Process.jsp">
<p>아이디 : <input type="text" name="id"></p>
<p>비밀번호 : <input type="password" name="passwd"></p>
<p><input type="button" value="전송" onclick="checkform()"></p>
</form>
</body>
</html><!-- 처리 페이지 -->
<%@ page language="java" contentType="text/html; charset=EUC-KR"
pageEncoding="EUC-KR"%>
<h3>입력에 성공했습니다.</h3>
<%
String user_id = request.getParameter("id");
String user_pw = request.getParameter("passwd");
out.print(user_id);
out.print(user_pw);
%>
<p>아이디 : <%=user_id %></p>
<p>비밀번호 : <%=user_pw %></p>
아이디, 비밀번호 길이 제한 예시
더보기
<!-- 밸리데이션 페이지 -->
<%@ page language="java" contentType="text/html; charset=EUC-KR"
pageEncoding="EUC-KR"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="EUC-KR">
<title>Insert title here</title>
<script type="text/javascript">
function checkform(){
var form = document.loginForm;
if(form.id.value.length<4 || form.id.value.length>12){
alert("아이디는 4글자 이상 12글자 미만으로 쳐주세요!");
form.id.select();
return false;
} else if(form.passwd.value.length<4){
alert("비밀번호는 4글자 이상으로 쳐주세요!")
form.passwd.select();
return false;
}
form.submit();
}
</script>
</head>
<body>
<form name="loginForm" method="post" action="Validation03Process.jsp">
<p>아이디 : <input type="text" name="id" placeholder="4글자 이상 12글자 미만 입력"></p>
<p>비밀번호 : <input type="password" name="passwd" placeholder="4글자 이상 입력 필수"></p>
<p><input type="button" value="전송" onclick="checkform()"></p>
</form>
</body>
</html><!-- 처리 페이지 -->
<%@ page language="java" contentType="text/html; charset=EUC-KR"
pageEncoding="EUC-KR"%>
<%
String user_id = request.getParameter("id");
String user_pw = request.getParameter("passwd");
%>
<p>아이디 : <%=user_id %></p>
<p>비밀번호 : <%=user_pw %></p>
아이디 소문자만, 비밀번호 숫자만 가능 예시
더보기
<!-- 메인 페이지 -->
<%@ page language="java" contentType="text/html; charset=EUC-KR"
pageEncoding="EUC-KR"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="EUC-KR">
<title>Insert title here</title>
<script type="text/javascript">
function checkLogin(){
var form = document.loginForm;
for(i=0;i<form.id.value.length;i++){
var ch = form.id.value.charAt(i);
if((ch<'a'||ch>'z')&&(ch>'A'||ch<'Z')&&(ch>'0'||ch<'9')){
alert("아이디는 소문자 영어만 가능합니다.");
form.id.select();
return false;
}
if(isNaN(form.passwd.value)){
alert("비밀번호는 숫자만 가능합니다.");
form.passwd.select();
return false;
}
}
form.submit();
}
</script>
</head>
<body>
<form name="loginForm" method="post" action="Validation04Process.jsp">
<p>아이디 : <input type="text" name="id" placeholder="4글자 이상 12글자 미만 입력"></p>
<p>비밀번호 : <input type="password" name="passwd" placeholder="4글자 이상 입력 필수"></p>
<p><input type="button" value="전송" onclick="checkLogin()"></p>
</form>
</body>
</html><!-- 처리 페이지 -->
<%@ page language="java" contentType="text/html; charset=EUC-KR"
pageEncoding="EUC-KR"%>
<%
String user_id = request.getParameter("id");
String user_pw = request.getParameter("passwd");
%>
<p>아이디 : <%=user_id %></p>
<p>비밀번호 : <%=user_pw %></p>
에러페이지 설정
JSP 지시어 사용
// 메인 페이지
<%@ page language="java" contentType="text/html; charset=EUC-KR"
pageEncoding="EUC-KR"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="EUC-KR">
<title>Insert title here</title>
</head>
<body>
<form action="ExceptionProcess.jsp" method="post">
<p>숫자 1 : <input type="text" name="num1"></p>
<p>숫자 2 : <input type="text" name="num2"></p>
<p><input type="submit" value="나누기"></p>
</form>
</body>
</html>// 처리 페이지
<%@ page language="java" contentType="text/html; charset=EUC-KR"
pageEncoding="EUC-KR"%>
<%@ page errorPage = "ExceptionError.jsp" %>
<!DOCTYPE html>
<html>
<head>
<meta charset="EUC-KR">
<title>Insert title here</title>
</head>
<body>
<%
String num1 = request.getParameter("num1");
String num2 = request.getParameter("num2");
int a = Integer.parseInt(num1);
int b = Integer.parseInt(num2);
int c = a / b;
out.print(num1 + " / " + num2 + " = " + c);
%>
</body>
</html>// 에러 페이지
<%@ page language="java" contentType="text/html; charset=EUC-KR"
pageEncoding="EUC-KR"%>
<%@ page isErrorPage = "true" %>
<!DOCTYPE html>
<html>
<head>
<meta charset="EUC-KR">
<title>Insert title here</title>
</head>
<body>
<p>오류 발생</p>
<p>exception : <%=exception %></p>
<p>toString() : <%=exception.toString() %></p>
<p>getClass().getName() : <%=exception.getClass().getName() %></p>
<p>getMessage() : <%=exception.getMessage() %></p>
</body>
</html>
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_4_0.xsd" id="WebApp_ID" version="4.0">
<display-name>practice</display-name>
<welcome-file-list>
<welcome-file>index.html</welcome-file>
<welcome-file>index.jsp</welcome-file>
<welcome-file>index.htm</welcome-file>
<welcome-file>default.html</welcome-file>
<welcome-file>default.jsp</welcome-file>
<welcome-file>default.htm</welcome-file>
</welcome-file-list>
<error-page>
<error-code>404</error-code>
<location>/jspEx/Errorcode404.jsp</location>
</error-page>
<error-page>
<error-code>500</error-code>
<location>/jspEx/Errorcode500.jsp</location>
</error-page>
</web-app>// Errorcode404.jsp 페이지
<%@ page language="java" contentType="text/html; charset=EUC-KR"
pageEncoding="EUC-KR"%>
<%@ page isErrorPage ="true" %>
<!DOCTYPE html>
<html>
<head>
<meta charset="EUC-KR">
<title>404</title>
</head>
<body>
페이지 주소가 틀립니다.
</body>
</html>// Errorcode500.jsp
<%@ page language="java" contentType="text/html; charset=EUC-KR"
pageEncoding="EUC-KR"%>
<%@ page isErrorPage="true" %>
<!DOCTYPE html>
<html>
<head>
<meta charset="EUC-KR">
<title>500</title>
</head>
<body>
오류가 발생했습니다.
관리자에게 문의하세요.
<%=exception.getMessage()%>
</body>
</html>
try - catch 문
예시
더보기
<!-- 메인 페이지 TryCatchEx.jsp 파일 -->
<%@ 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>
</head>
<body>
<form action="TryCatchProcess.jsp" method="post">
<p>숫자 1 : <input type="text" name="num1"></p>
<p>숫자 2 : <input type="text" name="num2"></p>
<p><input type="submit" value=""></p>
</form>
</body>
</html><!-- 처리 페이지 TryCatchProcess.jsp 파일 -->
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%
try {
String num1 = request.getParameter("num1");
String num2 = request.getParameter("num2");
int a = Integer.parseInt(num1);
int b = Integer.parseInt(num2);
int c = a / b;
} catch(NumberFormatException e){
RequestDispatcher dispatcher = request.getRequestDispatcher("TryCatchError.jsp");
dispatcher.forward(request, response);
}
%><!-- 에러 페이지 TryCatchError.jsp 파일 -->
<%@ 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>
</head>
<body>
<p>잘못된 데이터가 입력되었습니다.</p>
<p><%= "숫자 1 : " + request.getParameter("num1") %></p>
<p><%= "숫자 2 : " + request.getParameter("num2") %></p>
</body>
</html>