Blasha

A blog...by masha.

Get, Post, Repeat

Prior to starting this program, I’d be the first to admit that I wouldn’t consider myself particularly adept in the interworkings of computers. Now I’m on a mission (well me and the school) to educate myself on all things tech. Starting from the basics.

Most of the time, I’ll learn about something at a high level and it seems to make perfect sense. Yet when I’m left to my own devices, things get a bit more tricky. One such subject came in the form of HTTP requests. In the process of buiding our first app (check it out: Octomaps) I was able to dig deeper into the communication channel between client, server and application. Allow me to explain.

When a user enters a URL into a browser (the client), the client sends a request to the server hosting that website. The server then needs to process that request using the application, and return the appropriate response to the browser. That’s the simple explanation.

To expand, hypertext transfer protocol (HTTP), functions as the communicator between the client and the server. A specific request method is sent from the client to the server indicating the desired action to be performed on the resource of the application. I’ll focus on the two most commonly used methods in this post: GET and POST.
The GET method, requests the retrieval of a resource or information.
The POST method, requests that the server accept the data enclosed as a new subordinate of the web resource. This data will typically be processed by the application.

Ok, great. So now we’ve got a general understanding of the GET and POST methods, but now what? Where do they go and how do we use them? That’s exactly where I stood a few days ago. My problem was two-fold. First of all, I needed to understand the interaction between the client-server-application. Then, I needed to wrap my head around creating/sending a form to the client to fill out and then using the inputs in my application. We’ll go through them one at a time.

Let’s walk through what happens in the client-server-application relationship.
Please note that I have used the Sinatra framework to deploy my application on my local host.

REQUEST
A user requests to go to the url: 0.0.0.0:9292
The browser sends an HTTP request to 0.0.0.0:9292: GET / HTTP/1.1

This indicates:
1) The GET method indicates that the server is supposed to return a resource.
2) The requested URI of ‘/’, which is the root
3) The HTTP protocol version (irrelevant for us here)

PROCESS REQUEST:
The server looks at our controller.rb file for instructions.
Searches for a get method which matches the specific url and executes the proceeding code, in our case it renders the form erb file.

RESPONSE:
The server responds with: 200 1709 0.0539????

This indicates:
1) A three-digit numeric status code. 200 means OK. Check out other response codes.
2) ?
3) Request processing time

Next, on to creating/sending/using a form in the application.
I knew what my basic setup was supposed to look like in Sinatra, but I wasn’t entirely sure how to use GET and POST appropiately to achieve my goal. The first hurdle to overcome was determining which method type to use for my form. At first it seemed to me like the there was a clear distinction between the two methods. Use GET to request data and POST to send data, and since I wanted a user to send the application data, I should use post. Unfortunately, it was not so clear cut since in practice you can use either GET or POST to send data from a form. Confusion insued.

Let’s look at the more practical differences between the two methods.

    GET - default if method not specified
  • Appends the form-data to the URL in name/value pairs: URL?name=value&name=value
  • The length of a URL is limited (about 3000 characters)
  • Useful for form submissions where a user want to bookmark the result
  • Never use to send sensitive data, since inputs are visible in the URL
    POST - Sends the form-data as an HTTP post transaction
  • Appends form-data inside the body of the HTTP request (data is not shown is in URL)
  • Has no size limitations
  • Form submissions cannot be bookmarked

I proceeded to experiment with the methods to obtain a clearer understanding of their function. I created a controller.rb file and two forms, get_form.erb and post_form.erb.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
controller.rb
require 'sinatra'
require 'sinatra/reloader'

get '/get' do
  erb :get_form
end

get '/get/new' do
  "You entered #{params[:fname]} #{params[:lname]}"
end
-------------------------------------------
get '/post' do
  erb :post_form
end

post '/post' do
  "You entered #{params[:fname]} #{params[:lname]}"
end

When using get as the form method, the form needs to be directed to another URL in order to have access to the inputted data. This is accomplished by specifying a different URL in the form action. Also, the data can accessed using the get method in the controller at the new url.

1
2
3
4
5
6
get_form.erb
<form action="/get/new" method="get">
  First name: <input type="text" name="fname"><br>
  Last name: <input type="text" name="lname"><br>
  <input type="submit" value="Submit">
</form>


Notice that after submitting the get method form, the inputted data is visible in the URL.

When using post as the form method, the form does not need to be directed to another URL in order to have access to the inputted data. Also, the data can be accessed using the post method in the controller at the same.

1
2
3
4
5
6
post_form.erb
<form action="/post" method="post">
  First name: <input type="text" name="fname"><br>
  Last name: <input type="text" name="lname"><br>
  <input type="submit" value="Submit">
</form>


Notice that after submitting the post method form, the inputted data is not visible in the URL.