Lab Homework 3: Filter Input, Escape Output

Security. Without the proper precautionary measures, it’s very easy for some malicious person to hack your web site. This lab will help you develop your filter input, escape output skills so that you can protect the web sites that you develop.

Learning Objectives


Lab Homework Deadline Slip Days Credit Solution
All Parts Sun 2/16, 11:59pm Max: 2 days 20 points (completion) Provided


  1. Clone your lab repository.

    Clone the following URL:

  2. Sign the attendance sheet.

    It is your responsibility to sign the attendance sheet before you leave. If it wasn’t handed to you, ask to sign it. No signature on the attendance sheet will result in an immediate 0 for this lab’s attendance grade. Forgetting to sign the attendance sheet will not be considered a valid excuse to have your lab attendance corrected.

  3. Work together.

    Work with your peers to complete this lab. Talk aloud, discuss, troubleshoot problems. You are encouraged to work together so long as you do your own work and you don’t give away answers.

  4. Submit.

    When you’re finished, follow the instructions in to submit your assignment.

Warning & Frequently Asked Questions

In this lab you will focus on filtering input, and escaping output. Due to this focus, the lab’s code is implemented without sticky values, form validation, or corrective feedback. This is not considered best practice. We have remove sticky values, form validation, and corrective feedback to help you focus on practicing filtering input and escaping output. You are still expected to follow best practice in other assignments.

Part I: Design Critique

Your client, 2300 Insurance, has contracted with you to help them improve their insurance enrollment application. After some internal research they’ve discovered that their current enrollment process is costing them extra money in lost sales and in additional call center support as a result of the poor user experience. To reduce their overhead costs, they’ve asked you to help them fix their current enrollment process by addressing the usability and security issues.

From their internal research they’ve discovered two major issues that need to be addressed:

  1. Their current enrollment form has received many complaints from customers that their form is frustrating to use.
  2. The current form permits malicious users to send dubious input to the server. The company’s security team is concerned they are not doing enough to protect their customers and their systems from attack.

Objective: Your task is to improve the application process for the customers as well as address the security concerns.

The Enrollment Form

Below is a sample of a typical customer:

(data faked; image source:

Here’s an incomplete/incorrect application:

Here is an example of the correctly completed application:

Next, view insurance.php in VS Code. Do not try and view insurance.php in your web browser! Look over the application’s code to identify possible causes for the issues described by the client. For example, take a look at the input types.

Design Critique & Refined Design

Objective: Form groups of about 4 people. Critique the form. Once you’ve identified the usability issues with the form, go to the board and design a new form (sketch).

Once all teams are done redesigning the form, as a class, share your redesign with the class.

Part II: Debugging & Client-Side Usability

Objective: Start the PHP and go to https://localhost:3000/insurance.php. You’ll see a blank page. Your task is to figure out why this page is blank instead of showing rendered content.

Hint: Check the PHP server console in VS Code.

Objective: Once you’ve figured out the issue, correct the code so that the page loads in the browser successfully.

Objective: Using your team’s redesigned enrollment form, fix the enrollment form. You will mostly likely need to change the type of the input for some of the fields in order to improve the form’s client-side usability. You may also want to add or remove instructions in the form.

Part III: Filter Input

Objective: Next, you’ll need to make sure you access the new HTTP parameters and filter them. You may do this using the request associative arrays ($_GET[], $_POST[]) or the filter_input() method.

Note: Filtering for some of the fields (Date of Birth and Phone Number) may be very difficult based on what you currently know. If you can’t figure it out, that’s okay, just use FILTER_SANITIZE_STRING for now. You need to understand regular expressions to do this properly and we haven’t covered those yet!

PHP Documentation


// Sanitize: Strip HTML tags from client's first name.
$client_first_name = filter_input(INPUT_POST, "first_name", FILTER_SANITIZE_STRING);
// Transform: Convert dependents value to an integer.
$client_dependents = filter_input(INPUT_POST, "dependents", FILTER_VALIDATE_INT);
// Validate: Number of dependents must be greater than 0 (no negative values).
if ($client_dependents < 0) {
  $client_dependents = NULL;

Part IV: Escape Output

Objective: Now that you’ve probably filtered your input, it’s time to make sure you escape your output for any untrusted values. You can escape your output for HTML by using htmlspecialchars($name);.

PHP Documentation: htmlspecialchars():

Part V: Test it!

Testing is really important. It means that you’ve checked that your program (or website) behaves the way you (and your client) expect. Testing is especially critical for ensuring that you’ve properly secured your website too. It is really easy to forget to secure a single parameter, but forgetting this one parameter may be enough to open your web site up for attacks!

Take the time to test that all inputs are filtered properly and all outputs are properly escaped:


The following individuals made contributions to this assignment.