5.16. Send more data with a POST request It looks like POST is just what we need to make sure those big orders get to Break Neck's placeOrder.php script intact. Let's update the JavaScript in placeOrder() to use a POST request instead of a GET request : Back to Step 2... gotta update submitOrder() again. function submitOrder() {submitOrder() is in pizza.js. var phone = document.getElementById("phone").value; var address = document.getElementById("address").value; var order = document.getElementById("order").value; var url = "placeOrder.php?phone=" + escape(phone) + "&address=" + escape(address) +Start out by removing all the form data from the request URL. "&order=" + escape(order); url = url + "&dummy=" + new Date().getTime();Since we're using POST, we don't need this dummy parameter anymore. request.open("POST", url, true);Tell the open() method that you want to use POST instead of GET. request.onreadystatechange = showConfirmation; request.send("phone=" + escape(phone) + "&address=" + escape(address) + "&order=" + escape(order));Use send() to send the pizza order to the Break Neck server.Use name/value pairs in send(), just like you did at the end of the request URL in the GET version of this code. }
Just Do It Go ahead and open up your copy of pizza.js, and find the submitOrder() function. Change the function's code so that it sends the customer's order to placeOrder.php using a POST request instead of a GET request. Once your code matches ours from above, save pizza.js, and go ahead and turn the page for some Q-and-A before we take Break Neck for another test drive. |
Hold on a second... just because we're using a POST request, caching isn't an issue? I'd like a little more explanation than that. Browsers cache GET requests Browsers know exactly what data you're sending them in a GET request... all the data is in the request URL. So when the web browser thinks a request is the samebecause the same data is in the URLit tries to "help out" and return any cached answer it has for that request. GET request placing order Web Browser Internet Explorer Firefox Opera Safari Mozilla showConfirmation() Request URLThe browser thinks it's helping you... placeOrder.php ?phone=... Server ResponseHere's the browser's caching table. 5...but it ends up giving you the same data over and over. PHP scriptEven worse, the server NEVER gets the new pizza order!The request never makes it to the Break Neck server.
POST requestSince this is a POST request, the browser doesn't look up any responsees in its caching table. It just sends the request on normally. placing order Web Browser Internet Explorer Firefox Opera Safari Mozilla showConfirmation() 8This time, it's the server sending back a response. PHP scriptThe POST request gets to the Break Neck server.
But isn't the URL always the same in a POST request? Why doesn't the browser try and use its cache, if the URL never changes? Browsers hate a mystery In a POST request, the browser doesn't know what data might be a part of the request, since the data isn't sent as part of the request URL. Since the browser isn't sure what's in the request, it sends all POST requests on to their destination server, and doesn't try and cache responses from the server. Browsers don't try and cache POST requests. Frequently Asked Questions? | Q: | Now that we're using a POST request, does the length of the data we send in the request matter? | | A: | No. You can send as much data in a POST request as you like. So those big orders for your next bachelorette party will get through to Break Neck with no problems. | | Q: | Is the length restriction on GET requests the only reason to switch to using a POST request? | | A: | Pretty much. While most people agree that POST requests are best for submitting orders and doing other transactions that are "final", the biggest reason to use a POST request instead of a GET request is because you can send unlimited amounts of data in a POST request. In a GET request, both the browser and the server have a maximum length for request URLs; anything longer than that gets ignored. | | Q: | I thought that POST requests were more secure than GET requests? | | A: | POST requests are marginally more secure than GET requests. There's one additional step that goes into packaging up POST data: an encoding on the browser, and a matching decoding on the server. But decrypting POST data is pretty trivial. Anyone who is looking to get your information can get it from a POST request almost as easily as they can from a GET request. If you really want to secure your request, you'll have to use a secure network connection, like SSL. That's a little beyond what we're covering in this book, though. For the most part, that's an issue for the server to worry about, and not your Ajax application. | | Q: | I've always heard you should send credit card numbers and personal information using POST. Is that not true? | | A: | Well, that's more about what the request does than it is about security. Remember, most web programmers like to use POST requests for completing orders, paying for an item, or any other transaction that is "final". So you're posting a transaction, like you would in your checkbook. If you want extra security, though, then you still will want to use an SSL connection, or some other form of network security, for your requests. In the same way, GET requests are usually used to get data (makes sense, doesn't it?). And since you're almost always completing a purchase or transaction when you enter in sensitive information like a credit card number, those end up being sent to the server as POST requests. But it's more about the type of the transaction, rather than making the request more secure. | | Q: | And when you send a POST request, you just put the request data in the send() method of the request object? | | A: | Exactly. You even use the same name/value pairs, like you did when adding the data to your request URL. Then, separate each pair using the & character. The only difference between how you supply the data in a POST request and the data in a GET request is that, in the GET request, you have to put in a ? before the name/value pairs you add to the request URL. In a POST request, you don't need a ? before the name/value pairs, since you're putting them directly into the send() method. | | Q: | That's it? There's nothing else we need to do? | | A: | Well, let's take our updated Break Neck pizza order form for a test drive and see... |
|
|
