시작하기: 양식 데이터 처리

HTTP POST 메소드를 사용하여 사용자 제공 데이터를 App Engine에서 실행되는 자바 서블릿에 제출하는 HTML 양식을 만드는 방법을 알아봅니다.

시작하기 전에

개발 환경을 구성하고 App Engine 프로젝트를 만듭니다.

양식 만들기

JSP(자바 서버 페이지)를 사용하여 HTML 양식을 만듭니다.

다음 JSP 코드는 블로그 게시물을 만들기 위한 양식을 생성합니다. 이 코드는 세 가지 텍스트 입력 필드인 title, author, content를 사용하고, 데이터를 서블릿에 제출하는 Save 버튼을 포함합니다.

<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn"%>
<div class="container">
  <h2>
    Create a new blog post
  </h2>

  <form method="POST" action="/create">

    <div>
      <label for="title">Title</label>
      <input type="text" name="title" id="title" size="40" value="${fn:escapeXml(blog.title)}" class="form-control" />
    </div>

    <div>
      <label for="author">Author</label>
      <input type="text" name="author" id="author" size="40" value="${fn:escapeXml(blog.author)}" class="form-control" />
    </div>

    <div>
      <label for="description">Post content</label>
      <textarea name="description" id="description" rows="10" cols="50" class="form-control">${fn:escapeXml(blog.content)}</textarea>
    </div>

    <button type="submit">Save</button>
  </form>
</div>

이 양식은 양식 데이터를 /create URL의 핸들러로 전송합니다. 코드 스니펫에 표시된 것처럼 교차 사이트 스크립팅(XSS) 공격에 대응하려면 JSP의 escapeXml 기능을 사용해야 합니다. 양식 핸들러를 만드는 안내는 아래에 표시되어 있습니다.

양식 데이터 처리

사용자가 양식 데이터를 제출하면 양식 핸들러에서 처리됩니다. 아래 스니펫에서 양식 핸들러는 createBlogPost라는 서블릿입니다.

import java.io.IOException;
import java.io.PrintWriter;
import javax.servlet.annotation.WebServlet;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

@SuppressWarnings("serial")
@WebServlet(name = "createBlogPost", value="/create")
public class createBlogPost extends HttpServlet {

  @Override
  public void doPost(HttpServletRequest req, HttpServletResponse resp)
      throws ServletException, IOException {

    PrintWriter out = resp.getWriter();

    out.println(
        "Article with the title: " + req.getParameter("title") + " by "
            + req.getParameter("author") + " and the content: "
            + req.getParameter("description") + " added.");
  }
}

@WebServlet(name = "createBlogPost", value="/create") 주석은 요청을 처리하는 URI /create로 서블릿을 매핑합니다. App Engine 자바 7 런타임에 익숙한 개발자의 경우, 이 주석은 이전에 web.xml 파일에서 수행된 매핑을 대체하는 것으로 이해될 수 있습니다.

App Engine에 배포

Maven을 사용하여 앱을 App Engine에 배포할 수 있습니다.

프로젝트의 루트 디렉터리로 이동하여 다음을 입력합니다.

mvn package appengine:deploy -Dapp.deploy.projectId=PROJECT_ID

PROJECT_ID를 Google Cloud 프로젝트의 ID로 바꿉니다. pom.xml 파일에 이미 프로젝트 ID가 지정된 경우 실행할 명령어에 -Dapp.deploy.projectId 속성을 포함하지 않아도 됩니다.

Maven이 앱을 배포한 후에 다음을 입력하여 새 앱에서 웹브라우저 탭을 자동으로 엽니다.

gcloud app browse

다음 단계

사용자 데이터 처리 확장 프로그램으로 Cloud SQL, Cloud Datastore 또는 Cloud Storage를 사용하여 데이터를 저장할 수 있습니다.