오봉이와 함께하는 개발 블로그

JSP - JSP 개요(구조, 태그, 구성요소, 지시어) 본문

BE/JSP

JSP - JSP 개요(구조, 태그, 구성요소, 지시어)

오봉봉이 2021. 12. 30. 13:49
728x90

JSP(Java Server Page)

  • HTML 내에 Java 언어를 삽입한 문서
  • .jsp
  • Java 기반
  • HTML 문서 내에 자바 코드를 삽입해서 웹 서버에서 동적으로 웹 페이지를 생성해서 클라이언트(웹 브라우저)에게 반환해 주는 언어
  • 서버 사이드 스크립트 언어
  • JSP를 통해 HTML과 동적으로 생성된 컨텐츠(DB 연동된 실시간 데이터)를 혼합해서 사용 가능
  • Servlet을 보완한 스크립트 방식 표준 언어
  • Servlet 기능 + 추가 기능
  • JSP(.jsp)는 실행되면서 Servlet(.java)으로 변환되어 컴파일 되서 클래스 파일(.class) 파일로 만들어져 실행
  • View를 담당하는 페이지로 사용
  • 점차 JSP 페이지에서 자바 코드가 사라지고 있는 추세
  • El과 JSTL로 표현

JSP와 Servlet 차이점

  • JSP : HTML 내부에 Java 소스 코드가 들어 있는 형식
    • 사용하기 편리하고 쉽다.
  • Servlet : Java 코드 내에 HTML 코드가 들어 있는 형식
    • 읽고 쓰기 불편하다.

JSP 페이지 구조

  • 정적 페이지 + 동적 페이지
  • 정적 페이지 구현
    • HTML 태그 사용
  • 동적 페이지 구현
    • <%@ %>
    • <% %>
    • <%! %>
    • <%= %>

JSP 태그

  • <%로 시작하고 %>로 종료
    • @, !, =, -- 문자를 추가하여 태그의 의미 부여
    • 지시어 <%@ %> : JSP 페이지의 속성 지정
    • 선언부 <%! %> : 변수 선언 및 메소드 정의
    • 표편식 <%= %> : 계산식, 함수 호출 결과 등 출력
    • 스크립트릿 <% %> : 자바 코드 기술
    • 주석 <%-- --%> : JSP 페이지에 설명 추가
    • 액션 태그 <jsp:액션></jsp:액션> : 자바 빈, include / forward / param 등

JSP 페이지의 기본 구성 요소

  • JSP 페이지 내용
    • HTML 문서 내용 + JSP 태그 + 자바 코드
  • JSP 페이지 구성
    • 지시어 : page, include, taglib
    • 스크립트 요소
      • 선언문 (Declaration)
        • JSP 페이지의 멤버 필드(변수)나 메소드를 정의할 때 사용
        • 선언문에서 선언된 변수는 페이지 전체에서 사용(전역변수의 의미)
        • 메소드 선언은 반드시 선언부에서 정의
        • 형식 : <%! 선언 %>
        • 예 : <%! int a = 10; %>
      • 표현식 (Expression)
        • 변수 값, 계산 결과, 메소드 호출 결과를 직접 출력하기 위해 사용
        • 형식 : <%= 수식 %> or <%= 변수 %>
        • 예 : <%= 3*5 %> or <%= name %>
      • 스크립트릿 (Scriptlet)
        • 자유롭게 자바 코드를 기술할 수 있는 영역
        • 메소드 선언은 반드시 선언부에서 정의(스크립트릿 영역에서 정의하면 오류 발생)
        • 형식 : <% 자바코드 %>
        • 스크립트릿에서 선언된 변수는 지역변수의 개념
          • 선언된 이후부터 사용가능
    • 액션 태그

지시어

  • JSP 페이지의 전체적인 속성을 지정할 때 사용
  • JSP 컨테이너에게 전달하는 JSP 페이지 관련 메시지
  • <%@ 지시어 속성1=값, 속성2=값, … %>
  • page, include, taglib 등 사용
    • page 지시어 : <%@ page %>
      • JSP 페이지에 대한 속성 설정
      • language="java"
      • contentType="text/html; charset=UTF-8"
      • pageEncoding="UTF-8"
    • include 지시어 : <%@ include %>
      • <%@ include file="포함될 파일의 url" %>
      • 포함시킬 파일명을 file 속성의 값으로 기술
      • (공통적으로)포함될 내용을 가진 파일을 해당 JSP 페이지 내에 삽입하는 기능 제공
      • 중첩 지정 가능
        • 한 JSP 페이지에서 다른 JSP 페이지를 포함하거나
        • 포함된 JSP 페이지가 또 다른 JSP 페이지에 중첩 포함 가능
      • 두 개의 파일이 하나의 파일로 합쳐진 후 하나의 파일로서 변환되고 컴파일
    • taglib 지시어 : <%@ taglib %>
      • <%@ taglib prefix="c" url="......" %>
      • 커스텀 태그를 JSP 페이지 내에 사용할 때 이용

변수 선언 예제 - variable.jsp

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
  <head>
      <title>Title</title>
  </head>
  <body>
    <%!
      // 선언문
      // 변수 선언 및 초기화만 가능
      int x = 10;
      long y;
      // y = 100; 이 경우 오류(서넌부에서는 값을 지정할 수 없음. 선언과 동시에 초기화만 가능)
      float floatValue = 3.14f;
      double doubleValue = 3.14;

      char ch = 'a';
      String myJob = "프로그래머";

      boolean b = true;
    %>
    <%
      y = 100; // 스크립트릿 영역에서 값 지정
      String name = "홍길동";
    %>
    <h3>변수 값 출력</h3>
      x : <%= x %><br>
      y : <%= y %><br>
      floatValue : <%= floatValue %><br>
      doubleValue : <%= doubleValue %><br>
      ch : <%= ch %><br>
      myJob : <%= myJob %><br>
      b : <%= b %><br>
      name : <%= name %><br>
  </body>
</html>

메소드 예제 - method.jsp

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
  <head>
      <title>선언문 예제 - 메소드 정의(선언)</title>
  </head>
  <body>
    <h3>선언문 예제 - 메소드 정의(선언)</h3>
    <%!
      String id = "abcd";

      public String getId() {
        return id;
      }
    %>
    id : <%= id %><br>
    getId 메소드 호출 결과 : <%= getId() %>
  </body>
</html>

표현식 예제 - expression.jsp

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
  <head>
      <title>선언문 예제 - 메소드 정의(선언)</title>
  </head>
  <body>
    <h3>선언문 예제 - 메소드 정의(선언)</h3>
    <%!
      String id = "abcd";
      // 메소드는 반드시 선언부에서 정의
      public String getId() {
        return id;
      }
    %>
    id : <%= id %><br>
    getId 메소드 호출 결과 : <%= getId() %>
  </body>
</html>

include 지시어 예제 - top.jsp, bottom.jsp, jspinclude.jsp

<%@ page import="java.util.Date" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%
    Date date = new Date();
%>
<html>
    <head>
        <title>top.jsp</title>
    </head>
    <body>
        <font color='blue' size="3pt">
            top.jsp 입니다.<p>
            <%= date.toLocaleString() %>
    </body>
</html>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
    <head>
        <title>bottom.jsp</title>
    </head>
    <body>
        <font color='red' size="3pt">
            bottom.jsp 입니다.<p>
            작성자 <b> <%= name %> <b> 입니다.
            <%-- name :  선언되지 않은 변수이기 때문에 오류 발생 --%>
            <%-- 다른 페이지에 포함되어서 선언되어 있는 name 변수 사용 시 오류 없음 --%>
    </body>
</html>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%!
    String name = "홍길동";
%>
<html>
    <head>
        <title>include.jsp</title>
    </head>
    <body>
        <%-- top --%>
        이 부분에 top.jsp 내용이 포함될 것입니다.<p>
        <%@ include file="top.jsp" %>
        <hr>
        <%-- 본문 --%>
        <h3>본문</h3>
        이 부분은 include.jsp의 내용입니다.
        <hr>
        <%-- bottom --%>
        이 부분에 bottom.jsp 내용이 포함될 것입니다.<p>
        <%@ include file="bottom.jsp" %>
    </body>
</html>

include 지시어 예제2 (하나의 페이지로 합쳐지기 때문에 top과 bottom 페이지에 HTML 태그 필요 없음) - top2.jsp, bottom2.jsp, jspinclude2.jsp

<%@ page import="java.util.Date" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%
    Date date = new Date();
%>
        <font color='blue' size="3pt">
            top2.jsp 입니다.<p>
            <%= date.toLocaleString() %>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
        <font color='red' size="3pt">
            bottom2.jsp 입니다.<p>
            작성자 <b> <%= name %> <b> 입니다.
            <%-- name :  선언되지 않은 변수이기 때문에 오류 발생 --%>
            <%-- 다른 페이지에 포함되어서 선언되어 있는 name 변수 사용 시 오류 없음 --%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%!
    String name = "홍길동";
%>
<html>
    <head>
        <title>include.jsp</title>
    </head>
    <body>
        <%-- top --%>
        이 부분에 top2.jsp 내용이 포함될 것입니다.<p>
        <%@ include file="top2.jsp" %>
        <hr>
        <%-- 본문 --%>
        <h3>본문</h3>
        이 부분은 include2.jsp의 내용입니다.
        <hr>
        <%-- bottom --%>
        이 부분에 bottom2.jsp 내용이 포함될 것입니다.<p>
        <%@ include file="bottom2.jsp" %>
    </body>
</html>
728x90
Comments