본문 바로가기
JSP

JSP HTML FORM

by 요리하다그만둠 2022. 7. 11.

request 기본 객체의 요청 파라미터 관련 메서드

메서드 리턴 타입 설명
getParameter(String name) String 이름이 name인 파라미터의 값을 구합니다. 존재 하지 않을 경우 null을 리턴합니다.
getParameterValues(String name) String[] 이름이 name인 모든 파라미터의 값을 배열로 구한다. 존재하지 않을 경우 null을 리턴합니다.
getParameterNames() java.util.Map 웹 브라우저가 전송한 파라미터의 이름 목록을 구한다.
getParameterMap() java.util.Map 웹 브라우저가 전송한 파라미터의 맵을 구합니다. 맵은<파라미터 이름, 값> 쌍으로 구성됩니다.

 

jsp 파일 form 태그 사용해 보았습니다.

 

<%@ page contentType = "text/html; charset=utf-8"%>
<html>
<head><title>폼 생성</title></head>
<body>

<form id="form1" name="frm" action="viewParameter.jsp" method="post">

이름-1: <input type="text" id="name1" name="name-1" size="10"> <br>
이름-2: <input type="text" id="name2" name="name-2" size="10"> <br>
이름-3: <input type="text" id="name3" name="name-3" size="10"> <br>
패스워드 : <input type="password" name="pw" size="10" /><br>
주소: <input type="text" name="address" size="30"> <br>
좋아하는 동물:
	<input type="checkbox" name="pet" value="dog">강아지
	<input type="checkbox" name="pet" value="cat">고양이
	<input type="checkbox" name="pet" value="pig">돼지
<br>

<!-- 전송 -->
<input type="submit" value="전송"><br>
<input type="image" src="submit.gif"><br>
<button type="submit">전송2</button><br>
<input type="button" value="전송3" 
 	onclick="document.frm.submit()" /><br>

<%-- https://developer.mozilla.org/en-US/docs/Web/API/HTMLFormElement/submit --%> 	
<%-- HTMLFormElement.submit() --%> 	
<button type="button"
	onclick="document.frm.submit()">전송4</button><br>
<input type="button" value="전송5" 
 	onclick="document.getElementById('form1').submit()" /><br>	
	
<!-- 리셋(전송 취소) -->
<input type="reset" value="취소" /><br>
<button type="reset">취소2</button><br>

<!-- https://developer.mozilla.org/en-US/docs/Web/API/HTMLFormElement/reset -->
<!-- HTMLFormElement.reset() -->
<input type="button" value="취소3"
      onclick="document.frm.reset()" />

</form>
</body>
</html>

HTML 태그에서 각 <input> 태그는 폼의 입력 요소를 생성합니다.

출력해보면 이렇게 나옵니다.

<%@ page contentType="text/html; charset=utf-8" %>
<%@ page import="java.util.Enumeration" %>
<%@ page import="java.util.Map" %>
<%@ page import="java.util.Map,		
                 java.util.Set,
                 java.util.Iterator" %>
<%--@page import="java.util.Set"; --%>
<%--@page import="java.util.Iterator"; --%>
<%--@page import="java.util.*"; --%>
<%
	// 참고) Tomcat 8 이상 버전에서는 JSP에서는 한글 자동 변환 지원 
	// POST 방식(HTTP method)에 "만" 적용
	// GET 방식 등의 나머지 방식에는 적용 (X)
	request.setCharacterEncoding("utf-8");
%>
<html>
<head><title>요청 파라미터 출력</title></head>
<body>
<b>request.getParameter() 메서드 사용</b><br>

name 파라미터 = <%= request.getParameter("name1") %> <br>
name 파라미터 = <%= request.getParameter("name2") %> <br>
pw 파라미터 = <%= request.getParameter("pw") %><br>
address 파라미터 = <%= request.getParameter("address") %>
<p>
<b>request.getParameterValues() 메서드 사용</b><br>
<%
	String[] values = request.getParameterValues("pet");
	if (values != null) {
	for (int i = 0 ; i < values.length ; i++) {
%>
	<%= values[i] %>
<%
		}
	}
%>
<p>
<b>request.getParameterNames() 메서드 사용</b><br>
<%
	Enumeration paramEnum = request.getParameterNames();
	while(paramEnum.hasMoreElements()) {
		String name = (String)paramEnum.nextElement();
%>
		<%= name %>
<%
	}
%>
<p>
<b>request.getParameterMap() 메서드 사용</b><br>
<%
	Map parameterMap = request.getParameterMap();
	String[] nameParam = (String[])parameterMap.get("name");
	if (nameParam != null) {
%>
name = <%= nameParam[0] %>
<%
	}
%>
<hr>
<%
	// 제네릭스(Generics) 적용
	Map<String, String[]> map2 = request.getParameterMap();
	Set<String> set = map2.keySet(); // 인자명의 집합(Set)
	Iterator<String> it = set.iterator();
	
	while(it.hasNext()) {
		
		String key = it.next();
		String[] val = map2.get(key); // map2가 배열이기 떄문에 String[]
		
		out.println("key : " + key + "<br>");		
		
		// 인자 = 값
		// 인자 값이 낱개 / 다수 구별
		if(val.length == 1){  // 낱개
			
			out.println(key + "=" + val[0] + "<br>");
		
		}else { // 다수ex) 체크박스
			
			out.println(key + "=");
			
			for(String s : val) {
				out.println(s +" ");
			}
			out.println("<br>");
		}
		
	
	}
%>
</body>
</html>

jsp 파일

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>action</title>
</head>
<body>
<form>
<% request.setCharacterEncoding("UTF-8"); %>

flag : <%= request.getParameter("flag") %><br>
name : ${param.name} <!-- 표현 언어EL --><br>
pw : ${param.pw}<br>
read : ${param.read}<br>
content : ${param.content}<br>
sentence(EL) : ${param.sentence}<br>
sentence(JSP) : <%= request.getParameter("sentence")%><br>
date : ${param.joindate}<br>
</form>

</body>
</html>

html 파일

<!DOCTYPE html>
<html lang="ko">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <!--novalidate 속성 : 폼 점검(form validation) 무시-->
    <form method="post" action="http://localhost:8181/jsp_20220711_1/action.jsp">
   
        <!--히든 필드 : 레이아웃에서 공간(x)-->
        <input tpye="hidden" name="flag" vlaue=" " />

        <input type="text" name="name" 
        required pattern="[가-힣]{2,31}"
        placeholder="이름 입력"
        title="이름은 한글로 2~31자만 입력하십시오." />
        
        <input type="password" name="pw" required placeholder="패스워드 입력"><br>

        <!--readonly 편집 불가-->
        <input type="text" name="read" readonly value="읽기전용" /> <br>
        
        <!--disabled : 전송 불가-->
        <input type="text" name="content" value="123" disabled /><br>
        <!--문단글-->
        <!--들여쓰기(indentation) 현상
    <textarea name="sentence" cols="10" rows="5" placeholder="기본값"></textarea> -->
            
        <!-- 방지책 : 여백 없이 작성
            CHROME 계열 브라우저  크기 조절
        방지책 : CSS(resize:none)    -->
        <textarea name="sentence" style="resize:none; width: 200px; height: 50px;
        " cols="10" rows="5">기본값</textarea><br>

        <input type="date" name="joindate" /> <br>
        <input type="submit" value="전송" /><br>

    </form>
</body>
<script src="js/app.js"></script>
</html>

<form method="post" action="http://localhost:8181/jsp_20220711_1/action.jsp"> 이 코드를 보면 method에 post라고 적혀있다.

 

GET 방식과 POST 방식을 보겠습니다.

웹 브라우저는 GET방식과 POST 방식의 두 가지 방식 중 한 가지를 이용해서 파라미터를 전송합니다.

위에 코드에 post는 post방식으로 데이터를 전송하겠다는 의미입니다.

당장 현재 블로그 주소를 봐도 post라고 되어있네요

 

GET방식은 위와 같이 URL의 경로 뒤에 물음표('?')와 함께 파라미터를 붙여 전송하는데, 이를 쿼리 문자열(query string)이라고 합니다. 쿼리 문자열의 형식은

이름1=값1&이름2=값2&.&이름n=값n

각각의 파라미터는 앰퍼샌드(&) 기호로 구분하고 파라미터의 이름과 값은 등호 기호(=)로 구분합니다.\

 

get이거나 method=""가 없을 때

post방식일 때 

차이가 느껴지시나요?  get 방식과는 다르게 데이터가 외부적으로 드러나지 않습니다. 

그래서 보안에 필요한 부분에서 많이 사용됩니다.

 

서버 페이지 연결 같은 일을 할 때에는 get을 사용하면 경로를 나타내 줄 테니 좋고

아이디나 패스워드 등 민감한 정보를 사용하는 로그인 페이지에는 post방식이 좋지 않을까 생각합니다.

 

  

'JSP' 카테고리의 다른 글

JSP 쿠키  (0) 2022.07.13
JSP 예외처리  (0) 2022.07.13
JSP request  (0) 2022.07.11
JSP 시작 웹 프로그래밍  (0) 2022.07.08
JSP 플러그인  (0) 2022.07.07

관련글

티스토리툴바