Check out a free preview of the full Networking and Streams course

The "HTTP and Headers" Lesson is part of the full, Networking and Streams course featured in this preview video. Here's what you'd learn in this lesson:

By showing a simple page request to Google from the command line, James introduces the Hypertext Transfer Protocol (HTTP), which is how web servers and browsers communicate with each other.

Preview
Close

Transcript from the "HTTP and Headers" Lesson

[00:00:00]
>> Okay, so one thing that we can try is we can try to speak with our typing meat fingers, the HTTP protocol. So this is how your browser communicates with a web server. It's a fairly, I don't want to call it a simple protocol, but it's an easy protocol to type out.

[00:00:22]
Because HTTP, as we know it today, evolved from something a lot simpler and it still uses fairly readable, fairly understandable and fairly tolerant, text based format. The main thing to know about HTTP is that it operates on different kinds of verbs. So the main idea, and of course, you can take these verbs and use them for whatever purpose you want.

[00:00:51]
But the way that you're supposed to use it is, you typically use a GET request to fetch something to retrieve a document. You typically use a POST to send data like a form submission and you're supposed to use it to upload a file. Although it's also common to use a POST for that, because different kinds of network proxies and things of that sort will sort of drop anything that's not a GET or a POST request a lot of the time.

[00:01:24]
You can fetch metadata with HEAD, there's also delete and options and all kinds of other stuff that's kind of less used these days. The other thing that we need to know about HTTP is it works on this sort of key value idea about headers. So how this looks is on the left, you have a key, it's just some string and then you have a colon.

[00:01:51]
And usually a space but it's not required and then you have the values, so an example of what that might look like is. Here we have an HTTP verb, that's gonna GET /, so you could do this right now if you like. You could type in nc google.com 80, you could try GET / HTTP/1.0.

[00:02:16]
And then this is gonna be a header Host: google.com. And what this host header does is it tells the server google.com what a domain you're trying to access. Because when you connect to a server, that server might actually be serving multiple domains. Or it might be like a load balancer that needs to know which server to sort of forward with your connection to behind the scenes.

[00:02:48]
So that's what the host header does, and then hit return twice as well, after you do the host. Because that's how the block of the HTTP verb in the headers is separated from. That's how that's how the server knows that you're done kind of, so let's try that out.

[00:03:08]
So the GET / HTTP/1.0 and then Host google.com, Enter, Enter and I get back a response from the server, yeah, a question?
>> Yeah, just was that whole thing the header, like including the GET and HTTP version, or just the host?
>> This part is the header so you can have multiple different headers and then once you're done specifying the headers.

[00:03:34]
Then you do two new lines, you hit Enter twice, yeah, double tap the Enter. And then, so we get back in this case a response from google.com. And Google, in this case, is sending, so this is the status code right here after HTTP/1.0. So it sent us 301, which is the HTTP code for redirect, I think a permanent redirect, if I'm not mistaken, yeah, moved permanently.

[00:04:00]
And then Google is sending some HTTP headers of its own, so these are all of the headers right here. One of these headers called location tells us, you need to go over here to HTTP, whatever, www.google.com. Why do you have to do that? I don't know, that's just how they set it up.

[00:04:18]
It also tells us some other things like the content type of this document, which is HTML in UTF-8, tells us some other stuff like the date, I guess. Sometimes that's useful for doing cache control, different kinds of expired different kinds of knowing when you ought to fetch the next version of something.

[00:04:42]
Because the server might know something about when the new documents are gonna be up. And another stuff, they aren't too important usually, content type is in location and content length are the most important ones. There's also ways of doing chunked encodings, so in this case, Google is telling us that the body which is down here.

[00:05:07]
If I scroll down a little bit is gonna be 209 bytes, so it hits return twice on its machine keyboard. First right here with this empty line, and then it starts sending its response, so this is all of the HTML that it sent us. This particular thing is, in case your browser doesn't know how to understand the location header, then you'll get a link you can click on.

[00:05:36]
Okay, so we can do some other stuff, for example, if you wanna fetch other kinds of documents instead of getting /, we could do something like GET /favicon.ico. For example, that's usually defined, I think I have one of those on substack.net if you wanna try that. So if I do GET /favicon.ico HTTP /1.0 Host: substack.net and Enter Enter.

[00:06:09]
I don't actually have one cuz I get this status code 404 which you might recognize from using the internet, file not found. So I guess I don't have one that's /favicon.ico. A lot of websites do, you'll probably get a bunch of binary garbage in your terminal because it's probably like a PNG file or something like that.

[00:06:29]
Or maybe it's like a Windows bitmap cuz it's what ICOs are.

Learn Straight from the Experts Who Shape the Modern Web

  • In-depth Courses
  • Industry Leading Experts
  • Learning Paths
  • Live Interactive Workshops
Get Unlimited Access Now