Custom error pages (404, 500) in Flask - Step-by-Step Execution

Concept Flow - Custom error pages (404, 500)

User requests URL

↓

Flask checks route

Yes↓

Route found -> Return page

No↓

Error triggered (404 or 500)

↓

Custom error handler catches error

↓

Render custom error page

↓

Send error page to user

When a user visits a URL, Flask checks if the route exists. If not, or if an error occurs, Flask triggers an error. Custom error handlers catch these errors and show friendly error pages.

Execution Sample

Flask

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

@app.errorhandler(404)
def not_found(e):
    return render_template('404.html'), 404

@app.errorhandler(500)
def internal_error(e):
    return render_template('500.html'), 500

This code sets custom pages for 404 and 500 errors by telling Flask to use the 404.html and 500.html templates when a page is not found or an internal error occurs.

Execution Table

Step	User Request	Route Found?	Error Triggered	Handler Called	Page Rendered	Response Code
1	/home	Yes	No	No	Home page	200
2	/unknown	No	Yes (404)	Yes (404 handler)	Custom 404 page	404
3	/cause-error	Yes	Yes (500)	Yes (500 handler)	Custom 500 page	500
4	End	-	-	-	-	-

💡 Execution stops after sending the response page to the user.

Variable Tracker

Variable	Start	After Step 1	After Step 2	After Step 3	Final
user_request	None	/home	/unknown	/cause-error	None
route_found	False	True	False	True	N/A
error_triggered	None	No	404	500	N/A
handler_called	None	No	404 handler	500 handler	N/A
page_rendered	None	Home page	Custom 404 page	Custom 500 page	N/A
response_code	None	200	404	500	N/A

Key Moments - 2 Insights

Why does Flask call the 404 error handler instead of returning a normal page?

Because the route was not found (see execution_table row 2), Flask triggers a 404 error and calls the custom 404 handler to show a friendly page.

How does Flask know to use the custom 500 error page?

When an internal error happens (row 3), Flask triggers a 500 error and calls the registered 500 error handler to render the custom page.

Visual Quiz - 3 Questions

Look at the execution table, what is the response code when the user requests '/unknown'?

A 200

B 500

C 404

D None

💡 Hint

Check the 'Response Code' column for the row where 'User Request' is '/unknown'.

At which step does Flask call the 500 error handler?

A Step 1

B Step 3

C Step 2

D Step 4

💡 Hint

Look at the 'Handler Called' column to find when the 500 handler is used.

If the route '/home' did not exist, what would change in the execution table?

A Step 1 would show error triggered as 404 and handler called as 404 handler

B Step 1 would show error triggered as 500 and handler called as 500 handler

C Step 1 would remain the same with response code 200

D Step 1 would be removed

💡 Hint

Refer to how missing routes trigger 404 errors in the execution_table rows.

Concept Snapshot

Custom error pages in Flask:
- Use @app.errorhandler(code) decorator
- Define a function returning a template and status code
- Flask calls handler on matching error (404, 500)
- Shows friendly error pages instead of default messages
- Helps users understand errors clearly

Full Transcript

When a user visits a website built with Flask, the app checks if the requested page exists. If it does, Flask shows the page normally with a 200 status code. If the page is missing, Flask triggers a 404 error. If something goes wrong inside the app, it triggers a 500 error. Developers can write special functions called error handlers to catch these errors. These handlers return custom pages like 'Page Not Found' or 'Server Error' to help users understand what happened. This makes the website friendlier and easier to use. The code example shows how to create a custom 404 page by using the @app.errorhandler decorator and returning a template with the 404 status code.

Practice

1. What is the main purpose of creating custom error pages like 404 or 500 in a Flask app?

easy

A. To show friendly messages instead of default error text

B. To speed up the server response time

C. To disable error logging

D. To automatically fix bugs in the code

Solution

1. Step 1: Understand default error behavior

   By default, Flask shows plain error messages like '404 Not Found' which are not user-friendly.

2. Step 2: Purpose of custom error pages

   Custom error pages replace these default messages with nicer, clearer pages that help users understand the problem.

3. Final Answer:

   To show friendly messages instead of default error text -> Option A

4. Quick Check:

   Custom error pages = Friendly messages [OK]

Hint: Custom error pages improve user experience with friendly messages [OK]

Common Mistakes:

• Thinking custom pages fix server speed
• Believing they disable error logs
• Assuming they auto-correct bugs

2. Which of the following is the correct way to define a custom 404 error handler in Flask?

easy

A. @app.handle_error(404)
def not_found(error):
return 'Page not found', 404

B. @app.route('/404')
def not_found():
return 'Page not found', 404

C. @app.errorhandler(404)
def not_found(error):
return 'Page not found', 404

D. @app.error(404)
def not_found(error):
return 'Page not found', 404

Solution

1. Step 1: Identify correct decorator for error handling

   Flask uses @app.errorhandler(error_code) to register error handlers.

2. Step 2: Check function signature and return

   The handler function takes an error argument and returns a response with the error code.

3. Final Answer:

   @app.errorhandler(404)\ndef not_found(error):\n return 'Page not found', 404 -> Option C

4. Quick Check:

   @app.errorhandler(404) = Correct syntax [OK]

Hint: Use @app.errorhandler(code) to define error handlers [OK]

Common Mistakes:

• Using @app.route instead of @app.errorhandler
• Wrong decorator names like @app.handle_error
• Missing error parameter in handler function

3. Given this Flask code snippet, what will be the output when a user visits a non-existing page?

@app.errorhandler(404)
def page_not_found(e):
    return '
Oops! Page missing.
', 404

@app.route('/')
def home():
    return 'Welcome Home'

medium

A. The browser shows 'Welcome Home'

B. The server crashes with an error

C. The browser shows default Flask 404 page

D. The browser shows 'Oops! Page missing.' with 404 status

Solution

1. Step 1: Understand route and error handler

   The '/' route returns 'Welcome Home'. The 404 error handler returns a custom HTML message with status 404.

2. Step 2: Accessing a non-existing page triggers 404

   Visiting a page not defined triggers the 404 handler, so the custom message is returned with status 404.

3. Final Answer:

   The browser shows '<h1>Oops! Page missing.</h1>' with 404 status -> Option D

4. Quick Check:

   404 error triggers custom handler = The browser shows '<h1>Oops! Page missing.</h1>' with 404 status [OK]

Hint: Non-existing pages trigger 404 handler, not normal routes [OK]

Common Mistakes:

• Thinking '/' route handles all pages
• Expecting default Flask 404 page instead of custom
• Assuming server crashes on 404

4. Identify the error in this Flask code for a custom 500 error page:

@app.errorhandler(500)
def internal_error():
    return 'Server error occurred', 500

medium

A. The handler function must accept an error parameter

B. The decorator should be @app.handle_error(500)

C. The return statement must not include the status code

D. The function name must be 'handle_500_error'

Solution

1. Step 1: Check function signature for error handlers

   Flask error handlers must accept one argument for the error object.

2. Step 2: Verify the given function signature

   The function internal_error() has no parameters, which is incorrect for error handlers.

3. Final Answer:

   The handler function must accept an error parameter -> Option A

4. Quick Check:

   Error handler functions need error argument [OK]

Hint: Error handlers always take one error argument [OK]

Common Mistakes:

• Omitting the error parameter in handler function
• Using wrong decorator names
• Thinking function name matters for error handlers

5. You want to create a custom 404 error page that renders an HTML template named '404.html' and returns status 404. Which Flask code snippet correctly does this?

hard

A. @app.route('/404')
def not_found():
return render_template('404.html'), 404

B. @app.errorhandler(404)
def not_found(error):
return render_template('404.html'), 404

C. @app.errorhandler(404)
def not_found():
return render_template('404.html')

D. @app.errorhandler(404)
def not_found(error):
return render_template('404.html', status=404)

Solution

1. Step 1: Use correct decorator and function signature

   Use @app.errorhandler(404) and define function with error parameter.

2. Step 2: Return rendered template with status code

   Return render_template('404.html') and the status code 404 as a tuple.

3. Final Answer:

   @app.errorhandler(404)\ndef not_found(error):\n return render_template('404.html'), 404 -> Option B

4. Quick Check:

   Custom 404 with template and status code = @app.errorhandler(404) def not_found(error): return render_template('404.html'), 404 [OK]

Hint: Return (render_template, status_code) tuple in error handler [OK]

Common Mistakes:

• Using @app.route instead of @app.errorhandler
• Missing error parameter in function
• Not returning status code with template