472p
처음 jsp가 등장한 것은 디자이너가 자바 코드를 사용하지 않고도 화면을 구현할 수 있도록 하기 위함이었음
그러나 화면이 점차 복잡해지며 html 코드에 자바 코드를 같이 써야하는 문제로 어려움을 겪게됨
=> jsp는 스크립트릿의 자바 코드를 제거하여 스크립트 형태로 기능을 제공하게 되었고, 액션 태그들로 자바 코드를 대신하게 되었음
▼JSP의 여러 가지 액션 태그
| 이름 | 형식 | 설명 |
| 인클루드 액션 태그 | <jsp:include> | 이미 있는 jsp를 현재 jsp에 포함하는 태그 |
| 포워드 액션 태그 | <jsp:forward> | 서블릿에서 RequestDispatcher 클래스의 포워딩 기능을 대신하는 태그 |
| 유즈빈 액션 태그 | <jsp:useBean> | 객체를 생성하기 위한 new 연산자를 대신하는 태그 |
| 셋프로퍼티 액션 태그 | <jsp:setProperty> | setter를 대신하는 태그 |
| 겟프로퍼티 액션 태그 | <jsp:getProperty> | getter를 대신하는 태그 |
인클루드 액션 태그 13.1에서
포워드 액션 태그 13.2에서
유즈빈, 셋프로퍼티, 겟프로퍼티 13.3에서
13.1 인클루드 액션 태그 사용하기
인클루드 액션 태그는 12장 인클루드 디렉티브 태그처럼 화면을 분할해서 관리할 때(제목 등 상단화면, 왼쪽메뉴 등) 사용함. 인클루드 액션태그를 이용하면 이처럼 공통적으로 사용하는 홈페이지 상단화면, 왼쪽 메뉴화면을 재사용할 수 있음
형식
<jsp:include page="jsp페이지" flush="true 또는 false">
...
</jsp:include>
* page : 포함할 jsp 페이지를 의미함
* flush : 지정한 jsp를 실행하기 전 출력 버퍼 비움 여부를 지정함
▼인클루드 액션 태그와 인클루드 디렉티브 태그 비교
| 항목 | 인클루드 액션 태그 | 인클루드 디렉티브 태그 |
| 기능 | JSP 레이아웃 모듈화 | JSP 레이아웃 모듈화 |
| 처리시간 | 요청시간에 처리 | JSP를 자바 코드로 변환 시 처리 |
| 데이터 처리 방법 | param 액션 태그를 이용해 동적 처리 가능 | 정적 처리만 가능 |
| 포함된 JSP 자바 파일 변환여부 |
포함되는 JSP가 각각 자바 파일로 생성됨 | 포함되는 JSP가 포함하는 JSP에 합쳐진 후 총 1개의 자바파일만 생성됨 |
기능은 동일하나 차이점이 있음
JSP 페이지에 이미지 포함 실습
475p
인클루드 액션 태그의 실행 과정
1. 브라우저 요청 시, jsp 파일(include.jsp)을 컴파일함
2. 컴파일 시 <jsp:include>가 지시하는 jsp(duke_image.jsp)를 요청함
3. 요청된 jsp를 컴파일한 후 컴파일된 jsp가 응답을 보냄
4. jsp는 브라우저에서 요청한 응답 결과를 출력함
( 요청 받은거 컴파일하다가 include 된거 있으면 걔 요청해서>컴파일>응답 받아서 브라우저에 출력한다는 소리~)
[ duke_image.jsp ]
자식 jsp에 해당함.
부모 jsp에서 포함 요청 시 전달된 이름, 이미지파일을 getParameter() 메서드를 이용해 가져와서 이름과 해당 이미지를 출력함
<%
request.setCharacterEncoding("utf-8");
String name = request.getParameter("name");
String imgName = reqeust.getParameter("imgName");
// param 액션 태그로 전달된 매개변수를 getParameter() 를 이용해 가져옴
%>
...
표현식으로 name과 imgName에 해당하는 이미지파일을 출력함
[ include1.jsp ]
부모 jsp임
<jsp:include> 태그의 page 속성에 포함할 자식 jsp인 duke_image.jsp를 지정함
<jsp:param> 태그(param 액션태그)를 이용해 이름(듀크)과 이미지파일 이름(duke.png)을 동적으로 자식jsp에 포워딩함
<jsp:include page="duke_image.jsp" flush="true"> // duke_image.jsp를 동적으로 전달함
<jsp:param name="name" value="듀크" />
<jsp:param name="imgName" value="duke.png" /> // param 액션 태그를 이용해 이름과 파일이름을 전달함
</jsp:include>
[ include2.jsp ]
include1.jsp와 다른 이름(듀크2)과 이미지 파일 이름(duke2.png)을 전달하자
<jsp:include page="duke_image.jsp" flush="true">
<jsp:param name="name" value="듀크2" />
<jsp:param name="imgName" value="duke2.png" /> // param 액션 태그를 이용해 이름과 파일이름을 전달함
</jsp:include>
=> 브라우저에서 include1.jsp를 요청할 때와 include2.jsp를 요청할때 각각 다른 이미지와 이름이 출력되는 것 확인
서로 같은 jsp(duke_image.jsp)를 include했지만, param으로 전달한 parameter가 서로 다르기때문에 parameter에 따라 다르게 표시되는 것임(동적인 결과 출력)
& JSP 마다 하나의 자바파일이 각각 생성된 것 확인,
인클루드 액션태그의 <param> 태그의 값이 request 객체에 바인딩 되어서 jsp로 전달되는 것 확인
13.2 포워드 액션 태그 사용하기
480p
서블릿에서 다른 서블릿으로 포워딩하는 방법에 RequestDispatcher를 이용하는 방법이 있었다
하지만 포워드 액션 태그를 사용하면 자바 코드 없이도 포워딩할 수 있다.
포워딩 시 서블릿이나 jsp로 값을 전달할 수도 있다
형식
<jsp:forward page="포워딩할 jsp 페이지">
...
</jsp:forward>
실습
[ login.jsp ]
로그인창.
'아이디를 입력하지 않았습니다' 문구가 출력됨
id와 pw 입력 후 action에서 지정한 result.jsp로 포워딩하도록 작성함
[ result.jsp ]
id를 입력하지 않은 경우 자바의 RequestDispatcher를 사용하지않고, 포워드 액션 태그를 사용해 다시 로그인창으로 이동하도록 작성함
<%
String userID = request.getParameter("userID");
if(userID.length() == 0) {
/* // RequestDispatcher를 이용해 포워딩하는 부분은 주석처리함
RequestDispatcher dispatch = request.getRequestDispatcher("login.jsp");
dispatch.forward(request, response);
%>
<jsp:forward page="login.jsp" /> // (if문 조건에 따라) id를 입력하지 않았다면 로그인창으로 포워딩함
<%
}
%>
// id를 잘 입력했다면 출력
<h1>환영합니다 <%= userID %>님 !! </h1>
=> 최초 login.jsp로 접속시 로그인창에 이미 오류메세지 '아이디를 입력하지 않았습니다'가 나타난다는 문제가 있음
<jsp:forward> 태그 안에 param 액션태그를 이용해서 오류시에만 오류 메세지가 나타나게 하자
[ login2.jsp ]
로그인창에 접속시 getParameter()로 msg 값을 가져와서 표시하도록 구현함
최초 요청시에는 msg값이 null임. 아무것도 표시하지 않음.
<body>
<%
String msg = request.getParameter("msg");
if (msg != null) {
%>
<h1> <%=msg %> </h1>
<%
}
%>
...
[ result2.jsp]
id를 입력하지 않았을 경우 다시 로그인창으로 포워딩함
이번에는 <jsp:param> 태그를 이용해 msg 값을 전달함
<%!
String msg = "아이디를 입력하지 않았습니다";
%>
...
<body>
<%
String userID = request.getParameter("userID"); // 로그인 시 입력한 id를 가져옴
if (userID.length() == 0) { // 아이디를 입력하지 않았다면
%>
<jsp:forward page="login2.jsp" >
<jsp:param name="msg" value="<%= msg %>" />
</jsp:forward>
<%
}
%>
13.3 useBean, setProperty, getProperty 액션 태그 사용하기
486p
클래스 객체의 속성에 접근할 때 자바의 getter, setter를 사용하는 것보다 태그를 사용하는 것이 디자이너 입장에서 더 쉬움
이 절에서는 useBean, setProperty, getProperty 액션태그를 사용해 객체 생성, 속성에 값 저장, 속성에서 값 가져오는 방법에 대해 알아보자. 그 전에 자바 빈(Java bean)의 개념부터 알아보자
자바 빈을 이용한 회원정보조회 실습
자바 빈은 웹 프로그래밍, 즉 Java EE 프로그래밍 시 여러 객체를 거치면서 만들어지는 데이터를 저장하거나 전달할 때 사용함. 자바의 DTO(Data Transfer Object, 데이터 전송 객체) 클래스, VO(Value Object) 클래스와 같은 개념이라 볼 수 있다. 자바 빈을 만드는 방법은 VO 클래스를 만드는 방법과 같다.
자바 빈의 특징
속성의 접근제한자는 private임
각 속성(attribute, property)은 각각의 setter, getter를 가짐
setter/getter 이름의 첫글자는 반드시 소문자
인자 없는 생성자를 반드시 가지며 다른 생성자를 추가할 수 있음
1. 패키지를 새로 생성 후 MemberBean, MemberDAO 클래스를 추가함, WebContent에 실습파일 member.jsp, memberForm.html을 생성
2. 회원 테이블(t_member) 를 참고해 MemberBean 클래스를 작성함
MemberBean 클래스의 속성은 회원 테이블의 각 컬럼 이름을 그대로 사용함. 자료형도 컬럼 이름의 자료형과 동일하게 선언함
t_member 테이블은 String 타입 id, pwd, name, email과 date 타입 joinDate 총 4개의 컬럼을 가짐
[ MemberBean 클래스 ]
private String id;
private String pwd;
private String name;
private String email;
private Date joinDate; // 테이블의 컬럼과 동일한 이름, 자료형으로 멤버 변수 선언
public MemberBean() {} // 반드시 인자 없는 생성자를 가짐
public MemberBean(String id, String pwd, String name, String email) { // 인자가 4개인 생성자를 추가함
this.id =id;
this.pwd = pwd;
this.name = name;
this.email = email;
}
getter/setter를 추가
[ memberForm.html ]
회원가입 창. 회원정보 입력 후 member.jsp로 전송하도록 작성
form 태그 안에 table 태그를 이용한 양식
[ member.jsp ]
전송된 회원정보를 getParameter()로 가져온 후 MemberBean 객체를 생성하여 각 회원정보를 속성에 설정함(인자 4개인 생성자 이용), 그런 다음 MemberDAO의 addMember() 메서드를 호출해 인자로 전달함
새 회원을 추가한 후에는 다시 MemberDAO의 listMember() 메서드를 호출해 모든 회원정보를 조회, 목록으로 출력함
<%
request.setCharacterEncoding("utf-8"); // 한글 인코딩을 설정함
%>
<%
String id = request.getParameter("id")
String pwd = request.getParameter("pwd")
String name = request.getParameter("name")
String email = request.getParameter("email") // 전송된 회원정보 가져옴
MemberBean m = new MemberBean(id, pwd, name, email) // 생성자 이용해 속성에 값 설정함
MemberDAO memberDAO = new MemberDAO();
memberDAO.addMember(m); // MemberBean 객체를 인자로 넘겨주어 회원정보를 테이블에 추가함
List memberList = memberDAO.listMembers(); // 전체 회원 정보를 조회함
%>
for문을 이용해서 memberList에 저장된 MemberBean 객체를 하나씩 꺼내와 getter를 이용해 출력함
[ MemberDAO 클래스 ]
addMember() 호출 시 MemberBean 객체로 전달된 회원정보를 getter를 이용해 가져온 후 insert문을 이용해 추가함
public List listMembers() {
ArrayList 생성
전체 회원정보 조회 쿼리 실행, while 반복문으로 getter 이용해 한 행씩 가져와서 MemberBean 객체 생성해 setter로 정보 저장함, list에 추가 후 list return함
}
public void addMember(MemberBean memberBean)
{
...
String id = memberBean.getId();
String pwd = memberBean.getPwd();
String name = memberBean.getName();
String email = memberBean.getEmail(); // getter를 이용해 인자의 회원정보 가져옴
insert문을 이용한 쿼리 실행하여 해당 회원정보를 테이블에 추가함
}
유즈빈 액션 태그를 이용한 회원 정보 조회 실습
495p
자바 빈을 자주 이용하면 화면이 복잡해진다는 단점. 이를 보완하기 위해 유즈빈 액션 태그를 사용함.
유즈빈 액션 태그는 jsp 페이지에서 자바 빈을 대체하기 위한 태그로, 형식은 다음과 같다
<jsp:useBean id="빈 이름" class="패키지 이름을 포함한 자바 빈 클래스" [scope="접근범위"] />
id: jsp 페이지에서 자바 빈 객체에 접근할 때 사용할 이름
class : 패키지 이름을 포함한 자바 빈 이름
scope : 자바 빈에 대한 접근범위. page, request, session, application을 가지며 page가 기본값임.
[ member2.jsp ]
회원 가입 및 조회 시 MemberBean 클래스에 대한 유즈빈 액션 태그를 사용하려면 먼저 <jsp:useBean> 액션 태그를 이용하여 MemberBean 클래스에 대해 id가 m인 빈을 생성함=자바코드로 직접 MemberBean 객체를 생성하는 것과 같은 ㅇㄱ할을 함
그런 다음 자바 코드에서 빈id인 m을 이용해 회원 가입창에서 전달된 회원정보를 setter를 이용해 빈 속성에 설정함
<%
request.setCharacterEncoding("utf-8"); // useBean에 속성 값을 설정하기 전에 한글 인코딩 작업을 함
%>
<jsp:useBean id="m" class="sec01.ex01.MemberBean" scope="page" />
<%
String id = request.getParameter("id");
String pwd = request.getParameter("pwd")
String name = request.getParameter("name")
String email = request.getParameter("email")
// MemberBean m = new MemberBean(id, pwd, name, email);
// 자바 코드에서 MemberBean 객체를 생성하지 않고 위에서 유즈빈 액션 태그를 이용해서 만들었음
m.setId(id); // 전송된 회원 정보를 useBean에 설정함
...
MemberDAO memberDAO = new MemberDAO();
memberDAO.addMember(m); // MemberBean에 저장된 회원 정보를 테이블에 추가한 뒤
List memberList = memberDAO.listMembers(); // 회원정보 리스트를 출력함
%>
...
<table> 태그와 for문을 이용하여 list 출력
=> 자바 빈을 이용할 때와 마찬가지로, 회원 가입창에서 정보 입력 후 '가입하기' 누르면 추가된 새 회원과 함께 회원목록 출력됨
setProperty / getProperty 액션 태그를 이용한 회원 정보 조회 실습
498p
useBean 액션태그를 사용해 자바코드를 쓰지 않고 자바 빈을 생성한 것과 같이
빈의 속성에 값을 설정하고 가져올 때도 자바코드에서 setter/getter를 이용하는 대신 useBean에 접근해 속성값을 설정하거나 가져오는 <jsp:setProperty> <jsp:getProperty> 액션 태그를 사용할 수 있음
▼setProperty와 getProperty 액션태그의 특징
| 이름 | 정의 | 형식 |
| setProperty | useBean의 속성에 값을 설정하는 태그 |
<jsp:setProperty name="자바빈 이름" property="속성이름" value="값" /> - name : <jsp:useBean> 액션태그의 id 속성에 지정한 이름 - property : 값을 설정할 속성이름 - value : 속성에 설정할 속성값 |
| getProperty | useBean의 속성 값을 얻는 태그 |
<jsp:getProperty name="자바빈 이름" property="속성이름" /> - name : <jsp:useBean> 액션태그의 id 속성에 지정한 이름 - property : 값을 얻을 속성 이름 |
setter를 사용하지 않고 빈 속성 설정하기
499p
1.실습파일 member3.jsp ~7.jsp 준비하자
2. [ member3.jsp ]
<jsp:useBean> 액션태그로 생성된 빈에 대해 <jsp:setProperty> 액션태그를 이용해 빈의 속성을 설정하자.
앞의 예제와 달리 회원가입창에서 전송한 회원정보를 자바코드 setter를 사용하지 않았다는 것이 차이임
...
<% request.setCharacterEncoding("utf-8"); %> // useBean 속성값 설정 전 한글 인코딩 작업을 함
<jsp:useBean id="m" class="sec.ex01.MemberBean" scope="page" />
<jsp:setProperty name="m" property="id" value=' <%= request.getParameter("id") %>' />
마찬가지로 pwd, name, email 설정
// 회원가입창에서 전송된, 유즈빈 속성과 동일한 이름으로 전송된 매개변수 값으로 설정함
...
=> 실행결과는 자바코드를 사용했을 때와 동일함
3. [ member4.jsp ]
유즈빈 속성에 좀 더 편리하게 설정하는 방법을 알아보자
먼저, 회원가입창의 각 input의 매개변수 이름(name)을 MemberBean의 속성 이름과 동일하게 설정함,
<jsp:setProperty> 액션태그의 param 속성을 이용하면 회원가입창에서 전달된 매개변수 이름이 param 속성에 지정한 것과 같으면 그 매개변수 값으로 해당 useBean 속성에 값을 설정함
<jsp:useBean id="m" class="sec.ex01.MemberBean" scope="page" />
<jsp:setProperty name="m" property="id" param="id" />
마찬가지로 pwd, name, email 설정
// 회원가입 창에서 전달된 매개변수 이름(name)과 속성이름(property)이 같으면 param으로 값을 가져와 설정할 수 있음
...
4. [ member5.jsp ]
param 속성을 생략하고 property 속성 이름만 지정하면 회원가입창에서 전달받은 매개변수 중 이름이 같은(property에 지정한 값과 input의 name값이 같은) 매개변수의 값을 자동으로 설정해줌
<jsp:useBean id="m" class="sec.ex01.MemberBean" scope="page" />
<jsp:setProperty name="m" property="id" /> // param 속성도 생략할 수 있음
// 회원가입 창에서 전달받은 매개변수 이름(input의 name)이 일치하는 useBean 속성(property)에 자동으로 값을 설정해줌
=>
property와 input의 name이 다르면 param으로 input 값 가져와 property value값 설정해야하고,
property와 input의 name이 같으면 param 생략하고 property만으로 input 값 가져와 value 설정할 수 있음
5. [ member6.jsp ]
<jsp:setProperty> 액션태그의 property 속성에 *를 지정하면, jsp페이지에서 자동으로 매개변수 이름과 속성이름을 비교한 후 같은 이름의 속성이름에다 전달된 값을 알아서 설정해줌
<jsp:setProperty name="m" property="*" />
// name이 m인 useBean(MemberBean)의 속성(멤버변수)에는 id, pwd, name, email, joinDate가 있음
// 회원가입창(memberForm.html)의 input의 name에는 name, pwd, name, email이 있음
// 자동으로 input의 name, pwd, name, email으로 전송된 값을 useBean의 id, pwd, name, email 속성의 값으로 설정함
6. [ member7.jsp ]
... // <jsp:setProperty>로 값 저장
...
<td>
<jsp:getProperty name="m" property="id" />
</td>
...
// <jsp:getProperty> 태그를 이용해 useBean의 속성값에 접근함
505p
*** <jsp:param> 액션태그를 통해 <include>와 <forward> 액션태그 사용시 다른 jsp로 매개변수 값을 전송할 수 있음
'(책) 자바 웹을 다루는 기술' 카테고리의 다른 글
| Chap 14 표현 언어와 JSTL -2 (0) | 2023.08.29 |
|---|---|
| Chap 14 표현 언어와 JSTL -1 (0) | 2023.08.27 |
| Chap 12 JSP 스크립트 요소 기능 (0) | 2023.08.25 |
| Chap 11 JSP 정의와 구성 요소 (0) | 2023.08.23 |
| Chap 10 서블릿의 필터와 리스너 기능 (0) | 2023.08.23 |