Preview
Video Player
00:00
00:00
Accepting Requests
7:12Now that you have sent the responses down to the client, let’s figure out how you can capture their input and kick off a brand new Request/Response loop. You will gather information from the web form we pushed, down to the client.
Okay, so we have a piping hot request
coming in that we need to catch.
0:00
Now when we built that forum,
0:04
we specified that it was going to
be using the HTTP method of post.
0:05
Now that means, instead of placing
the name value pairs in the URL,
0:10
things are going to be submitted
in the body of the request.
0:14
Let's take a look at what was being
sent across and then let's handle it.
0:17
Okay, so
in your browser I'm using Chrome here.
0:22
There's most likely some
sort of web developer tools.
0:24
Now I'm gonna open them
up here real quick.
0:28
What I'm gonna do is I'm gonna choose
view, developer, developer tools.
0:30
And what I'm gonna do is I'm gonna submit
and I'm gonna take a peek here underneath
0:34
this network tab so you can see
the different parts of the page.
0:38
Underneath the network
tab it will show you
0:41
what happens when
the request comes across.
0:44
So I'm gonna click sign in.
0:46
And we'll see here that if 404,
you know, it's not found.
0:48
But if we click it,
we can tell here that, well,
0:52
the different headers that were sent.
0:55
We'll see here that it
was a form URL encoded.
0:56
And you'll see down here
there's a form data section.
0:59
And I click view source, and
that's what went across.
1:01
But this is what it is parsed.
1:04
So, there is a key called username,
1:06
and it's Craig Dennis,
which is what Craig Dennis is.
1:07
Great.
1:10
For more on these tools,
please check the teacher's notes.
1:10
Okay, so
let's take that data from the request and
1:13
provide a custom message
based on what they entered.
1:16
So first,
we need to capture that post request.
1:18
How do you think we do that?
1:23
We have the get that capture get request.
1:26
So why don't we see what
happens if we try post.
1:29
Perfect.
1:33
It is exactly what we thought it would be.
1:33
It's awesome.
I love when APIs work like that.
1:35
So it's complaining here.
1:37
Let's see why.
We are going to static import.
1:39
Post.
1:42
Cool.
1:44
So we'll say post and the name of,
we're doing a sign in.
1:45
And then it takes the same lambda route
1:49
We're gonna return a new ModelAndView, and
for now let's just pass null, and then
1:59
the name of the template which we haven't
created yet we'll call sign-in.hbs.
2:04
Great, then of course it's
our HandlebarsTemplate.
2:08
Okay, so let's go make our new file and
we'll call it sign-in.hbs.
2:16
So, we'll come under templates here,
say new, file, signin.h.
2:21
This is gonna look very similar
2:28
to the html markup that
we did on the index page.
2:33
So if you're starting to
feel your spidey sense
2:37
that we're breaking the dry principle,
the don't repeat yourself, you're right.
2:40
So we'll fix that here in a bit.
2:45
But let's stay focused
on the task at hand.
2:47
So I'm gonna do HTML5 and
I'm gonna press tab.
2:48
And then we'll say welcome or
let's say signed in.
2:52
And then in the body here
let's add some dynamic text.
3:00
We'll add a paragraph and that's a p tag.
3:04
So p, and we'll say welcome.
3:06
And we wanna show the user
name to make it dynamic.
3:10
Now, in handlebars to show that
though you do double mustaches or
3:14
curly braces around a variable.
3:18
Two curly braces, and then we'll
say username, two curly braces.
3:26
Welcome username.
3:29
But wait a second, where is it
getting that data from, you ask.
3:32
Where is the username coming from?
3:34
Well, nowhere right now, right?
3:35
This is the model that we set to null.
3:38
So basically what can happen is you
can pass in any object in here.
3:40
Whether that be a POJO, a plain old
java object, or a map-like object.
3:43
And the template can
access it just like this.
3:48
So let's switch back
over to our main here and
3:52
in sign-in here let's make a new model.
3:55
And we'll just use a simple map for
now, right?
4:02
So we'll say Map, and again,
that's a java.util.Map, and
4:04
it's a String Map of Strings to Strings in
the Java util map, that's what we want.
4:09
Now let's call it model so it's clear.
4:15
And we'll choose
the implementation of a HashMap.
4:18
And I'm gonna use the diamond parameter so
4:21
we don't need to redefine it there, okay.
4:25
Now, let's store the user name
that's submitted from the form.
4:29
So what you do is model.put right so we're
gonna add a new key called user name.
4:34
And then we need to grab from
the request we need to grab
4:40
the value of user name that
was submitted from the form.
4:46
So let's flip back to the spark
documentation and see about the request.
4:50
So here's the documentation.
4:57
And here.
4:59
Look request.
4:59
Okay cool.
5:01
So this shows you all the stuff that
you can pull off of the request.
5:01
This is pretty great.
5:05
Okay so here is something for the body.
5:07
This pulls the request body
that was sent by the client.
5:08
That's not exactly what we want.
5:11
If you remember there was that
weird URL encoded string so
5:14
we want to just access part of it.
5:17
Okay, so here it is.
5:19
queryParams.
5:20
The value of foo in the query param.
5:21
So that's what we need to do, right?
5:24
So we're gonna say queryParams and
then we're gonna pass it username and
5:26
that will pull that off of the request.
5:29
That's a pretty nice subtraction, right?
5:30
So let's go back to our page here.
5:33
And we have req, right?
5:37
Req was passed in.
5:39
That is the request object, and
it has as you'll see, queryParams.
5:42
And we're looking for the username.
5:46
So we're gonna pull the username off,
and we're gonna put it into our map.
5:48
And then in our new model and
5:52
view, we're gonna push in
the model that we just created.
5:53
Cool, so now, I am going to, restart your
server if it's running, mine was not.
5:59
Choose run, actually, mine was.
6:04
So you'll see this sometimes.
6:07
The address is already in use,
you can see here.
6:09
There's two mains running.
6:11
And I'm going to close all.
6:13
And I'm gonna go ahead and choose
disconnect, it will terminate the server.
6:16
And now, let's do that run again.
6:19
You'll know that things are running
because there's a little green
6:24
dot down here.
6:26
So I should have looked
at before I tried that.
6:27
Okay, so now,
let's come back over to our page,
6:29
and we'll say what is your username?
6:34
and it's craigsdennis,
and we'll click sign in,
6:37
and it says welcome craigsdennis.
6:39
Bam, now we have some faked-out state,
right?
6:42
Pretty straightforward too, wasn't it?
6:47
Query parameters are pretty powerful.
6:49
You should also know that when
the URL has a question mark,
6:51
you all have access to those variables
in the request.query params.
6:54
So now that we have
access to the username,
6:59
because they submitted it on the page
before, does that mean we're gonna
7:01
need to ask their name on every
page in order to have it available?
7:04
Let's explore a solution to this
problem right after this quick break.
7:08