본문 바로가기

기술자료/Web

[Google Apps Engine] JSP 사용하기

원본글 : http://code.google.com/appengine/docs/java/gettingstarted/usingjsps.html


Java 서블릿 코드로만 직접 HTML 코드를 작성하여 구성하려면, HTML에 대한 관리 작업이 무척 어려워 질 것입니다. 그래서 템플릿 시스템을 활용하면, 인터페이스에 대한 디자인과 구현을 데이터 추가와 같은 로직과 분리하여 응용 프로그램과는 다른 파일로 구성하실 수 있습니다. Java에서도 다양한 템플릿 시스템이 있으며, App Engine에서는 대부분의 시스템들과 정상적으로 동작합니다.


이 튜토리얼에서는 JavaServer Pages(JSP)으로 방명록에 대한 사용자 인터페이스를 구현하려 합니다. JSP는 서블릿 표준에 의거하여 제공됩니다. App Engine에서는 자동적으로 WAR에 있는 JSP 파일을 컴파일 하고, URL 경로에 연결하게 됩니다.


Hello, JSP!

방명록 응용 프로그램에서는 출력 스트림에 직접 문자열을 쓰고 있는데, 이 부분을 JSP로 변경하도록 합니다.  JSP 예제로 제공되는 최신 버전을 가져와서 시작하도록 하죠.


war/ 디렉토리에서 guestbook.jsp라는 이름의 파일을 생성하고, 다음과 같은 내용으로 구성해보시기 바랍니다.


<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ page import="com.google.appengine.api.users.User" %>
<%@ page import="com.google.appengine.api.users.UserService" %>
<%@ page import="com.google.appengine.api.users.UserServiceFactory" %>

<html>
  <body>

<%
    UserService userService = UserServiceFactory.getUserService();
    User user = userService.getCurrentUser();
    if (user != null) {
%>
<p>Hello, <%= user.getNickname() %>! (You can
<a href="<%= userService.createLogoutURL(request.getRequestURI()) %>">
sign out
</a>.)</p> <% } else { %> <p>Hello! <a href="<%= userService.createLoginURL(request.getRequestURI()) %>">
Sign in</a> to include your name with greetings you post.</p> <% } %> </body> </html>

기본적으로 war/ 내 여러 파일, 하위 디렉터리(WEB-INF/ 외의 디렉터리들)을 탐색하여, .jsp로 끝나는 파일들을 자동적으로 URL 경로에 연결하게 됩니다. 이 URL 경로라는 의미는 .jsp 파일이 있는 경로입니다. 그래서 JSP 자체의 경로는 URL 경로 뒤에 파일 이름까지를 의미하게 됩니다. 이 JSP 파일은 war/ 바로 밑에 있게 되므로, URL이 /guestbook.jsp 가 되게 됩니다.


만일 사용자가 URL 경로를 / 만 입력하게 되면(즉 파일이름을 없애고 입력하는 경우), 방명록 응용프로그램에 있는 home page를 호출하게 됩니다. 이 guestbook.jsp 를 홈페이지로 등록하시고 싶다면, web.xml 내에서 이 경로에 대해 정의를 해주시면 됩니다.

web/WEB-INF/web.xml을 열고 <welcome-file-list> 항목 안에 <welcome-file> 이라는 항목을 추가한 뒤, 저장해주시면 됩니다. 이 guestbook.jsp 파일만 홈페이지로 사용하려면, 기존에 있는 index.html 을 삭제해주시면 됩니다. 이렇게 편집한 부분을 간단하게 보시면 아래와 같습니다.

<welcome-file-list>
    <welcome-file>guestbook.jsp</welcome-file>
</welcome-file-list>
TIP : Ecipse 에서 XML을 편집할 때, 위와 같은 코드로 바로 보이지 않을 것입니다. 기본적으로 “Design” 모드로 시작되기 때문인데, 만일 위와 같은 소스로 보시려면 “Source” 모드로 변경하시면 위와 같은 코드를 보실 수 있습니다.

수정이 완료되었으면, 개발용 웹서버를 중지 시켰다가 다시 시작한 뒤, 다음 URL을 입력하시기 바랍니다.

http://localhost:8080/guestbook

(간혹 설정 상으로 http://localhost:9999/guestbook 일 수도 있습니다.  - 포트 번호는 각자 확인해보시기 바랍니다. )

 

이제 응용프로그램에서는 guestbook.jsp에 내용을 보여줄 것입니다. 만일 로그인 되셨다면, Nickname을 표시할 것입니다.

맨 처음 JSP를 실행하면, 개발 서버에서는 JSP를 Java 소스코드로 변경 시킵니다. 그리고 난뒤 Java 소스 코드를 Java bytecode로 컴파일 하게 됩니다. Java 소스와 컴파일 된 클래스들은 임시 디렉터리에 저장됩니다. 만일 원래 JSP 파일을 변경하게 되면, 개발 서버에서 자동적으로 JSP들을 재생성하고, 컴파일 하게 됩니다.

App Engine으로 응용 프로그램을 업로드 하게 되면, SDK에서 모든 JSP내용들을 bytecode로 컴파일하고, 이 컴파일 된 bytecode만 업로드 하게 됩니다. 즉, App Engine에서 동작중인 응용프로그램은 이미 컴파일 된 JSP 클래스들입니다.


방명록 Form

방명록 응용프로그램에서 새 인사말을 올리는 작업을 하려면, 사용자 입력 받을 수 있는 웹 폼이 필요합니다. HTML 기반의 폼은 JSP로 만들 수 있습니다. 여기서는 입력 폼의 위치를 새로운 URL, /sign 으로 구성하여, 이곳에서 새로운 서블릿 클래스로 동작할 수 있게 해줍니다. SignGuestbookServlet.SignGuestbookServlet에서는 값을 입력하는 폼 관련 처리를 수행한 뒤, 자동적으로 /guestbook.jsp 로 리다이렉트 될 수 있도록 합니다. 지금부터 새로운 서브릿에서는 등록된 메시지를 로그로 기록할 수 있게 합니다.


guestbook.jsp를 연 뒤, </body> 태그 위에다 아래의 코드를 넣어주시기 바랍니다.
( 굵게 표시된 <form> .. </form> 부분만 넣어주시면 됩니다. )

...

  <form action="/sign" method="post">
    <div><textarea name="content" rows="3" cols="60"></textarea></div>
    <div><input type="submit" value="Post Greeting" /></div>
  </form>

  </body>
</html>

guestbook 패키지 안에 SignGuestbookServlet 라는 이름으로 새로운 클래스를 만들어주시기 바랍니다. 클래스 내용은 다음과 같이 넣어주시면 됩니다.

package guestbook;

import java.io.IOException;
import java.util.logging.Logger;
import javax.servlet.http.*;
import com.google.appengine.api.users.User;
import com.google.appengine.api.users.UserService;
import com.google.appengine.api.users.UserServiceFactory;

public class SignGuestbookServlet extends HttpServlet {
    private static final Logger log
= Logger.getLogger(SignGuestbookServlet.class.getName());

    public void doPost(HttpServletRequest req, HttpServletResponse resp)
                throws IOException {
        UserService userService = UserServiceFactory.getUserService();
        User user = userService.getCurrentUser();

        String content = req.getParameter("content");
        if (content == null) {
            content = "(No greeting)";
        }
        if (user != null) {
            log.info(
"Greeting posted by user "
+ user.getNickname() + ": " + content);
        } else {
            log.info("Greeting posted anonymously: " + content);
        }
        resp.sendRedirect("/guestbook.jsp");
    }
}

이제 새로 만든 서블릿 클래스를 설정하기 위해 war/WEB-INF/web.xml 을 열어 아래의 내용 처럼 SignGuestbookServlet 이라는 서블릿을 선언한 뒤, /sign URL에 연결합니다.

<web-app xmlns="http://java.sun.com/xml/ns/javaee" version="2.5">
    ...

    <servlet>
        <servlet-name>sign</servlet-name>
        <servlet-class>guestbook.SignGuestbookServlet</servlet-class>
    </servlet>
    <servlet-mapping>
        <servlet-name>sign</servlet-name>
        <url-pattern>/sign</url-pattern>
    </servlet-mapping>

    ...
</web-app>

새로운 서블릿은 java.util.loggin.Logger 클래스를 상속 받아 메시지를 쓰게 됩니다. loggin.properties 파일을 사용하여 이 클래스의 동작을 제어하게 되는데, 시 시스템 속성은 응용프로그램의 appengine-web.xml 파일에 설정할 수 있습니다.

<appengine-web-app xmlns="http://appengine.google.com/ns/1.0">
    ...

    <system-properties>
        <property name="java.util.logging.config.file" 
value="WEB-INF/logging.properties"/> </system-properties>
</appengine-web-app>

서블릿 로그 메시지는 로그 레벨을 INFO 형태로(log.info()를 사용함) 메시지를 기록합니다. 하지만, 기본적으로 출력되는 로그들은 최소한 WARNING 이상이 되어야 하기 때문에, 그냥 INFO로 로그를 기록하면 출력되지 않습니다. INFO 레벨의 로그도 출력되게 하려면, guestbook 패키지 안의 모든 클래스에 대한 로그 레벨을 logging.properties 파일을 열어 그 안에 guestbook.level 엔트리를 다음과 같이 수정해주셔야 합니다.

.level = WARNING
guestbook.level = INFO

...
TIP : AppCfg 라는 도구를 다운 받아 활성화 시켜주시면, App Engine에서는 java.util.logging.Logger API를 이용하여 기록하는 모든 로그 메시지를 the Admin Console 에서도 확인 할 수 있습니다. Admin Console에서도 로그 레벨에 따라 메시지를 찾아 보실 수 있습니다.

 

다시 빌드 하시고, 재 시작하신 뒤, http://localhost:8080/ 에 접속하시면 테스트를 하실 수 있습니다.(다시 또 언급 드리지만, 포트 번호 설정에 따라, http://localhost:9999 일수도 있습니다. 자세한 것은 web.xml에 설정한 포트 번호를 참고하시기 바랍니다. ). 입력 폼이 뜨면, 그 안에 적당한 문자열을 넣으시고 Submit을 해주세요. 웹 브라우저에서 폼에 입력한 내용이 응용프로그램에 전달하게 되면, 자동적으로 깨끗이 빈 폼으로 되돌아가게 됩니다. 이 때 로그 내용을 보시게 되면, 아까 입력한 문자열을 보실 수 있습니다.


다음은…

지금까지 사용자들이 인사말을 입력할 수 있도록 제공되는 사용자 인터페이스를 구성해 보았습니다. 이제 App Engine의 datastore를 사용하여, 사용자들이 입력한 인사말들을 저장하는 방법과, 그 내용을 다른 이들에게 보여주는 방법에 대해 살펴보도록 하겠습니다.


JDO를 이용하여 Datastore를 사용하기에서 계속되겠습니다.