Preview

Start a free Courses trial
to watch this video

Sign up for Treehouse

The Request Object

4:29 with Andrew Chalkley and Joel Kraft

A closer look at Express's Request object.

Teacher's Notes
Video Transcript
Downloads

HTML Forms

Sending form data (MDN)
HTML forms (MDN general form page)

Documentation

What `body-parser` Does Under the Hood

What is body-parser doing? In case you're curious, here's a little code that reads the body of an incoming request and logs it to the console. This is just a flavor of how using body-parser is making your life easier!

  let bodyString = ''
  req.on('data', chunk => bodyString += chunk.toString());
  req.on('end', () => {
    console.log(bodyString);
  });

Note that even after bodyString has been read completely, it still needs to be turned from a string into data your application can use, all of which is taken care of by body-parser.

Remember when we wrote out first route by hand and had to use a request and 0:00

response object for the route handler. 0:05

We've been using the response object to return a response to the client. 0:08

But we haven't been using the request object yet, apart from declaring it. 0:12

Let's look at the express documentation for the request object. 0:18

There are quite a few properties that you can access on the request. 0:22

The one we're most interested in is the body property. 0:28

This is where our form response will end up. 0:33

Notice though, that by default it is undefined. 0:36

To put the form responses into the body, we'll need what is called Middleware. 0:41

Middleware is basically some code that fits in the middle of a request or 0:47

a response. 0:51

Middleware does something to the incoming data and 0:53

hands the result of to the rest of your application. 0:56

We'll look more deeply at Middleware later in this course. 1:00

But we don't really need to know a lot about it yet. 1:04

I will show you how to install some middleware in a moment. 1:06

First, though, 1:10

let's use the console to take a look at the request object more closely. 1:11

In the app.js file, 1:16

I'll add a line in the post route to print out the request object to the console. 1:19

I'll save it and then go back to the browser to create a new request. 1:25

Our code will run. 1:31

I don't need a name right now, and I'll click on Submit. 1:34

Moving to the console where Express is running, 1:39

you can see that the request object includes a lot of information. 1:41

We will look too closely at the request. 1:46

I just wanted you to get an appreciation for 1:48

the amount of work expressed as to simplify our job as developers. 1:51

Most of the time, we don't need many of these properties. 1:56

We'll just access a select few. 1:58

I'll clear this screen, and then we'll switch back to the app.js file. 2:02

I'm just going to examine the body property now. 2:06

If I submit the form now using my name And switch to the console, 2:11

as you can see, I get undefined, just as the documents promised. 2:19

Let's install the middleware, called for by the docs. 2:25

It's called body parser and it will process the incoming form submission data 2:30

into a format that's easier for our program to read. 2:34

I'll go to the terminal and then I'll type, 2:39

npm install body-parser. 2:45

When that's done, I can require it in my app.js file at the top. 2:51

Now, we'll tell Express to use it. 3:09

Body-parser contains several parses, the different ways the clients can send data. 3:12

HTML forms normally encode the data they send the same way URLs do. 3:19

So, we'll need to use the urlencode parser. 3:25

We'll pass in an object, turning 3:32

off the parser's extended option. 3:37

Don´t worry too much about this line of code. 3:46

To be honest, 3:49

I have to look this up everytime I need to include it in my Express applications. 3:50

I've included more information about how forms and data and 3:56

how body-parser works in the teacher's notes. 3:59

Now, let's submit a name. 4:03

In the console, you can see the body property has now a username property. 4:06

Our app is now able to understand the information it's getting from our form. 4:14

Next, we'll use that information to send something meaningful back to the client. 4:19

While we do this, let's take a closer look at the response objects in the next video. 4:24

You need to sign up for Treehouse in order to download course files.

Sign up