This homework assignment must be submitted in Gradescope by Noon central time on Tuesday April 18, 2023.
Collaboration is prohibited, and you may only access resources (books, online, etc.) listed below.
This homework is about HTML/CSS and Flask.
Most relevant:
Less likely to be relevant, but also allowed:
This homework assignment has 3 problems. The grading breakdown is:
| Points | Item |
|---|---|
| 3 | Autograder |
| 5 | Problem 2 |
| 5 | Problem 3 |
| 2 | Problem 4 |
| 15 | Total |
The part marked "autograder" reflects points assigned to your submission based on some simple automated checks for Python syntax, etc. The result of these checks is shown immediately after you submit.
Ask your instructor or TA a question by email, in office hours, or on discord.
Modern application login systems tend to use a username, password, and a "second factor" such as a numeric code sent by SMS message or generated by an app or hardware device. In the case of an app or hardware device (called a token), the code is usually generated based on the current time and a small amount of secret data that is provided by the application when the account is created. Thus the application can predict what codes will be generated, but without knowledge of the secret data, the sequence looks random.
Here's a function that uses a secret string value called secret and the current time to generate a 6-character string that changes every 10 seconds.
import time
def time_and_secret_based_code(secret):
"""
Return a 6-digit code (as a string) that combines
a secret value and the current time. This is a
simplified algorithm not suited to actual use for
authentication!
"""
x = int(time.time()) // 10
# Next few lines implement Fowler-Noll-Vo hash function
# based on https://gist.github.com/amakukha/7854a3e910cb5866b53bf4b2af1af968
h = 0x811c9dc5
for c in str(secret) + str(x):
h = ((ord(c)^h) * 0x01000193) & 0xFFFFFFFF
s = ("{:06d}".format(h))[-6:]
return s
Here's an example of it in action, showing different codes generated at 15-second intervals.
for _ in range(5):
print(time_and_secret_based_code("MCS275"))
time.sleep(15)
Write a Flask application hwk13prob2.py that has a single route "/" where it displays the six-digit code returned by time_and_secret_based_code("MCS275") at the time the page is requested. The code should appear centered on the screen in large numerals.
Then, add the following tag inside the <head> of the HTML produced by this application to make it automatically reload every 15 seconds:
<meta http-equiv="refresh" content="15">
This means you'll see a new code every 15 seconds. This makes the Flask application a toy example of the kind of token you'd use in a two-factor authentication system.
Take the element info app that you developed in Worksheet 13 (or the one provided in the solutions) and modify it to add the following route:
/elements/phase/<ph>/ - Where <ph> is replaced by a word such as "solid", "liquid", "gas", or "artificial".Visiting this route should show a HTML document with a bulleted list of the names of elements that have the specified phase at room temperature. For example
/elements/phase/liquid/
might produce a page that looks like this:
Then, make it so each element name in the bulleted list is a link to the page with information about that element. For example, I should be able to click on Bromine and see the page with information about element number 35 (which is Bromine).
Rename the application main script as hwk13prob3.py, and upload any templates or other files needed to run this application.
Answer this problem in hwk13prob4.txt.
What is your project 4 topic, and how is your work going so far? Please answer very briefly, e.g. "I'm working on a login system for TrackFlow. I have started reading about how to make one." or "I don't know what I'll do, nor have I thought about it."
A nonempty response that appears genuine will get full credit.
If you have questions or concerns, you can mention them too to get feedback.