IT 배움터

   스크립트 태그로 Java의 기능을 HTML 내에서 구현할 수 있었다면 이번에는 Java의 기능에 대한 속성을 설정할 수 있는 태그를 알아보겠다. 디렉티브 태그는 JSP 페이지에서 어떤 처리를 할 것인지에 대한 기본적인 설정을 할 수 있는 태그로, 각 태그에는 저마다 가진 속성이 다양하게 있다.

   page 디렉티브 태그   

   여기서 language / contentType / pageEncoding 속성은 jsp파일을 생성하면 자동으로 설정되어 나오는 항목이다.

   import 속성의 사용 예시이다. 기존 클래스에 다른 클래스를 가져올 때 사용했던 import기능과 다른 것이 없다.

   조금 주의 깊게 살펴봐야 될 부분은 예외처리 페이지이다. errorPage 속성은 해당 페이지에서 에러가 발생했을 경우 예외처리를 위한 에러 페이지 위치를 지정해 주는 것이고, isErrorPage는 그 에러 페이지를 지정하는 것이다. 물론 지정하지 않아도 경로만 잘 설정했다면 굳이 지정해주지 않아도 되지만 isErrorPage를 설정하는 이유는 true 지정 시, exception 변수를 사용할 수 있게 되기 때문이다.

   include 디렉티브 태그   

   include는 단어 뜻 그대로 '포함하다' 라는 뜻이다. file 속성에서 해당 페이지에 포함시키고자 하는 파일명을 입력해주면 되는데, 여기서 포함 가능한 대표적인 파일로는 HTML, JSP, TXT 등이 있다. 여기서 텍스트 파일은 인코딩 문제가 빈번하게 발생하니 꼭 필요한 것이 아니라면 HTML파일로 사용하는 것을 추천한다.

   말 그대로, 해당 페이지에 가져온 파일 내용을 그대로 붙여넣는 것이기 때문에 코드를 직접 입력 하는 것과 큰 차이를 알 수가 없을 것이다. 하지만 이런 기능을 활용하는 이유는 웹 사이트에서 공통된 부분을 별도의 파일로 만들어 관리하면서 페이지를 모듈화 할 수 있기 때문이다. 별도의 파일로 만들어 include로 포함시키게 되면 추후 수정할 부분이 발생하여도 그 파일만 수정하여 모든 곳에 자동적으로 업데이트가 가능함으로써 매우 중요한 부분이라고 볼 수 있다.

   taglib 디렉티브 태그   

   taglib은 사용자 정의 태그(라이브러리)를 설정할 수 있는데, java언어도 사용할 수 있는 jsp파일에서 html태그로 특정 함수를 표현할 때 사용된다. 이 태그를 사용하기 위해서는 WEB-INF의 lib폴더에 jar(java파일 묶음) 라이브러리 파일이 있어야 사용할 수 있다.

      uri는 경로를 나타내고 prefix 속성은 사용자가 정의한 태그를 식별하기 위한 고유한 태그 네임이다. java의 기능을 그대로 가져온 것을 HTML형식으로 작성하는 게 오히려 더 힘들 수 있는데도 사용하는 이유는 HTML문서 특성상 수천줄에 달하는 내용을 보기 쉽게 관리하기 위해 사용되기도 한다.

   < Book-Market 사이트 만들어보기 ② >   

   기존 메인화면에 작성되어 있던 내용물은 다른 페이지에서도 반복되기 때문에 내용물을 다른 jsp파일로 옮기고 include태그를 사용하여 페이지 모듈화를 진행시킨 상태이다.

   HTML과 Java를 어느정도 익힌 다음이라면 JSP는 그리 생소하지 않을 것이다. JSP는 웹이 동작하는 방식에 있어 정적으로 움직이는 HTML에 Java의 동적인 움직임을 더한 웹프로그래밍 언어이다. 물론 HTML은 Java를 읽어올 수 없기 때문에 JSP는 Java의 기능을 숫자와 문자로 바꾸어 HTML(View)에 보내 클라이언트 화면에 송출하는 역할을 한다. 여기서 JSP를 사용하기 위해서 필요한 도구로는 아파치/톰캣이 있다.

   아파치와 톰캣은 엄연히 다른 도구지만 보통 묶어서 함께 사용한다. 아파치는 클라이언트의 요청을 받으면 HTML이나 오브젝트(JavaScript)를 전송하는 역할을 하는데, 웹 서버 자체만으로 처리하지 못하는 요구사항은 컨테이너처럼 처리할 수 있는 곳으로 넘겨주는 역할도 한다. 여기서 이 컨테이너 역할을 하는것이 바로 톰캣이다. 톰캣에서는 JSP 파일에서 Java항목만 따로 빼내어 컴파일을 진행한 후(.jsp → .java → .class), 그 결과를 웹 서버에 전달하는 역할을 한다. 즉, 정적인 HTML에 Java의 기능을 넣어 동적으로 수행하는 역할을 하는 것은 톰캣이라고 할 수 있다.

   그렇다면 지금부터 JSP를 활용한 프로그래밍을 위해 첫 시작을 해보도록 하겠다.

   먼저 이클립스를 사용했던 것 처럼 프로젝트를 생성해야 하는데, 여기서부터 살짝 다르다. [File] - [New] - [Dynamic Web Project] 를 눌러 웹 페이지 제작을 위한 프로젝트를 만든다. 만약 해당 탭에서 찾지 못할 경우 New탭 맨 아래에 있는 Other을 통해 Dynamic을 검색하여 생성할 수 있다.

   프로젝트 이름을 지정하고 사용하고자 하는 아파치톰캣의 버전을 지정한 후, Next를 눌러 넘어가서 마지막에 web.xml파일을 만드는 항목에 체크를 해주면 기본 작업은 끝이다. web.xml파일은 기본적으로 웰컴파일 리스트를 제공해주는데, 프로젝트를 Run시킬 때 가장 먼저 화면에 나타날 파일의 목록을 나타낸 것이다. JSP를 다루는데 능숙해지고 웹사이트를 만들게 되면 굳이 필요하진 않지만 아직은 걸음마 단계이니 꼭 포함시켜주도록 하자.

   간단하게 알아보기 위한 기본적인 메인화면을 만들어준다. 여기서 html 파일의 이름은 web.xml의 웰컴 파일에 명시되어 있는 파일명으로 해야 프로젝트를 Run했을 시 에러없이 화면에 나타날 수 있다. 파일명을 바꾸고 싶다면 web.xml 파일에서 이름을 수정하면 되니까 꼭 index.html을 사용할 필요는 없다.

   여기서 a태그에 first와 second를 주소로 입력해두었다. 이는 상대주소로, 현재 프로젝트(jsp_examle)안에서 webapp폴더에 작성되어 있는 first클래스를 참조하라는 의미가 된다. 프로젝트 내부에도 다양한 폴더가 존재하지만 바로 webapp폴더로 가는 이유는 그 폴더가 사실상 프로그램의 시작점이기 때문이다. 그러니 주소는 jsp_example/webapp/first가 아니라, jsp_example /first가 되는 것이다. 그렇다면 주소는 지정되었으니 실제로 연결까지 해보는 과정을 알아보자.

   java폴더로 들어와 하나의 패키지를 생성하고 그 안에서 새로운 클래스를 만든다. 먼저 컨트롤러가 될 cont1 클래스에 HttpServlet클래스 상속이 제일 먼저 이루어져야 한다. 그렇게 되면 toGet()과 toPost()함수를 오버라이딩 할 수 있는데, 이는 HTML시간에도 배웠던 데이터 전송을 위한 주요 방법이다. 일단 전송방식이 이번 수업의 큰 비중을 차지하는 것은 아니니 넘어가고, 마지막으로 서블릿매핑을 끝내주면 HTML에서 작성한 주소 하나를 만들게 되었다.

   이제 주소의 끝이 first가 되면 해당 클래스로 들어와 toGet() 혹은 toPost()를 실행하여 내부에 작성된 함수가 실행되게 된다. 이 때, 다른 사이트로 넘어갈 수 있도록 다른 파일의 상대경로를 지정해주면 해당 파일이 실행된다.

   연결해준 파일을 살펴보도록 하자. HTML의 구조를 지니고 있음에도 살짝 다른 jsp파일이다. jsp에는 HTML코드와 Java코드를 모두 사용할 수 있다는 특징이 있는데, HTML에서 Java언어를 바로 해석할 수 없기 때문에 스크립트 태그가 따로 필요하다.

   스크립트 태그를 활용하면 HTML문서 내에서 Java코드 입력이 가능하지만, 그렇게 잘 쓰이는 방식은 아니라고 한다. 애초 Java파일을 따로 작성하여 연결하면 되는 일이기 때문인데 그래도 아예 쓰이지 않는 것은 아니니 실습을 진행해보았다.

   <%> 단일 태그는 특정 함수 안에서 로직 코드를 작성할 수 있다고 했는데, 여기서 그 특정 함수란 _jspService() 메서드를 가리킨다. 해당 함수 내에서 로직을 구성하고 출력할 때는 내부에서 print()함수를 사용하거나 <%=> 단일 태그를 활용하는 방법이 있다. 왼쪽 로직은 for문을 활용해 연속적인 출력 작업을 진행했고, 오른쪽 로직은 선언된 지역변수를 활용해 각 변수를 더한 값을 출력하는 작업을 진행했다. 즉, 지역변수를 활용할 수 있는 <%=> 태그 또한 _jspService()메서드에 포함되어 있다는 뜻이다.

   이제 HTML의 a태그와 first.jsp가 제대로 연결되어 동작하는지 프로젝트 Run의 실행을 통해 확인을 해보자.

   이렇게 정상작동이 되는 것을 확인할 수 있다. 여기서 중요한건 주소인데, 실제로 주소창에 입력되는 주소는 서블릿매핑의 주소인거지 파일 위치의 경로를 나타내는 것이 아니다. 여기서 하나의 예시를 들어보기 위해, jsp파일의 위치를 webapp이 아니라, webapp내부에 폴더를 생성하여 그 폴더에 jsp파일을 집어넣고 연결을 시켜보도록 하겠다.

   위에서 진행했던 예제와 똑같은 방식으로 작성하고, 이번에 연결될 파일의 위치가 폴더로 옮겨갔기 때문에 폴더명을 먼저 써준 뒤에 불러오고자 하는 파일을 붙여주었다. 이렇게 실행하게 되면 주소창에 프로젝트명 뒤에 chapter02/exam2-1.jsp가 그대로 출력되는 것이 아니라, a태그로 연결된 값이 주소창에 나타나게 되어 localhost:8080/jspbook/ex2-1 이 되는 것이다.

   여기서 localhost는 사용자의 DNS주소를 가리키는 것이고, 콜론 뒤 8080은 인터넷 포트를 의미하는 것이다.

   < Book-Market 사이트 만들어보기 ① >   

   이제 HTML과 Java를 이용하여 동적인 웹사이트를 만들어 보기로 했다. 먼저 가장 기본 화면이 될 메인 화면을 제작하는데, 기존에는 HTML과 CSS를 만들어 적용했던 것을 부트스트랩을 사용하여 좀 더 간편하게 CSS효과를 줄 수 있는 방법에 대해 알아보았다. 아직 처음 사용하다 보니 지정할 수 있는 속성에 대한 클래스를 외우지 못해서 사용함에 있어 거부감이 느껴지는 방식이었지만 막상 만들어진 결과물을 보면 익혀두는 것이 좋을 것 같단 생각이 든다.