7.4.7 C: Web Programming
In this assignment, we’re going to be doing server-side Web
programming. Similar issues apply to client-side (i.e., inside
the browser) Web programming—
7.4.7.1 The Scenario
On many Web sites, it’s common to want to explore possibilities. On an airline site, hotel site, etc., in response to a query, we’re given several possibilities. We might want to use our browser’s user interface functionality like opening links in new tabs, cloning a tab (i.e., making a new tab and copying the previous tab’s URL), and so on. Does this cause any problems for programs?
print(read("First number") + read("Second number")) |
For this homework, we want each prompt on a separate Web page, and the third page to show the result of the sum. This will let us explore the essence of what we want to study.
Think of the first number you enter as a choice of which outbound flight you want. You can imagine the page you get back showing you a list of several return flight options. Now you choose your second flight (in this case, enter a second number). When you do this, you get a trip summary that depends on your two choices (in this case, a sum, which depends on the two previous numbers).
However, you may want to explore your options. So, you should be able to clone the second page and try out different “return trips” (i.e., second numbers), switching between them, using the Back button, and so on, and seeing the site behave in a natural way.
7.4.7.2 The Assignment
First, we have to translate the pseudocode above into proper, running code. Unfortunately, you can’t usually run something in that “shape” on the Web. The problem is that after sending out the Web page, the program must effectively terminate (we’ll see why in class). Thus, we need a somewhat more complicated program structure to make this work.
Using Python Flask, we’ve provided an implementation of an adding program that consists of these three pages, rendered in the following order: (1) a form asking the user to input a first number, (2) a form asking for a second number, and (3) a results page displaying the sum of the two inputs.
Run this code (you can access it on your browser at localhost:5000). It won’t work as expected. Make sure you try it out before you proceed.
The problem is that the third page needs some way of knowing what number was entered in response to the first page. One way to do this is via cookies.You’re welcome to browse any Web resources you want to learn more about cookies.
Using cookies to store the value of the first input, implement this functionality and try out your new program. Does this seem to work?
Are you sure? Have you tried different Web interactions of the kind discussed above?
Once you’ve made this fail, you’ll need to fix it so that it’s robust in the face of Web interaction. The problem is with storing the first number in a cookie. You’ll have to use something else.
Hint: Look up HTML “hidden fields”.
7.4.7.3 Setting Up
Run the program given below.
7.4.7.4 Submission
You will need to submit the two implementations: one with cookies (cookies.py) and the fixed one (fixed.py).
7.4.7.5 Starter Code
See the external file.