In this lesson, we'll look at what it's like sending forms in HTTP. We will work with a local server, as it is difficult to use third-party servers to test our lessons on them. Basically, you can experiment on any available server. Just make sure that it works over HTTP and not HTTPS, because the interaction happens a little differently with HTTPS and telnet alone won't be enough.
When submitting a form, we send some data and, since HTTP doesn't provide any special places for sending data from forms, they get sent in the request body. However, the way the data will be encoded when sending is interpreted depending on which Content-Type header is set. The following format is usually used - Content-Type: application/x-www-form-urlencoded. This is a simple format — the key is equal to the value and the ampersand between them.
login=smith&password=12345678
This simple method allows us to continue the string, passing as much data as we want. Now let's try to make a request to our local server.
telnet localhost 8080
POST /login HTTP/1.1
Host: hexlettesthost.com
Content-Type: application/x-www-form-urlencoded
Content-Length: 29
login=smith&password=12345678 # sending the data
HTTP/1.1 200 OK
X-Powered-By: Express
Connection: close
Content-Type: text/html; charset=utf-8
Content-Length: 7
ETag: W/"c-r0WEeVxJ7IpMIG20rN7HX9ndB4c"
Date: Thu, 09 Jul 2020 03:32:54 GMT
Done!
Connection closed by foreign host.
After sending, the server, having received the 29 characters that we specified in Content-Length, immediately sends us an HTTP/1.1 200 OK, in body response, with the word Done!
. in the body As you can see, the response also has Content-Length equal to 7
.
There are a few more features that you need to know when working with forms in HTTP. The first of them is related to encoding. Since this is a text format, you may accidentally let ambiguities slip through. Suppose a password uses the =
sign.
login=smith&password=1234=5678
How do you parse this result correctly? It's possible that the server will understand what we're sending, since parsing occurs from left to right, but this isn't guaranteed by anything. Moreover, there may also be special characters in the field name. Therefore, everything sent to the server must be encoded. Usually, it's browsers that do the encoding. But in general, if you write some scripts and the libraries you use don't care about it, you should do the coding. The encoded symbol =
looks like this — %3D
and it doesn't matter whether the request is POST or GET. You can often see such encoded sequences of characters in the browser's address bar. A body with an encoded =
sign is given in the example below:
login=smith&password=1234%3D5678
Another feature is related to the fact that sometimes we need to send nested data. For example, an array of options. In this case, the body may look like this:
user[login]=smith&user[password]=12345678
The catch is that HTTP doesn't know how to work with this sort of data. Their processing is handled by middleware. But if, for example, you're writing your own server implementation, you will have to parse this data yourself.
In addition to the usual key=value encoding, there are other formats, but the most popular one nowadays is the JSON format. It has quite a lot of advantages, including:
At the moment, it's considered the standard for the exchange of information between services on the Internet. A JSON string looks like this:
{
"firstName": "John",
"lastName": "Smith",
"children": [
{
"firstName": "Max",
"lastName": "Smith",
},
{
"firstName": "Annie",
"lastName": "Smith",
}
]
}
To send data in this format, we use the Content-Type: application/json.
The Hexlet support team or other students will answer you.
A professional subscription will give you full access to all Hexlet courses, projects and lifetime access to the theory of lessons learned. You can cancel your subscription at any time.
Programming courses for beginners and experienced developers. Start training for free
Our graduates work in companies:
From a novice to a developer. Get a job or your money back!
Sign up or sign in
Ask questions if you want to discuss a theory or an exercise. Hexlet Support Team and experienced community members can help find answers and solve a problem.