Accepting Requests7:12 with Craig Dennis
Now 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 lets go make our new file and we'll call it signin.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 user name, 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 Query perams. 5:20 The value of foo in the query peram. 5:21 So that's what we need to do, right? 5:24 So we're gonna say query perams 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 craigisdennis, and we'll click sign in, 6:37 and it says welcome craigisdennis. 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
You need to sign up for Treehouse in order to download course files.Sign up