Hoon222y

[JSP & Servlet] 3장. JSP 와의 첫 만남 본문

코딩/교육

[JSP & Servlet] 3장. JSP 와의 첫 만남

hoon222y 2019. 1. 15. 08:09

* Chap03 JSP

* 서블릿(Servlet)과 JSP(Java Server Page)
서블릿은 자바를 이용한 서버 프로그래밍 기술
JSP는 PHP와 유사한 형태로 HTML을 중심으로 자바 프로그램과 유기적인 연결을 지원
JSP는 HTML 문서에 자바 코드를 삽입시킴. 사용이 더 쉬움
서블릿은 자바 클래스에 HTML 코드를 삽입시킴. 순수 자바 클래스로 사용이 어려움
서블릿은 특별한 경우에만 사용하고, 일반적으로 JSP 사용
서블릿에서 <%가 시작하면 자바 코드가 시작한다고 보면 됨
JSP를 실행하면 자동으로 서블릿으로 변환되서 실행됨
서블릿은 자바 클래스가 변환되서 실행됨

* JSP 특징
1. 자바의 모든 기능 사용 가능
2. 서블릿으로 컴파일된 후 메모리에서 처리되기 때문에 많은 사용자 접속도 가능
3. JSP 또는 다른 서블릿 간의 데이터를 쉽게 공유할 수 있음
4. 빈즈(Beans)라고 하는 자바 컴포넌트를 사용할 수 있음
JSP가 외부 순수 자바 클래스(자바 빈)를 불러서 사용할 수 있음
JSP가 독자적으로 자바 코드를 구현할 수도 있고, 외부 컴포넌트를 사용할 수 있음
자바 빈에게 요청을 위임해서 처리한 결과를 JSP가 결과를 받아서 화면을 동적으로 구성
5. 커스텀 태그를 만들어 사용 가능하며, JSTL과 같은 태그 라이브러리 이용 가능함
자바 코드를 하나의 태그로 만들어서 JSP 문서에서 사용 가능
실행되는 시점에 자바로 실행되므로 필요한 동작을 쉽게 구현할 수 있음
직접 자바로 구현하지 않아도 JSTL을 이용하면 간단하게 구현할 수 있음
6. 스트러츠, 스프링 @MVC 등 다양한 프레임워크와 결합하여 개발할 수 있음

* JSP 전체 동작 과정
JSP는 HTML과 유사한 처리 과정을 거치나 HTML이 단순 서버 파일을 브라우저로 보내주는 것에 비해 JSP는 서버에서 프로그램이 실행된 결과를 웹 브라우저로 전달하는 차이가 있음

정적인 요청이면 웹 서버가 처리하고, 동적인 요청이면 백 단의 WAS에게 forwarding
확장자를 이용해 웹 서버가 이 둘을 구분함
JSP 내의 자바 코드가 실행된 결과는 HTML 코드가 나오는데, 원래의 자바 코드를 덮어 써서 HTML 코드로 바뀌게 되므로, 전체가 HTML 문서로 구성되서 응답

* JSP와 서블릿 차이
JSP는 HTML과 같은 일반적인 텍스트 파일 구조
서블릿은 자바 소스로 작성된 클래스 파일 구조
JSP는 서블릿 컨테이너에 의해 서블릿 형태의 자바 소스로 변환되어 클래스로 컴파일됨

* 서블릿 컨테이너
- 서블릿 컨테이너는 서블릿을 실행하고 JSP를 서블릿 코드로 변환하는 기능 수행
변환된 JSP의 서블릿 클래스를 실행하고 웹 서버의 메모리에 적재하고 사용자 요청에 따라 실행

* JSP 이것만은 알고 있자
JSP는 일반 텍스트 파일로 되어있으며, HTML 코드와 몇몇 특수 태그, 자바 코드가 섞여 있다
JSP는 컨테이너(톰캣)에 의해 서블릿 형태의 .java 소스로 변환되고 컴파일된다
소스 변경 전까지 메모리 상주하면서 스레드를 추가함

계산기 프로그램 [calc.jsp]

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
<%@ page contentType="text/html; charset=UTF-8" %>
<%
// 변수설정
int result = 0;
// 웹페이지 요청이 post 인 경우에만 수행 즉 form을 통해 전달된것만 수행
// 초기 로딩시 오류방지
if(request.getMethod().equals("POST")) {
    // 연산자를 가지고 옴
    String op = request.getParameter("operator");
    // 문자열 형태로 전달된 인자들을 int 로 변환함
    int num1 = Integer.parseInt(request.getParameter("num1"));
    int num2 = Integer.parseInt(request.getParameter("num2"));
    if(op.equals("+")) {
        result = num1+num2;
    }
    else if(op.equals("-")) {
        result = num1-num2;
    }
    else if(op.equals("*")) {
        result = num1 * num2;
    }
    else if(op.equals("/")) {
        result = num1 / num2;
    }
}
%>
<HTML>
<HEAD>
    <TITLE> 계산기 </TITLE>
</HEAD>
<BODY>
// div 태그는 명령을 구분하기 위한 목적으로 사용
<div align="center">
<H3>계산기</H3>
<HR>
    <form name=form1 method=post>
        <INPUT TYPE="text" NAME="num1" width=200 size="5">
        <SELECT NAME="operator">
        <option selected>+</option>
        <option>-</option>
        <option>*</option>
        <option>/</option>
        </SELECT>
        <INPUT TYPE="text" NAME="num2" width=200 size="5">
        <input type="submit" value="계산" name="B1">
        <input type="reset" value="다시 입력" name="B2">
    </form>
<HR>
    계산결과 : <%=result %>
</div>
</BODY>
</HTML>
cs

CSS에서 c는 cascade : 연쇄 -> 부모의 스타일이 자식들에게 연속적으로 영향

* form태그
- 사용자가 입력한 값을 포함하는 새로운 값을 서버에 보내기 위해서 form 태그를 사용
- 다양한 입력 양식 태그를 사용할 수 있음. Selected(콘솔 박스 만들기)
- name 속성은 없어도 됨
- Method는 클라이언트가 요청을 보낼 때 방식을 지정할 수 있다.

* method
- 클라이언트가 서버에 요청을 보낼 때 요청 방식을 지정할 수 있음(GET/POST)
- request method : 브라우저가 서버에 요청을 보낼 때 사용할 수 있는 방식 9가지
- form 태그에서는 GET, POST 방식이 있음(기본값은 GET)
- GET방식에서 파라미터 …?param::value
- POST 방식을 지정하게 되면 파라미터 정보가 숨겨짐

request message를 할 때 header 영역과 body 영역으로 구분되는데, GET 방식은 header 영역만 사용할 수 있음 -> URL ? 뒤에 억지로 집어넣음
POST 방식은 header 영역과 body 영역을 모두 사용할 수 있어서 url이 아닌 body 영역으로 들어가게 됨 -> 파라미터 정보가 보이지 않음
보안 상으로는 둘의 성능이 같음
보안을 생각한다면 일반 http가 아닌 https라는 SSL(Secure Socket Layer)를 이용하면 됨

* action
- form 태그가 반드시 가져야하는 또 하나의 속성
form이 존재하기 action이 지정되지 않으면 서버 누구에게 요청해야 하는지 모르므로, 브라우저는 현재 웹 페이지를 서버에 다시 요청 -> 동적 웹 페이지는 페이지가 갱신됨

* INPUT 태그
교재의 예제는 HTML4 -> 단순 텍스트만 입력으로 받을 수 있음
TYPE에는 text, number 등을 입력할 수 있음

INPUT 태그에서는 반드시 NAME 속성을 사용해야 함
NAME이 없으면 더 이상 입력 양식 태그가 아님
입력 양식 태그는 사용자가 입력한 값을 파라미터화 해서 요청에 탑재함
파라미터에 이름이 없다면 그 파라미터가 요청에 탑재될 수 없음

width, size는 사용자 입력 창의 폭을 의미함
width는 픽셀, size는 5개의 글자가 보일 만큼의 너비 사용하라는 의미
실제로는 두 속성을 동시에 사용하는 것은 권장하지 않음
TYPE이 "text인 경우 size="5"를 사용하는 것이 좋음

type 속성의 값이 "submit", "reset", "image", "button"인 경우 값을 입력받는 것이 아니라 버튼을 생성함
입력 양식 태그에서 NAME은 파라미터의 이름을 결정하는 용도로만 사용

* SELECT 태그
SELECT 태그는 선택 박스를 구현함
option 태그에서 selected는 기본값을 의미함

<%에는 자바 코드가 입력됨

* page 지시자
디렉티브 지시자 <%로 시작
page는 반드시 사용해야 하는 지시자
page 지시자가 없으면 JSP 문서로 인식되지 않음
현재 문서에 대한 정보 또는 처리 방식을 컨테이너(톰캣)에게 전달하기 위한 목적
page 지시자는 반드시 contentType 속성을 가져야 함

JSP는 클라이언트에게 HTML을 전달
데이터 형식을 나타내는 text/html을 마인 값이라고 함

* 스크립트 릿(lit)
<% 안에 자바 코드를 삽입 %>

* request 객체
현재 클라이언트의 요청을 객체화한 객체
서블릿에서는 필요한 객체를 직접 생성해야하지만, JSP에서는 필수 객체를 제공
getMethod( ) : 현재 클라이언트 요청이 GET/POST 중 어떤 방식인지 확인 후 문자열로 반환

동일한 웹 페이지지만 사용자가 어떤 방식으로 요청을 보냈는지에 따라 선택적으로 다른 처리를 수행하도록 함
url에 주소만 입력해서 들어가면 자바 코드는 보내지 않고 HTML만 보냄
사용자가 값을 입력하고 계산 버튼을 누르면 get이 아닌 post 방식으로 보냄
submit 버튼을 누른 경우만 자바 코드만 수행

request : 컨테이너에 대해 클라이언트의 요청을 객체화한 객체
요청과 관련된 모든 정보가 담겨 있음. 요청을 처리하려면 필수로 request 사용해야 함
getParameter( )는 요청에 탑재된 파라미터 값을 반환하는데 매개변수는 name이 들어감
브라우저에서 서버로 전달되는 모든 값은 문자열
웹에서 사용자가 입력한 값을 읽는 경우 무조건 문자열로 읽어야 함
문자열을 Integer.parseInt를 이용해 정수로 형변환
result가 if문 밖에 정의된 이유는 get/post와 상관없이 항상 필요하기 때문임
<%=는 값을 출력하기 위한 용도로 사용


'코딩 > 교육' 카테고리의 다른 글

[JSP & Servlet] 6장. JSP 내장 객체  (1) 2019.01.16
[JSP & Servlet] 5장. JSP 기본 문법  (0) 2019.01.16
[JSP & Servlet] 사전문제 & 2장  (1) 2019.01.15
[JavaScript] 2장. 기본 문법  (0) 2019.01.10
[JavaScript] 11장. 이벤트  (0) 2019.01.10
공유하기 링크
'코딩/교육' Related Articles more
Comments