[JSP] 008. JSP 액션 태그(Action Tag)

JSP 액션 태그(Action Tag) 개요
- WebApp16

■■■ JSP 액션 태그(Action Tag) ■■■
○ 개요
 JSP 액션 태그는 클라이언트 혹은 서버에게
 어떤 동작을 수행하도록 명령을 내리느 태그로
 JSP 페이지 안에서 자바 빈즈를 사용할 수 있도록 하는 액션태그와
 페이지를 활용할 수 있도록 하는 액션 태그로 나눌 수 있다.

 - JSP 빈과 관련된 액션 태그
   <jsp:useBean>, <jsp:setProperty>, <jsp:getProperty> 등

 - JSP 페이지 모듈과 요청 흐름 처리를 위한 액션 태그
   <jsp:include>, <jsp:forward>, <jsp:param> 등
-------------------------------------------------------------------------------------------
○ 형식 및 구조
 『<jsp:액션태그 속성="값">태그에 들어있는 내용</jsp:액션태그>』
 『<jsp:액션태그 속성="값"/>』 ← 태그에 들어있는 내용이 없을 경우
-------------------------------------------------------------------------------------------
※ 스코프
 JSP 액션태그를 통해 생성된 객체는
 그 객체가 사용될 수 있는 스코프 혹은 라이프사이클(LifeCycle : 생명주기)
 속성을 갖는데, 이것은 생성된 객체의 레퍼런스가 어디에서 사용될 수 있고,
 언제 삭제될 것인지를 기술한다.

 - page
   생성된 객체는 단일 클라이언트의 요청에 의해 생성된 페이지 내에서
   접근하여 사용될 수 있다.
   생성된 객체는 실질적으로는 pageContext 에 저장된다.

 - request
   생성된 객체는 단일 클라이언트의 요청이 처리되는 동안에
   접근하여 사용될 수 있다.
   request 가 page 와 다른 점은 request 에서는 forward 나 include 를
   객체에 접근하여 사용할 수 있다.
   생성되냐 객체는 실질적으로 HttpSrevletRequest 에 저장된다.

 - session
   생성된 객체는 사용자의 세션이 유지되는 어느 곳에서나
   접근하여 사용될 수 있다.
   생성된 객체는 실질적으로 HttpSession 에 저장된다

 - application 
   생성된 객체는 웹 응용프로그램의 라이프사이클 동안에
   웹 응용프로그램에 소속된 임의의 Servlet 과 JSP 에서
   접근하여 사용될 수 있다.
   생성된 객체는 실질적으로 ServletContext 에 저장된다.
-------------------------------------------------------------------------------------------
○ <jsp:param>
 <jsp:param> 태그는 요청한 페이지로 정보를 전달할 때 사용하는 태그로
 현재 페이지에서 요청한 페이지로 인자(parameter)와 인자값(value) 형태로 넘겨준다.

 <jsp:param name="paramName" value="var" />

 ※ 이 태그는 단독으로 사용하지 못하고
    <jsp:include> 나 <jsp:forward> 태그의 내부에 기술하여 사용한다.

 - name 속성
   포함되는 JSP 페이지에 전달할 파라미터의 이름을 표시.

 - value 속성
   전달할 파라미터 값을 표시.
   이 때, value 속성 값으로 표현식을 사용하는 것도 가능하다.
-------------------------------------------------------------------------------------------
○ <jsp:forward>
 <jsp:forward> 태그는 현재 머물고 있는 JSP 페이지에서
 URL 로 지정한 특정 페이지로 넘어갈 때 사용하는 태그로
 현재 페이지에서 조건에 따라 서로 다른 페이지를 호출할 경우 사용된다.
 이 태그의 특이한 점은 현재 페이지에 대한 URL 만 나타날 뿐
 제어가 넘어간 특정 페이지의 URL 이 전혀 나타나지 않는다는 점이다. 
 클라이언트의 웹 브라우저 주소란에 보이는 URL 과
 실제 브라우저에서 읽어들이고 있는 문서가 서로 다르기 때문에
 사용자는 이러한 상황이 벌어지고 있는지를 감지할 수 없다.
 그리고 제어가 넘어갈 때 request 내부 객체도 같이 전달된다

 <jsp:forward page="이동할페이지이름" />

 - page 속성
   이동할 페이지의 이름을 기술하며
   page 속성의 값인 이동할 페이지의 이름은
   웹 어플리케이션 상태 경로나, 웹 어플리케이션 절대 경로로 지정할 수 있고,
   표현식을 사용할 수도 있다.

 - <jsp:forward> 액션 태그에서
   <jsp:param> 태그로 프로그램의 제어가 이동할 페이지에
   파라미터 값을 전달할 수 있으며
   전달 받은 값은 『request.getParameter("파라미터 이름")』으로 넘겨받는다.

   <jsp:forward page="이동할페이지이름">
     <jsp:param name="paramName1" value="var1" />
     <jsp:param name="paramName2" value="var2" />
   <jsp:forward>

 - 단순히 page 속성에 지정된 페이지로 이동하는데 그치는 것이 아니라
   이동할 페이지에 자신의 정보를 파라미터 형식으로 전달할 수 있는 것이다.

   <jsp:forward page="/View.jsp" />
   <%
   
   %>
   <jsp:forward page="<%=url %>" />
-------------------------------------------------------------------------------------------
○ <jsp:include>
 <jsp:include> 태그는 웹 페이지에서 공통된 페이지를 모듈화하여
 레이아웃을 구성(작성)할 수 있도록 지원하는 태그이다.
 include 디렉티브(<%@ include%>)와 함께
 다른 페이지를 현재 페이지에 포함시킬 수 있는 기능을 가진 태그이다.
 단, include 디렉티브는 단순하게 소스의 내용이 텍스트로 포함되지만
 <jsp:include> 액션 태그는 포함시킬 페이지의 처리 결과를
 포함시킨다는 점에서 차이를 갖는다.
 포함되는 페이지는 html, jsp, Servlet 페이지 모두 가능하며
 include 디렉티브는 주로 조각 코드를 삽입할 때 사용되고
 <jsp:include> 액션 태그는 페이지를 모듈화할 때 사용된다.
 즉, 템플릿 페이지를 작성할 때 주로 사용된다는 것이다.
 또한, <jsp:include> 액션 태그는 같은 request 기본 객체를 공유한다.

 <jsp: include page="url" flush="flase" />

 - page 속성
   현재 페이지에 결과가 포함될 대상 페이지의 이름

 - flush 속성
   출력 버퍼의 플러시 유무
   포함될 페이지로 이동할 때 현재 페이지가 지금까지
   출력 버퍼에 저장한 결과를 어떻게 처리할 것인지를 결정한다.
   flush 속성의 값은 false 로 설정하는 것이 일반적이다.
   flush 속성의 값을 true 로 지정할 경우
   일단 출력 버퍼의 내용을 웹 브라우저로 전송하게 되는데
   이 때, 헤더 정보도 함께 전송된다.
   헤더 정보가 일단 웹 브라우저로 전송되고 나면
   이후 헤더 정보를 추가하더라도 결과가 반영되지 않는다.

   <jsp:include page="url" flush="false">
     <jsp:param name="paramName1" value="var1" />
     <jsp:param name="paramName2" value="var2" />
   </jsp:include>
-------------------------------------------------------------------------------------------
※ 자바 빈즈(Java Beans)
 JSP 페이지에 화면 출력 부분과 로직들이 섞여있는 형태로 작성할 경우
 JSP 페이지를 이해하기 어렵고 디자이너와 협업도 어려워진다.
 또한, JSP 페이지에 화면 출력 부분과 로직들이 혼재한 형태의 코드는
 재사용을 하는 것도 어려워지게 된다.
 JSP 에서는 자바로 작성한 자바 클래스 중에
 자바 빈즈 규약에 맞게 작성된 클래스를 JSP 에서 사용 가능하게 하였으며, 
 이를 통해 프리젠테이션(웹 디자이너 측) 부분과
 비즈니스 로직(개발자 측)을 처리하는 부분을 분리하여 작성할 수 있다.
 이렇게 함으로써 웹의 내용으로부터 웹의 표현 부분을 분리하게 되고
 동적인 웹 페이지 제작을 위한 개발과 관리에 있어 명확한 분리가 가능하다.
 또한, 동일한 기능이 페이지 구성이 달라서 반복적으로 사용되는 경우
 웹 페이지를 효율적으로 작성, 수정하려면 반복적으로 사용되는 코드를
 재사용할 수 있어야 한다.
 빈은 이와 같은 효율적인 코딩 작업을 가능하게 한다.

/*
  디자인 패턴 
  : 특정기능을 가진 프로그램을 만들 떄 여러 계층이 필요함
  즉, 수학에서 사용하는 공식과 같은 것이라고 이해 (논리 -> 수식 적용하면 해결할수 있어(공식))
  이런 기능 만들 때 이렇게 계층구조를 만들면 쉽게 설계할 수 있어!
  ex)  싱글톤 -> 리소스 소모가 많이들때 / 한번 만들어진 것을 키처럼 사용하고 돌려쓰고 하는용도로 만든 것
*/

 현재 개발되었거나 개발중인(작업중인) 프로그램들은 모두
 MVC 기법에 의해 개발되고 있다.
 MVC 기법은 프로그램을 모델(Model), 뷰(View), 컨트롤러(Controller)로
 나누어 개발을 하는데...
 Model 은 로직을 가지고 있는 부분으로 DB와 연동하는 파트이고
 View 는 사용자에게 제공하는 화면으로 UI(User Interface)에 해당하며, 
 Controller 는 View 와 Model 사이에서 흐름을 제어하는 개념이다.
 
 /*
 ★MVC 라는 디자인 패턴은?★ 모델 2 방식 ★★★★★★★졸라중요함★★★★★★★
  방식이 모델 1과 모델 2가 있는데 MVC 는 모델 2 방식중의 한 디자인 패턴인 것
  세 가지(M - V - C) 계층구조로 만드는게 바람직하다는 것
  모델하고 뷰는 필수적인데 얘네 둘은 생명주기가 약해서 
  격리가 안되어있으면 (결합도가 높으면) 나중에 활용하기가 어려워짐
  그래서 사이에 끼워넣고 결합도를 낮추는 역할을 하는게 C
  
  뷰 : 클라이언트 꼭 만나야함
  모델 : DB 연동해줘야 해서 꼭 필요
  --> 없어도 되지만 MVC 패턴에서는 C 가 주인공~~~

  이제 로직(스크립릿만 작성한 부분)은 (jsp파일로 굳이 안하고)서블릿이 다 될것임!

 빈에 속성값 지정 setProperty , 얻어쓰기 getProperty 를 사용
 */

 JSP 페이지가 MVC 에서 View 에 해당하고
 바로 이 View 를 모듈화 하는 것이 템플릿 페이지이며, 
 자바 빈즈는 Model 에 해당한다고 볼 수 있다.
-------------------------------------------------------------------------------------------
○ <jsp:useBean>
 <jsp:useBean> 액션 태그는
 자바 객체를 생성하거나 기존에 만들어져 있는 객체를 반환한다.

 <jsp:useBean id="name" scope="page|request|session|application" typeSpec />

 - id 속성
   객체 인스턴스를 식별하는 이름으로 대소문자를 엄격하게 구별한다.
   한 번 생성된 Bean 이 소멸할 때 까지는 같은 id 를 중복해서 사용할 수 없다.

 - scope 속성
   객체 참조 범위로 기본값(default)은 page 이다.
  ·page
    객체 참조는 service() 호출이 종료될 때 소멸.
  ·request
    HttpServletRequest 객체가 소멸되지 않는 한 존재하며, 
    컨테이너에 의해 생성된 서블릿은 
    HttpServletReauest 의 setAttribute() 메소드를 이용하여
    객체를 HttpServletRequest 에 바인딩 시킨다.
  ·session
    객체는 클라이언트의 요청과 구별되며,
    session 이 살아있는 동안에 존재하며,
    컨테이너에 의해 생성된 서블릿은
    HttpSession 의 putValues(String key, Object value)메소드를 이용하여
    객체를 HttpSession 에 바인딩 시킨다.
  ·application
    가장 수명(생명주기)이 길다.
    ServletContext 의 setAttribute() 를 통해
    객체를 ServletContext 에 바인딩 시킨다. 

 - typeSpec 속성
   class="class_name" |
   class="class_name" type="type_name" |
   type="type_name" class="class_name" |
   beanName="bean_name" type="type_name" |
   type="type_name" beanName="bean_name" |
   type="type_name"

  ·class
    완전한 형태의 클래스 이름으로
    beanName 이 정의되어 있지 않은 상황이라면 반드시 정의해야한다.
  ·beanName
    java.beans.Beans 클래스의 instaniate() 메소드에 사용할 bean 이름으로
    type 과 beanName 을 지정한 경우에는 class 를 생햑할 수 있다.
    주로 class 인자를 쓰지 않을 경우 사용한다.
    내부적으로 컨테이너는 id 와 scope를 이용해서 객체를 찾는다
    이 과정에서 만약 찾지 못할 경우 현재 클래스 로더로 instantiate()
    메소드를 호출하는데, 이 때 bean 의 이름을 인자로 전달한다.
    이 인스턴스의 생성이 실패하게 되면 예외가 발생한다.
  ·type
    클래스의 형(type)을 지정하는, 생략 가능한 특성이다.
    객체가 이 특성으로 지정된 형(type)이 아닐 경우
    ClassCastException 예외가 발생하게 된다.

 <jsp:useBean id="name" scope="page" typeSpec>
    <jsp:setProperty name="bean_name" prop_expr />
    <%
       // 스크립 릿을 이용하여 다른 속성 값을 호출하는 기능을 가진
       // 함수를 호출할 수 도 있다.
    %> 
 </jsp:useBean>
-------------------------------------------------------------------------------------------
○ <jsp:setProperty>
 <jsp:setProperty> 액션 태그는 자바 빈에 속성 값을 할당한다.
 name 속성에 기술된 이름에 해당하는 bean 클래스는 
 <jsp:useBean> 액션 태그를 이용해서 이 액션이 나타나기 전에 미리 정의되어야 한다.

 <jsp:setProperty name="bean_name" prop_expr/>

 - name 속성
   <jsp:useBean> 액션태그에 의해 정의된 bean 인스턴스 이름
 
 - prop_expr
   property="*" |
   property="property_name" |
   property="property_name" param="parameter_name" |
   property="property_name" value="parameter_value" 

  ·property
    값을 설정하고자 하는 bean 속성의 이름으로
    『"*"』으로 설정하면 ServletRequest 안의 모든 인자들 중
    bean 속성과 데이터 타입이 일치하는 것을 찾아서
    각각의 속성들을 각각의 인자들의 값으로 설정한다.
    값이 『""』인 경우 속성은 변하지 않는다.
  ·param
    bean 속성에 설정하고자 하는 값을
    파라미터에서 지정하고자 할 경우 사용한다.
  ·value
    bean 속성에 설정할 값을 지정하며
    하나의 <jsp:setProperty> 액션 태그가 param 과 value 를 동시에 가질 수 없다.
-------------------------------------------------------------------------------------------
○ <jsp:getProperty>
 <jsp:getProperty> 액션 태그는 bean 의 속성 값을 얻는데 사용한다.
 bean 의 속성 값을 얻어 String 으로 변환한 다음 출력 스트림으로 내보낸다.

 <jsp:getProperty name="name" property="property_name">

 - name 속성
   속성을 얻고자 하는 bean 의 인스턴스 이름

 - property 속성
   얻고자 하는 속성의 이름

여태 만든 페이지를 스크립트릿을 body 에서 넣어서 구성한 경우
  작성한 사람이 아닌 다른 사람이 확인 했을 때 

  ★ 가독성이 떨어짐 = (보통은 개발 따로 디자인따로 진행하는데) 디자인파트와의 협업이 힘들다

  또한 이것을 태그로 만들어두면 편하지 않을 까 해서 만들게 된 것이
  액션태그 와 사용자가 직접 만들어서 사용하게 하는 사용자태그 가 있다.

  태그들의 패턴들이 확인 되면 -> jstl (standard 표준라이브러리에 묶어서 배포) (미리 만들어서 배포해주는게 편하겠다~)

  로직을 섞어쓰기 보다는 태그로 확인해서 처리한다면 
  가독성도 높아지고 이후 유지보수에도 쉽고 재활용에도 유리하고 파트를 나누어서 협업이 가능하게 된다.

 이 때문에 사용을하게 되고 배우는 이유!

---

• Calc.java & Calc.jsp 
  - 첫 번 째 방법 : Calc_ok1.jsp
  - 두 번 째 방법 : Calc_ok2.jsp
  - 세 번 째 방법 : Calc_ok3.jsp  // 사용시 주의 사항

• Calc.java

/*==============
	Calc.java
===============*/

package com.test;

public class Calc
{
	// 주요 속성 구성
	private int su1;		//-- 피연산자1 (정수 형태)
	private String op;		//-- 연산자 (문자열 형태)
	private int su2;		//-- 피연산자2 (정수 형태)
	
	// 생성자 정의하지 않음(즉, 사용자 정의 생성자 없음)
	// → default 생성자 자동 삽입
	
	// getter / setter 구성
	public int getSu1()
	{
		return su1;
	}
	public void setSu1(int su1)
	{
		this.su1 = su1;
	}
	public String getOp()
	{
		return op;
	}
	public void setOp(String op)
	{
		this.op = op;
	}
	public int getSu2()
	{
		return su2;
	}
	public void setSu2(int su2)
	{
		this.su2 = su2;
	}

	// 메소드 추가
	public String result()
	{
		String result = "";
		
		int s=0;
		if (op != null)
		{
			if (op.equals("+"))
				s = su1 + su2;
			else if (op.equals("-"))
				s = su1 - su2;
			else if (op.equals("*"))
				s = su1 * su2;
			else if (op.equals("/"))
				s = su1 / su2;		// 정수 기반으로 처리 (몫을 구하도록)
			
			result = String.format("%d %s %d = %d", su1, op, su2, s);
		}
		
		return result;
	}
	
}

---

• Calc.jsp

<%@ page contentType="text/html; charset=UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Calc.jsp</title>
<link rel="stylesheet" type="text/css" href="css/main.css">
</head>
<body>

<div>
	<h1>JSP 액션 태그 실습</h1>
	<hr />
</div>

<div>
	<!-- ① 첫 번 째 방법 -->
	<!-- <form action="Calc_ok1.jsp" method="post" name="myForm"> -->
	
	<!-- ② 두 번 째 방법 -->
	<!-- <form action="Calc_ok2.jsp" method="post" name="myForm"> -->
	
	<!-- ③ 세 번 째 방법 -->
	<form action="Calc_ok3.jsp" method="post" name="myForm">
		<table class="table">
			<tr>
				<th>첫 번째 정수</th>
				<td>
					<input type="text" name="su1" class="txt"/>
				</td>
			</tr>
			<tr>
				<th>연산자</th>
				<td>
					<select name="op" >
						<option value="+">더하기</option>
						<option value="-">빼기</option>
						<option value="*">곱하기</option>
						<option value="/">나누기</option>
					</select>
				</td>
			</tr>
			<tr>
				<th>두 번째 정수</th>
				<td>
					<input type="text" name="su2" class="txt"/>
				</td>
			</tr>
			<tr>
				<td colspan="2">
					<button type="submit" class="btn" style="width: 100%;"> = </button>
				</td>
			</tr>
		</table>
	</form>
</div>
</body>
</html>

---

• Calc_ok1.jsp

<%@page import="com.test.Calc"%>
<%@ page contentType="text/html; charset=UTF-8"%>
<%
	// 이전 페이지(Calc.jps)로부터 데이터 수신
	// → su1, su2, op
	String strSu1 = request.getParameter("su1");
	String strSu2 = request.getParameter("su2");
	String op = request.getParameter("op");
	
	int su1, su2;
	su1 = su2 = 0;
	String str = "";
	
	if(strSu1==null || strSu2==null)
	{
		response.sendRedirect("Calc.jsp");
	}
	else
	{
		su1 = Integer.parseInt(strSu1);
		su2 = Integer.parseInt(strSu2);
		
		// 자바에서 설계한 클래스를 사용하기 위해 객체 생성
		Calc ob = new Calc();
		//-- 이클립스 자동완성 기능을 사용하여 구문을 작성할 경우
		//   『@page import="com.test.Calc"』이 구문도 함께 생성되어 처리됨.
		//   혹은, 자동완성 기능을 사용하지 않을 경우도
		//   『@page import="com.test.Calc"』 이와 같은 구문을 직접 작성해서 
		//   해당 클래스를 사용할 수 있도록 처리해주어야 한다.
		//   또는, 생성 구문에 직접 『"com.test.Calc ob = new com.test.Clac();』
		//   와 같이 작성하는 것도 가능하다.
		
		ob.setSu1(su1);
		ob.setSu2(su2);
		ob.setOp(op);
		
		str = ob.result();
	}
%>

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Calc_ok1.jsp</title>
<link rel="stylesheet" type="text/css" href="css/main.css">
</head>
<body>

<div>
	<h1>첫 번째 방법 처리 결과</h1>
	<hr />
</div>

<div>
	<!-- 결과 -->
	<h2><%=str %></h2>
</div>

</body>
</html>

---

• Calc_ok2.jsp
  - jsp 문법 적용되어 있는 코드가 있다면 --> jsp 주석으로 처리해야 함

<%@page import="com.test.Calc"%>
<%@ page contentType="text/html; charset=UTF-8"%>
<%
	/* -- 첫 번째 방법
	String strSu1 = request.getParameter("su1");
	String strSu2 = request.getParameter("su2");
	String op = request.getParameter("op");
	
	int su1, su2;
	su1 = su2 = 0;
	String str = "";
	
	if(strSu1==null || strSu2==null)
		response.sendRedirect("Calc.jsp");
	else
	{
		su1 = Integer.parseInt(strSu1);
		su2 = Integer.parseInt(strSu2);

		Calc ob = new Calc();

		ob.setSu1(su1);
		ob.setSu2(su2);
		ob.setOp(op);
		
		str = ob.result();
	}
	*/
%>
<%-- 
<%
	// check 이전까지를 확인하기 위한 스크립릿 영역
	String strSu1 = request.getParameter("su1");
	int su1 = Integer.parseInt(strSu1);
%>
 --%>
<!-- Calc 클래스의 객체를 현재 페이지에서 사용할 수 있도록 지정 -->
<jsp:useBean id="ob" class="com.test.Calc"></jsp:useBean>
<!--
	 위의 구문은 스크립 릿 영역에서 
	『com.test.Calc ob = new com.test.Calc();』을 작성하여
	 import 구문을 자동으로 처리한 것과 마찬가지 효과를 적용하게 된다.
-->

<!-- 
request.getParameter() 메소드를 통해 넘겨(전달)받은 데이터를
『Calc』 클래스를 기반으로 생성된 『ob』 객체에 넘겨주기 위한 속성 지정
-->

<%-- <jsp:setProperty property="su1" name="ob" value="<%=strSu1 %>"/> --%>
<!--
	property 는 Calc.java 의 프로퍼티 이름을 의미한다. 
	property 에 프로퍼티 이름을 넘기면 서블릿컨테이너가 알아서 메소드를 찾아서 호출
	name 은 ob 객체를 의미 
	이 구문은 Calc_ok1.jsp 의 『ob.setSu1(12);』과 같은 구문
	                                      -- 이 안에 넘길 값은 value 로 지정
-->

<%-- <jsp:setProperty property="su1" name="ob" value="<%=Integer.parseInt(strSu1) %>"/> --%>
<!-- 이 구문은 Calc_ok1.jsp 의 『ob.setSu1(strSu1);』과 같은 구문 -->

<%-- <jsp:setProperty property="su1" name="ob" value="<%=su1 %>"/> --%>
<!-- 이 구문은 Calc_ok1.jsp 의 『ob.setSu1(su1);』과 같은 구문 -->

<!-- check -->
<!-- 
	※ 속성의 이름과 동일한 파라미터인 경우
	『getParameter()』 메소드 없이 바로 받을 수 있다.
-->

<jsp:setProperty property="su1" name="ob"/>
<!-- 
	① request.getParameter() 처리 → 매개변수를 전달하기 위해 이전페이지로부터 데이터 수신 처리
	② Integer.parseInt() 처리 → 매개변수를 전달하기 위한 형 변환 처리
	③ ob.su1 속성에 대해 ob.setSu1() 메소드 호출 처리
	==> 최종적으로 ob → Calc 기반의 ob 객체의 su1 속성에
	    이전페이지로부터 넘겨받은 데이터를 적절한 타입(형)으로 변환하여 전달
 -->
 
 <jsp:setProperty property="su2" name="ob"/>
 <jsp:setProperty property="op" name="ob"/>
 
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Calc_ok2.jsp</title>
<link rel="stylesheet" type="text/css" href="css/main.css">
</head>
<body>

<div>
	<h1>두 번째 방법 처리 결과</h1>
	<hr />
</div>

<div>
	<!-- 결과 -->
	<h2><%=ob.result() %></h2>
</div>

</body>
</html>

---

• Calc_ok3.jsp
  - ※ 공통 주의점 포함

<%@page import="com.test.Calc"%>
<%@ page contentType="text/html; charset=UTF-8"%>
<%-- 
// 두번째 방법
<jsp:useBean id="ob" class="com.test.Calc"></jsp:useBean>
<jsp:setProperty property="su1" name="ob"/>
<jsp:setProperty property="su2" name="ob"/>
<jsp:setProperty property="op" name="ob"/>
--%>

<jsp:useBean id="ob" class="com.test.Calc"></jsp:useBean>
<jsp:setProperty property="*" name="ob"/>
<!-- 
	setProperty의 수가 많으면 많을 수록 *(모든 프로퍼티 셋팅)으로 하면 효율적 코드 구성이 가능
	
	※ 단, 주의할 점
	
	1. 이름에 정확하게 대응하는 getter / setter 가 구성되어있어야 함 -- 맵핑 가능
	2. ok2.jsp 로 했을 경우 value 값이 없을 때 value 지정이 가능한 것은 
	   -> Calc.jsp 에서 넘겨주는 값의 name속성이 *정확히 일치*하기 때문
	      Calc.java 의 프로퍼티 su1, su2, op
	      Calc.jsp의 name 속성 su1, su2, op
	3. 명명법 : 가급적이면 bList 와 같이 줄이지 말고 bookList 처럼 지어야 함
	   -> getBList() 이런식으로 구성되게 되면 에러 발생 가능 경우 높아짐
	      (적어도 앞에서 두번째 글자까지 소문자로 구성하는 것이 좋다.)
 -->
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Calc_ok3.jsp</title>
<link rel="stylesheet" type="text/css" href="css/main.css">
</head>
<body>

<div>
	<h1>세 번째 방법 처리 결과</h1>
	<hr />
</div>

<div>
	<!-- 결과 -->
	<h2><%=ob.result() %></h2>
</div>

</body>
</html>

---

WebApp17
- WebApp17_1 (내 풀이)(접은글)

refactor 을 이용하여 이름 변경

바꿀 이름 지정 후 ok 하면 DynamicWebProject 이름이 변경된다

• GuestDTO.java & Guest.jsp & Guest_ok.jsp

/*==================
	GuestDTO.java
 ================== */

package com.test;

public class GuestDTO
{

	// 주요 속성 구성
	// 이러한 방식으로 프로퍼티를 구성하면 비효율적 -- 이름, 값 다 지정 해줘야함
	//String name;			//-- 작성자 
	//String title; 		//-- 게시물 제목
	//String str; 			//-- 게시물 내용
	
	private String userName;	//-- 작성자
	private String subject;		//-- 게시물 제목
	private String content;		//-- 게시물 내용
	
	// ※ 여기서 사용하는 변수명(속성명)의 앞 두글자는 소문자로 작성할 것
	//    단, 이 내용은 문법적인 제한 사항은 아니고 실무적인 권장사항
	//    ex) numScore → getNumScore() / setNumScore()
	//        nScore   → getNScore() / setNScore()
	//                 → getnScore() / setnScore()
	//    와 같이 getter 나 setter 가 속성명을 불러오는 과정에서
	//    인식이 어긋나거나 하는 경우가 발생할 수 있기 때문에...
	
	// ※ 여기서 사용하는 변수명(속성명)은
	//    HTML Document 의 form 태그에서 name 속성으로 지정하여 사용할 것.
	//    단, 이 내용 또한 문법적인 제한 사항은 아니지만
	//    그렇게 사용해야 속성 데이터 수신 및 속성 매핑을
	//    액션 태그를 활용하여 자동으로 처리해줄 수 있기 때문에
	
	// getter / setter 구성
	public String getUserName()
	{
		return userName;
	}

	public void setUserName(String userName)
	{
		this.userName = userName;
	}

	public String getSubject()
	{
		return subject;
	}

	public void setSubject(String subject)
	{
		this.subject = subject;
	}

	public String getContent()
	{
		return content;
	}

	public void setContent(String content)
	{
		this.content = content;
	}
	
}

/*==================
	GuestDTO.java
 ================== */

package com.test;

public class GuestDTO
{
	private String name;
	private String title;
	private String content;
	
	public String getName()
	{
		return name;
	}
	public void setName(String name)
	{
		this.name = name;
	}
	public String getTitle()
	{
		return title;
	}
	public void setTitle(String title)
	{
		this.title = title;
	}
	public String getContent()
	{
		return content;
	}
	public void setContent(String content)
	{
		this.content = content;
	}

	public String result()
	{
		String result = "";
		
		content = content.replaceAll("\n", "<br>");
		
		result += "<table class='table'>";
		result += "<tr>";
		result += "<th>작성자</th><td>"+ name + "</td>";
		result += "</tr>";
		result += "<tr>";
		result += "<th>제목</th><td>"+ title + "</td>";
		result += "</tr>";
		result += "<tr>";
		result += "<th colspan='2'>내용</th>";
		result += "</tr>";
		result += "<tr>";
		result += "<td colspan='2'>"+ content + "</td>";
		result += "</tr>";
		result += "</table>";
		
		return result;
	}
}

---

<%@ page contentType="text/html; charset=UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Guest.jsp</title>
<link rel="stylesheet" type="text/css" href="css/main.css">

<script type="text/javascript">
	function sendIt()
	{
		var f = document.myForm;
		
		// :
		// 체크 및 검증할 사항 
		// :
		
		f.submit();
	}
</script>

</head>
<body>

<div>
	<h1>간단한 기본 방명록 작성 실습</h1>
	<hr>
</div>
<div>
	<h2>방명록 작성란</h2>
</div>
<br>
<div>
	<form action="Guest_ok.jsp" method="post" name="myForm">
		<table class="table">
			<tr>
				<th>이름</th>
				<td>
					<input type="text" class="txt" name="userName">
				</td>
			</tr>
			<tr>
				<th>제목</th>
				<td>
					<input type="text" class="txt" name="subject">
				</td>
			</tr>
			<tr>
				<th>내용</th>
				<td>
					<textarea cols="32" rows="5" name="content"></textarea>
				</td>
			</tr>
			<tr>
				<td colspan="2">
					<button type="button" onclick="sendIt()" class="btn"
					style="width: 50%;">방명록 작성</button>
				</td>
			</tr>
		</table>
	</form>
</div>



</body>
</html>

<%@ page contentType="text/html; charset=UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Guest.jsp</title>
<link rel="stylesheet" type="text/css" href="css/main.css">

<script type="text/javascript">
	function sendIt()
	{
		var f = document.myForm;
		
		if (!f.name.value)
		{
			alert("이름을 입력하세요");
			f.name.focus();
			return
		}
		
		if (!f.title.value)
		{
			alert("제목을 입력하세요");
			f.title.focus();
			return
		}
		
		if (f.content.value=="")
		{
			alert("내용을 입력하세요");
			f.context.focus();
			return
		}
		
		f.submit();
	}
</script>

</head>
<body>

<div>
	<h1>간단한 기본 방명록 작성 실습</h1>
	<hr>
</div>
<div>
	<h2>방명록 작성란</h2>
</div>
<br>
<div>
	<form action="Guest_ok.jsp" method="post" name="myForm">
		<table class="table">
			<tr>
				<th>이름</th>
				<td>
					<input type="text" class="txt" name="name"/>
				</td>
			</tr>
			<tr>
				<th>제목</th>
				<td>
					<input type="text" class="txt" name="title"/>
				</td>
			</tr>
			<tr>
				<th>내용</th>
				<td>
					<textarea cols="32" rows="5" name="content"></textarea>
				</td>
			</tr>
			<tr>
				<td colspan="2">
					<button type="button" onclick="sendIt()" class="btn"
					style="width: 50%;">방명록 작성</button>
				</td>
			</tr>
		</table>
	</form>
</div>



</body>
</html>

---

<%@ page contentType="text/html; charset=UTF-8"%>
<%
	// 필터 적용 전까지는 한글 깨짐 방지용으로 작성 필요
	request.setCharacterEncoding("UTF-8");
%>
<!-- scope default 는 page -->
<jsp:useBean id="dto" class="com.test.GuestDTO" scope="page"></jsp:useBean>
<!-- 외국 주소 느낌으로 작은 개념에서 -> 큰 개념 으로 가기 때문에 property -> name 이 자동으로 입력 되어있는데 순서 바꿔도 상관X -->
<jsp:setProperty property="*" name="dto"/>

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Guest_ok.jsp</title>
<link rel="stylesheet" type="text/css" href="css/main.css">
</head>
<body>

<!-- 
	작성해서 넘긴 내용 확인
	이름, 제목, 내용
-->

<div>
	<h1>간단한 기본 방명록 작성 실습</h1>
	<hr />
</div>

<div>
	<h2>작성된 내용 확인</h2>
	<!-- <h3> 이름 : 홍길동</h3> -->
	<h3> 이름 : <%=dto.getUserName() %></h3>
	<!-- <h3> 제목 : 어쩌구저쩌구</h3> -->
	<h3> 제목 : <%=dto.getSubject() %></h3>
	<!-- <h3> 내용 : </h3> -->
	<h3> 내용 : </h3>
	<!-- <h4> 궁시렁 <br> 꿍시렁 </h4> -->
	<h4><%=dto.getContent().replaceAll("\n", "<br>") %></h4>
</div>

</body>
</html>

<%@ page contentType="text/html; charset=UTF-8"%>
<%
	request.setCharacterEncoding("UTF-8");
%>
<jsp:useBean id="guest" class="com.test.GuestDTO"></jsp:useBean>
<jsp:setProperty property="*" name="guest"/>

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Guest_ok.jsp</title>
<link rel="stylesheet" type="text/css" href="css/main.css">
</head>
<body>
<div>
	<h1>방명록</h1>
	<hr />
</div>
<div>
	<h2>방명록 확인</h2>
</div>
<br>
<!-- 
	작성해서 넘긴 내용 확인
	이름, 제목, 내용
-->
<%=guest.result() %>
</body>
</html>

---

• JSP 한글 인코딩 템플릿 설정