Advanced PHP HTTP & the POST Method

Hello again, and welcome back to Educator.com's Advanced PHP with MySQL course.0000

In today's lesson, we are going to be doing a review of the HTTP protocol and learning about the POST method.0005

Specifically, we are going to be learning about how the HTTP client/server model works.0013

We are going to talk about HTTP messages and the format of those, which are what gets sent back and forth between0019

a web server and a web browser or web client when a web page is requested.0026

We are going to talk about the format of HTTP requests, which are a type of HTTP message that the client sends to the server when it wants a web page.0031

We are going to talk about the format of the HTTP responses, which is a message that the server sends back to a client when it requests a resource.0041

We are going to talk about a special method in PHP called header, which allows you to set something known as HTTP headers.0050

We are going to learn more about what those are as the lesson goes on.0057

We are going to cover a review of the GET method and how that works, and how it looks in an HTTP request.0060

And we are also going to learn about a new method, which is used for form submission, that is like GET; but it is called the POST method.0066

And we are also going to talk about how to access data submitted on a PHP form via the POST method.0074

And then, we'll end with a quick discussion of the slight differences between GET and POST methods.0082

First of all, HTTP, as you hopefully know, is the protocol that is used to talk between a web server and a web client.0090

So, it describes the rules when a web client requests a web page from a web server, and the web server responds.0097

Essentially, clients request resources or web pages from web servers, and the server responds0107

with the data of that web page, if it is available; or, as we will see, it will respond with an error code.0115

So, the client/server model that the HTTP protocol follows is a two-step process.0121

A client sends what is known as an HTTP request message to the server, which has a specific format.0127

And then, the server responds with an HTTP response message that also has a specified format.0135

Both the HTTP request (that the client sends to the server) and the HTTP response0145

(that the server sends back to the client) have a specified format that they follow.0150

They are known as HTTP messages, and they are composed of two parts.0154

They are composed of a message header, and then they are also composed of (optionally) a message body.0160

The header that is part of each HTTP message is different for requests and responses, as we are going to see.0167

And it can contain multiple lines, and in an HTTP message, you have the HTTP header section,0175

and then it is separated by a blank line from what is known as the HTTP body section.0183

As far as HTTP requests go, that is the message that your client sends to the server when it wants a web page.0192

There is a required first line in an HTTP request; and this right here is an example of what the header of an HTTP request looks like.0198

This first line follows this format up here, where you have to specify a method,0211

the URI you are requesting, and then the HTTP version number that you are using.0217

For this particular HTTP request, we are saying, "Use the GET method to request the index.html file, using the HTTP protocol version 1.1."0223

Now, this is a required line right here; and this line down here is sometimes optional, sometimes not.0239

But you can add different headers to these different files.0249

For example, in this case, we have added the header that says the host is www.educator.com.0252

What that says--this way, the web knows how to route this request to the server to request the index.html file.0258

For example, if we go and take a look at the Educator.com website (and this down here is the Firebug add-on),0269

and if we go ahead and refresh the page, and use what is known as the Net panel of Firebug0277

(and I'm going to go ahead and pull this up a little further), what you can do is select HTML.0287

And that is going to show you all the requests that were made for HTML files.0296

And the first one you can see is a GET request for www.educator.com/index.html.0301

And there are a couple of different sections that Firebug provides.0311

One of them has a tab called Headers, which describes the headers that are included in the HTTP request, as well as in the response from the server.0314

And we haven't learned about the headers in a server response, but we just learned about the request headers.0324

They are shown down here, and if you click on the View Source, you can see what they look like in raw format.0329

And I hope this is big enough for you to see: but you will see that it says it's the GET method, a forward slash, and HTTP 1.1.0336

And in this case, it is just a forward slash, because we didn't request index.html, like we saw in the last example.0348

We just requested whatever file is at the root of the educator.com.0353

You can see that there is a number of what are known as HTTP headers.0357

After this first required line, you can have 0 or more HTTP headers, which provide additional information.0363

In this case, in a request, they provide information to the web server about the particular request.0370

This is saying that it is requesting the root file from www.educator.com.0375

There is a common header that you will see: it's User-Agent, which tells the web server that you are using Mozilla browser, version 5.0.0381

There is a number of different other things that it includes as well--things about the type of encoding you can use, the character sets, and so forth.0390

But essentially, this is the basis of an HTTP request: it has a first line that has0399

the method, the URI, and the HTTP protocol, followed by 0 or more HTTP headers.0403

Now, as we had learned in the last slide, an HTTP message has two parts: it has a header and a body.0411

And for the GET method, there is no message body; so you have the GET header, which is this information contained right here,0419

followed by a blank line; and then there is no body, because there is no information being passed up to the server, in this case.0427

So now, we are going to talk about the response side of things.0437

An HTTP response is a message that a web server sends back to a web client0439

when they request a web page via the HTTP request method that we just learned about.0444

It has a required first line that has a specified format: it must have an HTTP version specified, followed by the status code,0451

followed by what is known as a reason phrase, which is an English interpretation of a status code.0459

Now, you may have heard of status codes before--for example, the 404 status code, which is that,0466

when you request a particular web page at a website, and that resource is not on that web server any longer,0470

HTTP will give you what is called a 404 error; some of you may have heard of that before.0476

This is an example--this section right here--of an HTTP response.0482

You can see, in this first line, we had the HTTP protocol specified; and it is always http, followed by a forward slash, and then the protocol version.0488

You can see that the status code is 200; and 200 means that the file was found, and it is OK, and it is being sent back to the user.0497

And then, OK is just the English version of the 200 status code, which says that it was OK and it found the file.0504

Now, these are examples of a number of HTTP headers that can optionally be added to an HTTP response.0511

A common one you will see is the date header, which says the date and time of when this particular response was generated.0519

And then, you almost always will see a content-type header, which says that the response that the HTTP server is sending back to you--0527

the content it is sending to you is text in the form of HTML.0537

And these are known as MIME types, and there are a number of different ones, depending on (for example)0542

if the web server is sending back a PDF or an image, and so forth.0547

And then, right here, you will typically see the content length, which says how many bytes the file the web server is sending back to the client is.0552

This right here comprises the header of the HTTP response message.0564

Then, it is followed by a blank line; and then, based on whatever web page the user has requested,0570

after the blank line, it is followed by the content of that web page.0577

In this example, if we have a simple web page that just has an HTML and body tags with the Hello string in between it,0581

it is 31 characters in length; it is an HTML file; and that is what these headers0589

tell your web client, when it receives this response back from the server.0597

And then, after this blank line, the client knows that this is the information that it requested--this is the data from the file that it requested.0601

So, if we go back and look at this Educator.com request, you can see that there is a section in this Headers tab for that same thing called response headers.0611

And if we review the source of that, you can see that it says it has the HTTP version, which is 1.1, the 200 status code,0623

along with the English version of that (which is "OK")...0632

As you can see here, it has the date header, and then it has a bunch of other different information.0634

There are all sorts of different headers that you can add to a response.0640

Here you can see that it says the content type was HTML; and in this case, it didn't respond with the length of the content.0643

And then, what you can do is: if you look at this response tab here--this right here is the response header that the Firebug add-on0653

has extracted from the response it received for this particular web page.0661

That is the header of that response; the body, which is the HTML code that you requested, you can see here in response.0666

And this just shows the HTML that is responding, which would be the same as if you (let me pull this down)0671

right-clicked and viewed the source on the particular page--it would be the same source information.0682

So, that is the content of the file that you requested from the web server.0692

And so, that is how the HTTP response looks.0698

So now, I want to talk about a special method in PHP called header.0710

And what that is: it is a built-in function you can call in your scripts that allows you0713

to manually set HTTP headers that you want to send back to the client.0719

What it does--one of the common uses that it is used for is (for example): there is a special header in HTTP, called the location header, that looks like this.0726

And headers have the form where they have the name of the header, followed by a colon, followed by the value.0738

So, they are sort of name/value pairs.0743

And if you look at the Quick Notes for this lesson, you will be able to see a link to the different HTTP request and response headers that are available out there.0746

But the location header: what that does is--if you add that header to an HTTP response, and then you send that response0755

back to the client, when it receives that response, it uses that as a redirect.0763

So, this location is essentially a URL redirection.0767

So, when the client views a PHP page that has this header function call in it that sets the location header to this,0770

when you request that page, it is going to get that response back, and it is going to say, "OK, we need to redirect0780

to this link," which is, in this case, http://www.educator.com.0785

That is one common use of it; but you can use it for any sort of header that you want to add to a file.0793

One very important thing to note is that the header function must be called before any output from the script is generated.0800

For example, as we know, in an HTTP response, there is a header section, and then the body section.0808

PHP will generate all the headers that it needs to send as part of its HTTP response, and then, once it receives output,0815

it starts outputting that as the body of the response.0824

Before you put any output in your script (which would be anything as simple as an HTML tag, because any HTML tag0827

within your PHP script gets sent to output), you have to call the header function before that.0834

Let's take a quick look at a script that uses the header function.0842

This is a simple script called header.php, and it is a script that only contains PHP code.0849

It contains the header method, and it sets the header location to www.educator.com.0855

I'm going to go ahead and look at this on my Firefox web browser.0864

When I request this page, I'm going to get an HTTP response back that is going to have this header in it.0865

And then, my browser is going to know to redirect to this URL.0870

So, if we go and load this page, header.php, even though it is a file on this local web server on my computer,0873

when I click on it, the browser is going to receive that header and know to redirect.0880

And as you can see, it actually redirects back to the Educator.com website.0884

Another example of a file is headerError.php that we have here; and what that does is0892

attempts to call the header method after output for a script has been generated.0898

In this case, as soon as this first HTML character is included in the file, that is considered output.0902

All HTML is output, so if any HTML is output in your PHP file before you call the header method, you are going to get an error.0910

What is going to happen is: when we go and load this page, even though we have called the header function0918

that says "redirect to educator.com," it is not going to happen.0922

We are going to get an error, and we are going to see, "Cannot modify header information: headers have already been sent."0925

And so, that is the error message that you get.0933

And the reason for that, again, is because you have to call the header method before any output occurs.0936

And that can be any text output that is outside of PHP tags, or any echo statements within PHP tags.0941

For example, first of all, let's move the header call up to the beginning of the file.0950

So now, this header function is called before any HTML output has been output by the script.0957

If we go ahead and review the page, and load it up, now we are going to get that redirect that we expected.0964

Now, as I said, any time any output is generated, you can't call the header method.0978

And that includes even PHP echo statements: so, if we echo 'Hello' before this header method,0987

when we run the script, we are going to output Hello, which is generated output.0995

When we try to call header, PHP is going to complain and say "you have already tried to call that; you have already begun output."0999

You can see, it outputs Hello, and then it says, "Warning: you cannot modify the header information."1005

One thing to note is that this functionality, where you have to call header before any output is generated,1011

works when output buffering (which is something that you can configure in your php.ini file) is turned off.1020

For example, if you looked at the php.ini file, and you were to search through it, you would find that there is a directive called output buffering.1027

The default in XAMPP is to set it to 4096, which says that you are turning output buffering on.1034

When output buffering is turned on, then this rule about calling the header method before any output doesn't apply any longer.1041

So, if you tried to run this script on your default XAMPP installation, it would go ahead and redirect to that location,1052

even if the header was called after HTML had begun to be output.1058

You would have to go in here and set it to off, and restart your web server in order to see that.1062

For example, right now, the way the page is, we get this HTTP error.1067

If we go and set output buffering back to what the default value in what the XAMPP config file is,1073

and we restart Apache, now when we try to view the file, it is going to allow that header to be processed,1082

and we are going to get redirected to the Educator.com website.1092

That is something to notice.1095

And by default, in a production server, output buffering is turned off.1097

So, in general, you don't want to use the header any time after output has been created in your script already, unless you really know what you are doing.1103

And there are ways to manually do output buffering, so that even if you have a server that has output buffering turned off,1113

you can still do it so that you can call a header method after text has been generated.1121

But unless you really know what you are doing, you should always call header before any text has been output.1126

As mentioned, a method must be included in the first line of an HTTP request.1137

And we have already been using the GET method for our scripts in our web application1143

for when we go to item.php, and we send the item ID...1149

When we are submitting forms that have our shipping information, we use the GET method in order to do that.1153

And as we know, and learned in the introduction course, the way that works is that any data submitted on a form1160

using the GET method gets appended to the URL via a query string.1167

For example, when we go to item.php, and we want to see item ID 1001's page, the URL we use is item.php?itemID=1001.1173

The way that that works for the GET method is: this is an HTTP request for a GET method1187

that is from a web page that supplies information or form data to the web server.1193

What happens is: you have the GET method listed; you have the URI, which includes the query string,1200

which is the data you are trying to send to the server; it has the version number1207

(as expected), and then any other headers that you include in it.1210

If we go and look at the item.php page on our web store (and I'll start up Firebug), and we refresh the page,1216

we can see here in the Headers tab, if we look at the Request Headers, that it says the GET method was used.1231

And here is the URI to item.php that we requested, and then you can see that it has the data that it was sending1239

via the GET method, via a query string, appended to the URL.1247

And what we are going to see is that that is different from the POST method, in that the POST method doesn't append data to the end of a URL.1252

And so, that is why we are going over how GET works, in that it just appends the data as part of this first line of the GET request.1257

Now, on the other hand, the POST method works differently in that it makes use of the body of the HTTP request message.1270

So, we know from what we learned about the HTTP message in general that there is a header section and a body section, separated by a blank line.1279

When you use the GET method, you don't include any body: you just have the blank line, and the body is empty.1290

With the POST method, what it does: it takes that data that you are submitting via a form1295

(for example, you have an HTML form where you set the method equal to POST); when that form is submitted,1300

the data is, instead of being included as a query string at the end of the URI in this first line of the HTTP request,1308

actually included in the body of the HTTP request.1316

Here, you can see: for the POST method, we have an HTTP request header.1326

It says, "Use the POST method" (let me erase this) "request the contactUs.php page; use HTTP version 1.1."1331

And then, it has some header information: the host header, the date header...1341

It says that, because now there is content you are providing when you submit this web form (you are providing information1348

to the web server), the length of the information in the body is 39.1356

So here, we have an example where we have a form that had a name input and an email input control.1362

And the default action for when you use POST on an HTML form is to URL-encode that data, just like you do for a GET method.1374

So, if we had used GET, this same query string would be appended to the end of here.1382

However, the difference is that it is put down in the body of the POST response.1389

One other thing to note is that (you can see here) it sets the content type to something known as application/x-www-form-urlencoded.1396

What that is saying is: it is telling the web server that the content you are sending in the body of this HTTP request1407

is form data that has been URL-encoded; and so, it will know how to decipher this into the name/value pairs.1415

For example, name=Joe+Smith, and email has the value [email protected].1423

If we go and look, we created a form called postForm.html.1432

It is a form that just has two fields on it, for a first name and a last name.1442

And if we look at the source, it is very simple.1445

It has an action: in this case, we are just going to send the form data that we submit back to the same page.1450

And you can post data to any page; it's just that if it is not posted to a PHP script, for example, you will not be able to do anything with it.1457

For this case, just for educational purposes, we are just going to have it post to the same form.1464

You can see here that the method, instead of being set to GET, is set to POST.1469

And then, you can see, we have two input fields here, with a text field called First Name and a text field called Last Name, and a Submit button.1473

If we go ahead and enter some data and submit it, and look down here at Firebug, we can see, now,1481

that in the Net panel, under HTML, there is a POST request; and it says POST postForm.html.1492

And if we look at the request header by viewing the source, we can see that it says POST, and it just has the name of the HTML file.1503

In this case, when we submitted the form, the action attribute is where you are submitting that form data to.1513

And you are requesting that page and submitting data to it.1519

It is saying, "Get me the postForm.html file, and I'm going to be passing it some data."1523

As you will notice, there is no query string appended here with the form data that was supplied.1529

And this is just a request header, but one thing that Firebug does: it has a POST tab.1536

And what that does is shows you the content that is shown in the body of a POST message.1543

In this case, if we look at the source, we can see that it extracts the HTTP headers that were used to describe the form information you are submitting.1549

So, it says the content type was x-www-form-urlencoded; its length was 28.1562

It is followed by a space, and then it shows the body of this HTTP request.1569

So, when we made this POST request to this form, we included all of the HTTP headers.1575

We included these two headers, describing the content we are providing in the body of the HTTP message.1582

There is a blank line, and then there is the form data--which, you can see, is URL encoded.1588

We know now how the POST method works, and we know that it is a way that you can submit data on an HTML form.1600

It is a way to submit data to a script on a web server.1608

Typically, and for this course where we are learning about PHP, we are going to learn about how PHP script can access that form data.1613

And it works the same way as accessing GET data.1619

There is a superglobal called $_POST, and that contains all of the name/value pairs of any POST variables that were submitted with a particular request.1623

And the way you access is the same way that you would access a GET variable.1635

For example, if we had a GET variable called name that was submitted, and it was equal to John,1639

we know that the way we would access that in our code is using _GET, providing the name of the name/value pair in parentheses,1648

and then (for example) if we echoed that, that would echo the value 'John'.1660

Now, if instead we had a form that had a name input box, as well, but it used the POST method,1666

the same way we would echo the name would be to use an echo statement.1675

But now, we are going to use this $_POST superglobal.1679

In this case, you have to know that your data is coming from a form that uses the POST method.1684

And so, that is how you would access this name POST variable.1689

What we are going to do is make a slight change to our postForm.html form.1696

And then, instead of just submitting the information to itself, we are going to have it submit it to a PHP form that will be able to process that data.1700

We are going to submit it to a script called processPostForm.php.1711

If we take a quick look at that, we can see here that there is a PHP section.1716

And what we have done is extracted from the POST superglobal the firstName POST variable that was supplied to the form.1721

So, this is going to say, "Look in the POST data; get me the value of the POST variable firstName."1735

And then, we are just setting it to a short variable name here, firstName.1741

And we do the same thing for the lastName; we are extracting the value of the lastName variable from the POST data that was submitted.1744

And then, we are just outputting the first name and last name that were provided in a welcome message.1750

So now, when we submit this form (and refresh it, actually--and the reason we are doing that is so, now that we look at the page source,1755

we can see that the action has been updated), it is going to go to processPostForm.php.1768

We will click Submit; it is going to access that form data using the POST superglobal, and it is going to say, "Welcome, Joe Smith!"1777

Now, one thing to notice (that we are going to talk about in a second) is the difference between how GET and POST work.1787

Let's take a look at a slide for that.1793

The GET method is typically used, for example, when you use it to supply data as part of an HTTP request,1797

for a simple resource request, or when you are performing a query or a search--1807

basically, when you are requesting something that doesn't perform any action, or doesn't have what are known as side effects.1812

When you have a form that you submit that is going to cause side effects (for example, maybe it updates a record in a database,1821

or it starts some process in the background--it performs a credit card transaction), you should use the POST method for those.1827

That is in the specifications for HTTP--that any methods that are known as (I hope I say this right) not idempotent,1838

(which means that they do have side effects), you should use the POST method for.1849

So, any time we are submitting a form (for example, on the Contact Us form on our web page, where we are submitting an email),1853

when you submit the information on that form, you are performing an operation.1860

So, that form should use the POST method.1864

Right now, we have just known about GET, so we have been using GET.1867

And it works, but because we are performing an action that has side effects, it should be converted to use the POST method.1869

And there is something to note about this: if we go to refresh this page (and you may see this on websites) we get a warning.1879

It says, "To display this page, Firefox must send information that will repeat any action that was performed earlier."1888

So, this is something that your web browsers know: when you refresh that page, you are saying,1895

"I am going to submit that POST request again for processPostForm.php,"1899

and I am submitting those firstName and lastName variables and their values.1904

Because web browsers know that POST methods are used to perform some action,1913

it gives you a warning that says, "Are you sure you want to do that? Some side effect may happen."1917

That is, for example, why, when you go to certain websites, and you purchase things, and you go to the credit card page,1921

it says "do not refresh the page," because it takes the action of charging your credit card,1926

and you could actually get charged twice if you refresh the page,1930

because it sends the POST request all over again, and it performs some action.1933

That is a POST method; that is what the POST method is for, and that is why you get these warnings in your browser.1937

Now, if we go back to our item.php page that uses the GET method (and it just uses a query string),1943

we can refresh this page once, twice...we don't get any warning, because the browsers know1951

that a GET method is not supposed to cause any side effects--is not supposed to perform any actions.1958

So, it should return the same result every time, and not perform any actions.1962

So, it is safe, in a way, to go ahead and refresh that without requesting the user to be aware of it.1968

That is why you see those warnings in your browser sometimes.1977

For the homework challenge for today's lesson, I want you to create an HTML page that has an HTML form1981

with text fields for a user's address--all of the typical address fields.1988

I want you to set the method attribute of this form to POST now; we are going to be using the POST method.1994

And then, create a script that is going to be able to process that POST data that is submitted.1999

One thing to note is: whatever you call this script that is going to be processing the data,2006

you need to make sure that you set the action attribute in your HTML form to the URI of that particular PHP page.2012

The way you are going to access the data is like we did in today's lesson: using the POST superglobal.2026

All I want you to do is have it post that data to a PHP script that simply reads the POST data and echoes it.2031

So, it is going to just echo out the address that the user entered.2037

Just test your script to make sure that it correctly outputs all the submitted data fields, to make sure that you are using that POST superglobal correctly.2041

And then, try refreshing that submitted page after you have submitted by the POST method.2048

And you will see that you will get that warning that says, "Hey, you are using the POST method; this is going to have some side effects."2054

In this particular case, it doesn't have side effects; but it is going to let you know and make you more aware2060

of why you get that message and warning when you use the POST method, versus the GET method.2065

That ends today's lesson; thank you for watching Educator.com, and I look forward to seeing you next time.2072