• HTML forms enable your web application to collect information from your users
Browser Web server
Server-side
Programs
Type URL
Gimme HTML
HTML for form
Show form
User fills out form
Send values entered
Do something with these values, please
<form action="http://web.engr.oregonstate.edu/~cscaffid/formrep eater.php" method="GET">
<input type="submit">
</form>
When the user hits the submit button, the form gathers all the input and sends to the server. (But this very minimal form has no input fields!)
Note: the URL above might break some day. In that case, search online for the URL of a "form tester" that can replace the URL shown above.
<form action="http://web.engr.oregonstate.edu/~cscaffid
/formrepeater.php" method="GET">
<input type="text" name="myfield">
<input type="submit">
</form>
When your user types a value and hits submit, the form sends the value of myfield to the server. Notice the value appears on the URL.
<form action="http://web.engr.oregonstate.edu/~cscaf fid/formrepeater.php" method="POST">
<input type="text" name="myfield">
<input type="submit">
</form>
Now the value is not shown on the URL. This helps to keep it secret. We will discuss GET vs POST later in this lecture.
<form action="http://web.engr.oregonstate.edu/~cscaffid
/formrepeater.php" method="POST">
<input type="text" name="myfield">
<input type="password" name="mypasswordfield">
<input type="submit">
</form>
The value of the password field is also kept hidden on the screen when the user types it. NEVER EVER transmit passwords via GET.
<form action="http://web.engr.oregonstate.edu/~cscaf fid/formrepeater.php" method="POST">
<textarea name="mytextarea"></textarea>
<input type="submit">
</form>
Textarea is a handy way to provide a multi-line input field.
<form action="http://web.engr.oregonstate.edu/~cscaffid/formrepeater.php" method="POST">
<input type="radio" name="myradio" value="1">
Option one<BR>
<input type="radio" name="myradio" value="2">
Option two<BR>
<input type="radio" name="myradio" value="3">
Option three<BR>
<input type="submit">
</form>
The user can only choose one option from a radio field.
<form action="http://web.engr.oregonstate.edu/~cscaffid/formrepeater.php" method="POST">
<input type="checkbox" name="mychk" value="1">
Option one<BR>
<input type="checkbox" name="mychk" value="2">
Option two<BR>
<input type="checkbox" name="mychk" value="3">
Option three<BR>
<input type="submit">
</form>
The user can only choose multiple options from a checkbox field.
<form action="http://web.engr.oregonstate.edu/~cscaffid/formrepeater.php" method="POST">
<select name="myselect">
<option value="1">Option one</option>
<option value="2">Option two</option>
<option value="3">Option three</option>
<option value="4">Option four</option>
</select>
<input type="submit">
</form>
The user can choose only option from a dropdown.
<form action="http://web.engr.oregonstate.edu/~cscaffid/formrepeater.php" method="POST">
<select name="myselect" multiple size="3">
<option value="1">Option one</option>
<option value="2">Option two</option>
<option value="3">Option three</option>
<option value="4">Option four</option>
</select>
<input type="submit">
</form>
The user can choose multiple options from a listbox with multiple.
• So what's the deal with GET vs POST?
• Difference in purpose
– GET is for retrieving data from the server
(or any other purpose that can safely be repeated an arbitrary number of times)
– POST is for making changes to the server
(or any other purpose that cannot be safely repeated an arbitrary number of times)
• Retrieving an HTML table or list
• Retrieving a form
• Checking to see if the page still exists
• Checking to see if the server has crashed
• Checking to see fast the server is today
All of these can safely be repeated lots of times.
Repeating these won't mess up the server.
These are called "idempotent operations."
• Deleting data from the server
• Updating data on the server
• Logging in (changes state on the server)
• Logging out (ditto)
Each of these changes the state of the server, so repeating them an arbitrary number of times could mess up the server.
Technically, your browser might not connect directly to servers. You connect via proxy servers.
Browser
Programs
Proxy
Servers
Web server
Programs
Database
SMTP server
If two people GET the same URL, the proxy server can GET the URL once and give the data to both.
Browser
Programs
Proxy
Servers
Web server
Programs
Database
SMTP server
Browser
Programs
Or, a proxy server can preemptively GET certain
URLs as many times as desired, even when nobody is logged on.
Proxy
Servers
Web server
Programs
Database
SMTP server
It can cache this data and omit a GET call later!
Search engines are also allowed to GET any URL at any time, or as many times as desired (subject to certain restrictions).
Web server
Programs
Database
SMTP server
Search engines
• GET can be called…
– 1 time when 1 user wants data
– 1 time when 2 users want data
– 1 time when 300 users want data
– Many times when 0 users want data
(preemptive caching)
– 0 times when 1 user wants data (if it was cached)
– Many times when search engines want data
• A proxy server will always forward the POST request exactly 1 time when each user's browser tries to POST.
• A proxy server may not cache POST data.
– So if you send passwords via POST, proxy servers are not allowed to keep copies of passwords going by!
• And search engines are also not supposed to automatically perform POST operations, either.
• We will revisit the subject of GET vs POST
– When discussing how to upload files to servers
– When discussing scalability
– When discussing security
• For now, when in doubt, just use POST.
– If you use POST, the worst that can happen is that you harm scalability.