Learn how to create a HTML form that uses the HTTP POST
method to submit
user-provided data to a Java Servlet running on App Engine.
Before you begin
Configure your development environment and create your App Engine project .
Creating a form
Create a HTML form using JavaServer Pages (JSP) .
The following JSP code generates a form to create a blog post. It takes
three text input fields, title
, author
and content
and has a Save
button
that submits the data to the servlet:
< %
@
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
>
This form sends the form data to the handler at the /create
URL. You should
use JSP's escapeXml
functionality to counter cross-site scripting (XSS)
attacks, as shown in the code snippet. Instructions
for creating the form handler are shown next.
Handling form data
Once the user submits the form data, it is handled by a form handler. In the
snippet below, the form handler is a servlet named 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."
);
}
}
Note the annotation @WebServlet(name = "createBlogPost", value="/create")
,
which maps the servlet to the URI where it handles requests: /create
. For
developers familiar with the App Engine Java 7 runtime, this annotation replaces
the mappings that were previously made in the web.xml
file.
Deploying to App Engine
You can deploy your app to App Engine using Maven.
Go to the root directory of your project and type:
mvn package appengine:deploy -Dapp.deploy.projectId= PROJECT_ID
Replace PROJECT_ID
with the ID of your Google Cloud project. If
your pom.xml
file already specifies your
project ID
, you don't need to include the -Dapp.deploy.projectId
property in the
command you run.
After Maven deploys your app, open a web browser tab automatically at your new app by typing:
gcloud
app
browse
What's next
As an extension of handling user data, you might want to use Cloud SQL, Cloud Datastore, or Cloud Storage to store the data:
