Setting and reading cookies in Flask - Mini Project: Build & Apply

Setting and reading cookies in Flask

📖 Scenario: You are building a simple web app that remembers a visitor's favorite color using cookies.This helps the site greet them with their chosen color every time they visit.

🎯 Goal: Create a Flask app that sets a cookie named favorite_color when the user visits the /set_color route with a color query parameter.Then, read that cookie on the /show_color route and display a message with the stored color.

📋 What You'll Learn

Create a Flask app with two routes: /set_color and /show_color

In /set_color, set a cookie named favorite_color with the color from the query parameter

In /show_color, read the favorite_color cookie and display it in the response

Use Flask's make_response to set cookies

Handle the case where the cookie is not set by showing a default message

💡 Why This Matters

🌍 Real World

Websites often use cookies to remember user preferences like themes, languages, or login sessions to improve user experience.

💼 Career

Understanding how to set and read cookies is essential for backend web developers to manage user sessions and preferences securely.

1

Create the Flask app and import modules

Write code to import Flask, request, and make_response from flask. Then create a Flask app instance called app.

Flask

# Import Flask, request, and make_response from flask
# Create a Flask app instance named app
# Your code here

Hint

Use from flask import Flask, request, make_response and then app = Flask(__name__).

2

Create the /set_color route to set the cookie

Define a route /set_color using @app.route. Inside the function set_color(), get the query parameter color from request.args. Use make_response to create a response with the text "Color set to {color}". Then set a cookie named favorite_color with the value of color on the response. Return the response.

Flask

from flask import Flask, request, make_response

app = Flask(__name__)

# Define /set_color route to set favorite_color cookie
# Your code here

Hint

Use request.args.get('color') to get the color. Use make_response to create the response and response.set_cookie to set the cookie.

3

Create the /show_color route to read the cookie

Define a route /show_color using @app.route. Inside the function show_color(), read the cookie named favorite_color from request.cookies. If the cookie exists, return the text "Your favorite color is {color}". Otherwise, return "No favorite color set."

Flask

from flask import Flask, request, make_response

app = Flask(__name__)

@app.route('/set_color')
def set_color():
    color = request.args.get('color')
    response = make_response(f"Color set to {color}")
    response.set_cookie('favorite_color', color)
    return response

# Define /show_color route to read favorite_color cookie
# Your code here

Hint

Use request.cookies.get('favorite_color') to read the cookie. Use an if-else to return the correct message.

4

Add the app run block

Add the standard Flask app run block: if __name__ == '__main__': and inside it call app.run(debug=true).

Flask

from flask import Flask, request, make_response

app = Flask(__name__)

@app.route('/set_color')
def set_color():
    color = request.args.get('color')
    response = make_response(f"Color set to {color}")
    response.set_cookie('favorite_color', color)
    return response

@app.route('/show_color')
def show_color():
    color = request.cookies.get('favorite_color')
    if color:
        return f"Your favorite color is {color}"
    else:
        return "No favorite color set."

# Add the app run block below
# Your code here

Hint

Use the standard Flask run block with debug=true for easier testing.

Practice

1. What is the main purpose of using cookies in a Flask web application?

easy

A. To increase the speed of the Flask server

B. To run server-side scripts automatically

C. To change the HTML structure of a webpage

D. To store small pieces of data on the user's browser for later use

Solution

1. Step 1: Understand what cookies do

   Cookies store small data on the user's browser to remember information like login status or preferences.

2. Step 2: Identify the correct purpose in Flask context

   Flask uses cookies to save data on the client side, not to run server scripts or change server speed.

3. Final Answer:

   To store small pieces of data on the user's browser for later use -> Option D

4. Quick Check:

   Cookies save data on browser = C [OK]

Hint: Cookies save data on browser, not server tasks [OK]

Common Mistakes:

• Thinking cookies run server scripts
• Confusing cookies with server speed optimization
• Believing cookies change webpage HTML structure

2. Which of the following is the correct way to set a cookie named user_id with value 123 in Flask?

easy

A. response.cookies.set('user_id', 123)

B. response.set_cookie('user_id', '123')

C. request.set_cookie('user_id', '123')

D. request.cookies.set('user_id', '123')

Solution

1. Step 1: Identify the correct method to set cookies

   Cookies are set on the response object using set_cookie method.

2. Step 2: Check the value type and object used

   The value must be a string, so '123' is correct. Also, setting cookies on request object is invalid.

3. Final Answer:

   response.set_cookie('user_id', '123') -> Option B

4. Quick Check:

   Use response.set_cookie with string value = A [OK]

Hint: Use response.set_cookie with string values [OK]

Common Mistakes:

• Using request object to set cookies
• Passing integer instead of string as cookie value
• Calling set_cookie on request.cookies

3. Given this Flask route code, what will be the output when accessing /get_cookie after setting the cookie username to alice?

from flask import Flask, request, make_response
app = Flask(__name__)

@app.route('/set_cookie')
def set_cookie():
    resp = make_response('Cookie Set')
    resp.set_cookie('username', 'alice')
    return resp

@app.route('/get_cookie')
def get_cookie():
    user = request.cookies.get('username')
    return f'User: {user}'

medium

A. User: alice

B. User: None

C. User: username

D. Error: Cookie not found

Solution

1. Step 1: Understand cookie setting route

   The /set_cookie route sets a cookie named 'username' with value 'alice' on the response.

2. Step 2: Understand cookie reading route

   The /get_cookie route reads the 'username' cookie from the request and returns it in the string.

3. Final Answer:

   User: alice -> Option A

4. Quick Check:

   Cookie 'username' = 'alice' read correctly = A [OK]

Hint: Set cookie first, then read with request.cookies.get() [OK]

Common Mistakes:

• Expecting cookie value before setting it
• Confusing cookie name with value
• Assuming error if cookie missing without checking

4. Identify the error in this Flask code snippet that tries to read a cookie named session_id:

from flask import Flask, request
app = Flask(__name__)

@app.route('/check')
def check():
    session = request.cookies['session_id']
    return f'Session: {session}'

medium

A. Should use response.cookies instead of request.cookies

B. Cookie name must be capitalized as 'Session_id'

C. Using square brackets to access cookie may cause KeyError if cookie missing

D. Flask does not support reading cookies

Solution

1. Step 1: Check how cookie is accessed

   The code uses request.cookies['session_id'] which raises KeyError if cookie is missing.

2. Step 2: Suggest safer method

   Using request.cookies.get('session_id') returns None if cookie missing, avoiding error.

3. Final Answer:

   Using square brackets to access cookie may cause KeyError if cookie missing -> Option C

4. Quick Check:

   Access cookie safely with get() to avoid errors = B [OK]

Hint: Use request.cookies.get() to avoid KeyError [OK]

Common Mistakes:

• Using response.cookies to read cookies
• Assuming cookie names are case-insensitive
• Ignoring possibility of missing cookies causing errors

5. You want to create a Flask route that sets a cookie named theme with value dark that expires in 7 days. Which code snippet correctly does this?

hard

A. resp.set_cookie('theme', 'dark', max_age=7*24*60*60)

B. resp.set_cookie('theme', 'dark', expires=7)

C. resp.set_cookie('theme', 'dark', max_age=7)

D. resp.set_cookie('theme', 'dark', expires='7 days')

Solution

1. Step 1: Understand cookie expiration parameters

   To set expiration, use max_age in seconds or expires as a datetime object.

2. Step 2: Calculate 7 days in seconds and check syntax

   7 days = 7*24*60*60 seconds. resp.set_cookie('theme', 'dark', max_age=7*24*60*60) uses max_age correctly with this calculation.

3. Final Answer:

   resp.set_cookie('theme', 'dark', max_age=7*24*60*60) -> Option A

4. Quick Check:

   Use max_age in seconds for 7 days = D [OK]

Hint: Use max_age in seconds for cookie expiry [OK]

Common Mistakes:

• Passing expires as integer days instead of seconds or datetime
• Using string '7 days' which is invalid
• Confusing max_age and expires parameters