프로그래밍/웹 프로그래밍

05. HTML -> JSP -> Java Class

산을좋아한라쯔 2015. 1. 30. 11:44
반응형

 

이번 장은 앞장 샘플의 연속으로, HTML에서 사용자 입력을 받고, 이 값이 JSP파일에 전달되고, JSP파일에서는 작성된 자바클래스 객체를 생성하고 호출하는, 그런 프로그램을 작성한다.

요는, 임의로 자바 클래스를 만들고 이 클래스를 JSP에서 호출되는 구조를 연습하는 것.

 

구조는 다음과 같다.

 

html파일의 경우는, 앞 장의 프로그램과 똑 같다. 이름을 입력할 수 있는 Text박스가 있고, '입력 완료'버튼을 누르면 텍스트박스에 입력된 값이 UserInputTest.jsp로 전달된다.

UserInputTest.jsp파일의 내용은 앞 장과 좀 다르게 되는데, 앞 장에서는 전달받은 이름을 그대로 화면에 표출하는 구조였는데, 이번에는 새롭게 만들 자바클래스인 TestObject클래스의 instance를 전달받은 이름을 건네주면서 만들고 - new TestObject(name) - , getName()이라는 메서드를 호출해서 다시 이름을 받아내어 출력하는 구조.

 

작성해 보자.

 

0)앞 장에서 작성한 UserInputTest 프로젝트를 사용한다.

 

1)TestObject.java 작성

앞장의 UserInputTest 프로그램과 가장 다른 점이, 우리가 임의로 작성하는 자바 클래스를 jsp에서 호출하게 하는 것이다. 이 자바클래스를 만들어 보자.

 

구조는 간단하게,

  • 생성자의 파라미터로 name을 입력받고,
  • getName()이라는 메서드가 호출되면, 생성할 때 받은 name을 리턴하게.

    다음 순서대로 TestObject.java 코딩.

    • Eclipse 실행
    • 왼쪽편에 있는 Project Explorer에서, 앞 장에서 작성한 UserInputTest프로젝트를 선택하고 마우스 우클릭. New/Class 선택
    • Package: test    Name:TestObject 로 하고 Finish
    • TestObject클래스를 아래 내용처럼 코딩하고 저장

    package test;

     

    public class TestObject {

            String mName="";

            public TestObject(String name){

                   this.mName = name;

            }

           

            public String getName(){

                   return mName;

            }

    }

     

    2)UserInputTest.jsp 수정

    UserInputTest.jsp를 열고, 아래 사항 추가

    <%@ page import="test.TestObject" %>

     

    <%
     TestObject testObj = new TestObject(nameStr);
     String msg = testObj.getName();
    %>

     

    수정완료된 UserInputTest.jsp파일 내용은 다음과 같음.

    <%@ page language="java" contentType="text/html; charset=EUC-KR"

        pageEncoding="EUC-KR"%>

    <%@ page import="test.TestObject" %>

      

    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

    <html>

    <head>

    <meta http-equiv="Content-Type" content="text/html; charset=EUC-KR">

    <title>Insert title here</title>

    </head>

     

    <%

    request.setCharacterEncoding("euc-kr");

     

    String nameStr = request.getParameter("nameText");

    %>

     

    <body>

    <%

            TestObject testObj = new TestObject(nameStr);

            String msg = testObj.getName();

    %>

    이름은 '<%=msg %>' 입니다.

     

    </body>

    </html>

     

    • UserInputTest.html은 앞 장에서 작성된 것과 동일. 내용은 다음과 같음.

    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Strict//EN" "http://www.w3.org/TR/html4/strict.dtd">

    <html>

    <head>

    <meta http-equiv="Content-Type" content="text/html; charset=EUC-KR">

    <title>Insert title here</title>

    </head>

    <body>

    <form method=post action="UserInputTest.jsp">

    이름 <input type="text" name="nameText" />

    <p>

     

    <input type="submit" value="입력 완료" />

    </form>

    </body>

    </html>

     

    3)테스트

    TestObject.java와 UserInput.jsp, UserInput.html 이 모두 작성되었으면, 동작시켜 보자

     

    • UserInputTest.html을 선택하고 마우스 우클릭. 'Run As / Run on Server' 선택
    • UserInputTest.html이 실행된 화면에서, 이름 옆 텍스트박스에 "성춘향" 입력하고 '입력 완료' 버튼 클릭
    • 아래와 같이 UserInputTest.jsp가 실행되면 성공.

    4)WAR 파일로 배포해서 테스트

    Eclipse개발 폴더가 아닌, 톰캣 밑에 jsp파일과 jar파일들이 놓여서, 외부 Browser로부터 접근되서 실행되는 구조가 되게 하려면, 개발된 프로젝트를 WAR로 묶어서 톰캣 설치 폴더 밑에다 놓으면 된다. 작업순서를 차례로 보자.

     1)Eclipse에서 UserInputTest프로젝트를 선택하고 마우스 우클릭. Export/WAR File

     2)Destination을 톰캣 폴더 밑 'webapps'로 지정하고 Finish



     3)이제, Monitor Tomcat을 이용해서 Tomcat서비스를 다시 시작하면, webapps폴더 밑에 'UserinputTest'폴더가 생긴다.



     4)웹 브라우저에 http://localhost:8080/UserInputTest/UserInputTest.html 를 치고 테스트하면 된다.

     

    -끝-

     

    반응형