프로그래밍

[Web] day38 : 데이터 전송(foward / sendRedirect) 본문

Web/Web

[Web] day38 : 데이터 전송(foward / sendRedirect)

시케 2023. 7. 31. 08:33
728x90
반응형

2023.06.28.수

데이터 전송

이제 본격적으로 페이지 이동과 함께 데이터 전송을 하여 구조적인 웹 페이지를 구성하기 시작할 것이다

 

데이터 전송

<form> 태그를 활용하여 데이터를 전송한다

"test04.jsp" 페이지로 전송하며 선택상자와 체크박스를 활용하여 값을 선택하게끔 하였다

각각 값의 이름은 "box"와 "fav"로 전송된다

"submit" 버튼을 누를시 데이터가 전송된다

<%@ 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 = "test04.jsp" method="post">
		선택상자	<select name = "box">
					<option value = "apple">사과</option>
					<option value = "banana">바나나</option>
					<option value = "kiwi">키위</option>
				</select>
		<br>
		체크박스	<input type="checkbox" name="fav" value="movie"> 영화
				<input type="checkbox" name="fav" value="drama"> 드라마
				<input type="checkbox" name="fav" value="animation"> 애니메이션
		<br>
		<input type="submit" value="데이터 전송">
	
	</form>

</body>
</html>

 

데이터 전송 받기

위에서 전송한 데이터를 받아 활용할 것이다

선택상자 "box" 데이터는 파라미터 값으로 전송받아 출력하며

체크박스 "fav" 데이터는 <li>

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

	선택상자 <%= request.getParameter("box") %> <br>
	체크박스
	<ul>
	<%
		String[] datas = request.getParameterValues("fav");
		for(int i = 0; i<datas.length; i++) {
			out.println("<li>"+datas[i]+"</li>");
		}
	%>
	</ul>

</body>
</html>

 

foward 방식과 sendRedirect 방식

데이터 전송 방식에 2가지 방식이 있다

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>시작페이지</title>
</head>
<body>

<form action ="test06.jsp" method="post">
	forward 액션으로 데이터를 전송하기 <br>
	<input type="text" name = "msg">
	<input type="submit" value="전송">
</form>

<hr>

<form action ="test07.jsp" method="post">
	response.sendRedirect <br>
	<input type="text" name = "msg">
	<input type="submit" value="전송">

</form>

</body>
</html>

 

foward 방식

forward 액션 태그를 활용하면
처음에 요청했던(전송했던) 데이터들이 유지된다
즉, URL이 변경되지 않는다
별도의 새 요청이 된것이 아니라, 새로운 요청(추가된 요청)이 처리된 것처럼 동작한다

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>

	<jsp:forward page="test08.jsp">
		<jsp:param value="12345" name="test"/>
	</jsp:forward>

 

sendRedirect 방식

forward 액션과 달리

처음에 요청한 데이터가 유지되지 않는다
URL 또한 변경되며 새로운 요청처럼 처리된다

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%
	response.sendRedirect("test08.jsp");
%>

결과페이지

forward 액션은 값이 유지되어 출력되지만 sendRedirect 방식은 그렇지 않다

 

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>결과 페이지</title>
</head>
<body>

<h1>msg: <%= request.getParameter("msg") %></h1>
<h1>test: <%= request.getParameter("test") %></h1>

</body>
</html>
728x90
반응형

'Web > Web' 카테고리의 다른 글

[Web] day39 : 어플리케이션(application)+내장객체 out  (0) 2023.08.01
[Web] day38 : 세션(+세션 활용 예제 쇼핑몰)  (0) 2023.07.31
[Web] day38 : 에러페이지  (0) 2023.07.31
[Web] day37 : JSP  (0) 2023.07.05
[Web] day37 : ajax() 메서드와 JSON 데이터  (0) 2023.07.05
'Web/Web' Related Articles more
Comments