JSP (Java Server Page)
•
JSP란, HTML형식 내에서 자바코드를 쓸 수 있는 "자바언어"로 서블릿(자바코드내)에서 응답화면(HTML)을 구현했던 복잡함을 보다 간단하게 해결 가능
→ 즉, JSP의 가장 큰 장점은 Servlet에서는 비즈니스 로직처리(요청처리)에만 집중하고 프레젠테이션 로직(응답화면을 만들어내는)은 JSP에서 집중하게끔 분리할 수 있는 것
JSP Element 표현법
1. JSP 스크립팅 원소 (Scripting Element)
JSP 페이지에서 자바 코드를 기술할 수 있게 해주는 기능
•
선언문 : <%! 자바코드 %>멤버변수와 메소드를 선언하기 위해 사용
•
스크립틀릿 : <% 자바코드 %>JSP에서 자바코드를 기술하기 위한 제일 기본적인 표현법
•
표현식(출력식) : <%= 자바코드 %>자바에서 작성한값(또는 메소드 호출)을 출력하기 위해 사용
2. 지시어 (Directive) <%@ page|include|taglib 속성="속성값" ... %>
JSP page 전체에 영향을 미치는 정보를 기술 할 때 쓰임
1.
page 지시어 : 현재의 jsp 페이지를 처리하는데 필요한 각종 속성을 기술하는 부분
•
language : 사용할 스크립트 언어 유형을 지정
•
contentType : 웹 브라운저가 받아 볼 해당 페이지의 형식, 인코딩 방식 지정
•
pageEncoding : jsp파일에 기록된 자바코드의 인코딩 방식 지정
•
import : 자바의 import와 같은 의미
•
errorPage : 해당 jsp상에 오류가 발생했을 경우 보여줄 에러페이지의 경로 지정
2.
include 지시어 : jsp파일에 또다른 jsp를 포함시키고자 할 때 사용하는 지시어
3.
taglib 지시어 : JSP 기능을 좀 더 확장할 수 있는 인자로 추가적인 라이브러리를 등록하는 구문
•
피자주문페이지
주문요청 --> 주문요청을 받아서 처리해주는 Servlet --> 피자결제페이지(응답jsp)
1.
주문요청 페이지.jsp (VS로 작업함)
<%@ 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>
<h1>피자 주문 페이지</h1>
<h2>오늘의 날짜</h2>
<%@ include file="datePrint.jsp" %>
<br>
<form action="/2_JSP/confirmPizza.do" method="get">
<fieldset>
<legend>주문자정보</legend>
<table>
<tr>
<th>이름</th>
<td><input type="text" name="userName" required></td>
</tr>
<tr>
<th>전화번호</th>
<td><input type="text" name="phone" required></td>
</tr>
<tr>
<th>주소</th>
<td><input type="text" name="address" required></td>
</tr>
<tr>
<th>배달요청사항</th>
<td><textarea name="message"></textarea></td>
</tr>
</table>
</fieldset>
<fieldset>
<legend>주문정보</legend>
<table>
<tr>
<th>피자</th>
<td>
<select name="pizza">
<option>콤비네이션</option>
<option>불고기피자</option>
<option>하와이안피자</option>
<option>고구마피자</option>
<option>포테이토피자</option>
</select>
</td>
</tr>
<tr>
<th>토핑</th>
<td>
<input type="checkbox" name="topping" value="치즈토핑"> 치즈토핑
<input type="checkbox" name="topping" value="고구마무스"> 고구마무스
<input type="checkbox" name="topping" value="콘크림무스"> 콘크림무스
<br>
<input type="checkbox" name="topping" value="파인애플토핑"> 파인애플토핑
<input type="checkbox" name="topping" value="치즈바이트"> 치즈바이트
<input type="checkbox" name="topping" value="치즈크러스트"> 치즈크러스트
</td>
</tr>
<tr>
<th>사이드</th>
<td>
<input type="checkbox" name="side" value="콜라"> 콜라
<input type="checkbox" name="side" value="사이다"> 사이다
<input type="checkbox" name="side" value="갈릭소스"> 갈릭소스
<br>
<input type="checkbox" name="side" value="핫소스"> 핫소스
<input type="checkbox" name="side" value="피클"> 피클
<input type="checkbox" name="side" value="파마산치즈가루"> 파마산치즈가루
</td>
</tr>
<tr>
<th>결제방식</th>
<td>
<input type="radio" name="payment" value="card" checked> 카드결제
<input type="radio" name="payment" value="cash"> 현금결제
</td>
</tr>
</table>
</fieldset>
<br>
<input type="submit" value="주문">
<input type="reset">
</form>
<br>
</body>
</html>
Java
복사
2. 서블릿.java (요청처리)
1.
전달값 중에 한글이 있을 경우 인코딩 처리 (post방식 일때만)
2.
요청시 전달값 뽑기 및 데이터가공처리 => 변수 및 객체 기록
•
request.getParameter("키값") : "밸류값" (String)
•
request.getParameterValues("키값") : ["밸류값", "밸류값", ..] (String[])
•
만일 키값이 존재하지 않을 경우 : null 반환
3.
요청 처리 (보통의 흐름 : db에 sql문 실행하러 > Service > Dao)
•
작업 시 NullPointer 에러가 뜨지 않도록 조건문 만들기
4.
요청처리 후 사용자가 보게될 응답페이지(결제페이지) 만들기 혹은 jsp 위임
•
응답페이지에 필요한 데이터 담기 > request의 attribute영역
•
request.setAttribute("객체명"(String), 객체(Object));
•
Object로 전달되기 때문에 받을 때 형변환 해주어야함
5.
응답할뷰(jsp) 선택
•
RequestDispatcher 메소드 사용
•
RequestDispatcher view = request.getRequestDispatcher("jsp 경로");
6.
선택된 뷰가 사용자에게 보여지도록 포워딩
•
view.forward(request, response);
package com.kh.controller;
import java.io.IOException;
import javax.servlet.RequestDispatcher;
import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
/**
* Servlet implementation class PizzaServlet
*/
@WebServlet("/confirmPizza.do")
public class PizzaServlet extends HttpServlet {
private static final long serialVersionUID = 1L;
/**
* @see HttpServlet#HttpServlet()
*/
public PizzaServlet() {
super();
}
/**
* @see HttpServlet#doGet(HttpServletRequest request, HttpServletResponse response)
*/
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
// 1) 전달값 중에 한글이 있을 경우 인코딩 처리 (post방식 일때만)
//request.setCharacterEncoding("UTF-8");
// 2) 요청시 전달값 뽑기 및 데이터가공처리 => 변수 및 객체 기록
// request.getParameter("키값") : "밸류값" (String)
// request.getParameterValues("키값") : ["밸류값", "밸류값", ..] (String[])
// 만일 키값이 존재하지 않을 경우 : null 반환
String name = request.getParameter("userName"); // "홍길동"
String phone = request.getParameter("phone"); // "01012341234"
String address = request.getParameter("address"); // "서울시 강남구 ..."
String message = request.getParameter("message"); // "요청사항어쩌고~~" / ""
String pizza = request.getParameter("pizza"); // "콤비네이션피자"
String[] toppings = request.getParameterValues("topping"); // ["", ""] / null
String[] sides = request.getParameterValues("side"); // ["", ""] / null
String payment = request.getParameter("payment"); // "card"
// 3) 요청 처리 (보통의 흐름 : db에 sql문 실행하러 > Service > Dao)
int price = 0;
switch(pizza) {
case "콤비네이션피자" : price += 5000; break;
case "불고기피자" : price += 8000; break;
case "하와이안피자" : price += 6000; break;
case "고구마피자" :
case "포테이토피자" : price += 7000; break;
}
if(toppings != null) { // NullPointerException 방지
for(int i=0; i<toppings.length; i++) {
switch(toppings[i]) {
case "콘크림무스" :
case "고구마무스" : price += 1500; break;
case "파인애플토핑" :
case "치즈토핑" : price += 2000; break;
case "치즈바이트" :
case "치즈크러스트" : price += 3000; break;
}
}
}
if(sides != null) {
for(int i=0; i<sides.length; i++) {
switch(sides[i]) {
case "콜라":
case "사이다": price += 2000; break;
case "갈릭소스":
case "핫소스": price += 500; break;
case "피클":
case "파마산치즈가루": price += 1000; break;
}
}
}
// 4) 요청처리 후 사용자가 보게될 응답페이지(결제페이지) 만들기 혹은 jsp 위임
// 응답페이지에 필요한 데이터 담기 > request의 attribute영역
request.setAttribute("name", name);
request.setAttribute("phone", phone);
request.setAttribute("address", address);
request.setAttribute("message", message);
request.setAttribute("pizza", pizza);
request.setAttribute("toppings", toppings);
request.setAttribute("sides", sides);
request.setAttribute("payment", payment);
request.setAttribute("price", price);
// 응답할뷰(jsp) 선택
RequestDispatcher view = request.getRequestDispatcher("views/05_pizzaPayment.jsp");
// 선택된 뷰가 사용자에게 보여지도록 포워딩
view.forward(request, response);
// 04_pizzaOrderForm.jsp 요청=> 응답 PizzaServlet.java 요청=> 응답 05_pizzaPayment.jsp
}
/**
* @see HttpServlet#doPost(HttpServletRequest request, HttpServletResponse response)
*/
protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
doGet(request, response);
}
}
Java
복사
3. 피자결제페이지.jsp
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%
String name = (String)request.getAttribute("name");
String phone = (String)request.getAttribute("phone");
String address = (String)request.getAttribute("address");
String message = (String)request.getAttribute("message");
String pizza = (String)request.getAttribute("pizza");
String[] toppings = (String[])request.getAttribute("toppings");
String[] sides = (String[])request.getAttribute("sides");
String payment = (String)request.getAttribute("payment");
int price = (int)request.getAttribute("price");
%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
<h1>주문 내역</h1>
<h4>[ 주문자 정보 ]</h4>
<ul>
<li>성함 : <%= name %></li>
<li>전화번호 : <%= phone %></li>
<li>주소 : <%= address %></li>
<% if(message.equals("")){ %>
<!-- 요청사항을 기술하지 않았을 경우 -->
<li>요청사항 : 작성안함</li>
<% } else { %>
<!-- 요청사항을 기술했을 경우 -->
<li>요청사항 : <%= message %></li>
<% } %>
</ul>
<br>
<h4>[ 주문 정보 ]</h4>
<ul>
<li>피자 : <%= pizza %></li>
<% if(toppings == null){ %>
<!-- 토핑을 선택 안했을 경우 -->
<li>토핑 : 선택안함</li>
<% } else { %>
<!-- 토핑을 선택했을 경우 -->
<li>토핑 : <%= String.join(", " , toppings) %></li>
<% } %>
<% if(sides == null){ %>
<!-- 사이드를 선택안했을 경우 -->
<li>사이드 : 선택안함</li>
<% } else { %>
<!-- 사이드를 선택했을 경우 -->
<li>사이드 : <%= String.join(", " , sides) %></li>
<% } %>
<li>결제방식 : <%= payment %></li>
</ul>
<h3>위와 같이 주문하셨습니다.</h3>
<h2>총 가격 : <%= price %>원</h2>
</body>
</html>
Java
복사
04_pizzaOrderForm.jsp - submit으로 요청
→ 응답 서블릿 (PizzaServlet.java) doGet메소드로 객체받아서 처리, 전달
→ 응답 jsp (05_pizzaPayment.jsp)
