What is the name of the process where a website validates user input before the application uses the input?

The internet has outperformed expectations multiple times in terms of use-case since its launch on 1st January 1983. In 1995, Robert Metcalfe predicted that “the Internet will soon go spectacularly supernova and in 1996 catastrophically collapse”. As of April 2021, over 4.72 billion people use the internet.  

While we hope that the internet is used only for ethical and legal activities, history has shown us that the internet, though very useful, can be weaponized. One way to prevent cybersecurity compromises of any digital infrastructure is input validation.


Input Validation

Image Source

Input validation (also known as data validation) is the proper testing of any input supplied by a user or application. Input validation prevents improperly formed data from entering an information system. Input validation can be carried out on client-side and server-side code to reinforce infrastructure security.

While client-side validation is faster and favors user experience, it should not be used in isolation because client-side validation relies on the browser (which can be tricked). Client-side validation should always be used along with server-side validation as the latter is more reliable.

Client-Side Validation

Users communicate with a digital platform (mobile, web, or desktop) via forms. To register on a platform, log in, search, post, and do other activities, one has to request information from a platform or send data to a platform using forms. Regardless of how stylish the interface is, it’s still a form.

Client-side validation involves monitoring what you type to ensure that it obeys set guidelines and obtains the expected format or type of data from users. Code written to ensure users don’t deviate from what is expected of them while making requests or interacting with a digital platform is known as client-side validation.

Image Source

Client-side validation exists on the front-end and is part of the front-end secure coding requirements. It responds faster to the user’s input and reduces the latency that would exist if one only used server-side data validation. Note that client-side data validation by itself is not enough to validate data properly as it can be surmounted.

Here is an example of client-side data validation using just HTML: 

Server-Side Validation

While front-end code handles client-side input validation, back-end code handles server-side input validations. Since back-end code is the closest to the database, back-end code serves as an intermediary between the front-end code (that the user sees) and the database, which houses the user data.

When building software solutions capable of accepting and storing input from users, model/entity classes are built as the representatives of a certain category of inputs. These entity classes are present in the database like tables, interact with other tables, and send requested data back to the client.

These classes house property declarations within them (among other things) that form columns within the database tables. The columns contain specific data types, and can be manipulated to produce other data results or perform complex logical processes.

Server-side validation is done in the model/entity class by attaching attributes above the property declaration to dictate the data types that the property can accept. The specifications can encompass a lot of parameters to ensure only refined data is acceptable.

Image Source

Server-side validation is slower than client-side input validation. However, server-side input validation is more reliable than client-side input validation. Thus, it’s safe to say that client-side data validation improves user experience while server-side input validation improves security.

Here’s an example of server-side input validation in Microsoft ASP.NET using C#:

Benefits of Input Validation

1. Improved User Experience

A major source of frustration for users is getting an input error when trying to make a request on a digital platform. These can be avoided by validating inputs so that users send inputs in an acceptable format and are duly warned when their inputs violate the guidelines. 

When done correctly, input validation improves user experience on a digital platform. It is the difference between platforms that users enjoy using and platforms that users avoid.

2. Increased Security

When managing internet resources that collect user data, security is of paramount concern. It can help avoid lawsuits and protect the integrity of the organization that owns the platform. 

Users who access a platform do so with an implicit trust that organizations will protect their data and use it in ethical ways.

3. Improved Error Prevention

Input validation does a lot to prevent errors from occurring. It reduces the ways in which a user can do something wrong on a digital platform, which ensures that the software performs much faster.

With proper input validation, the number of error handling codes and unit tests needed is significantly reduced. Many common mistakes are prevented by restricting the type of user inputs possible to what is expected.

4. Greater Performance

With reduced possibilities of error, a more performant software solution is more or less guaranteed. Because software programming is an exact science, it is vital to ensure the software solution obtains the data type it expects to perform in the way it’s built to operate.

5. Cleaner Data

Deep learning, machine learning, data analytics, and software engineering require a lot of data to perform efficiently. It thereby makes it imperative that clean data is gathered to make the process of feeding this data to the machine easier.

A lot of work is done by data analysts to clean up data before it’s ready for use. With input validation, the data obtained from the software is a lot cleaner, thus saving the data analysts’ time and increasing their efficiency.

Final Thoughts

Input validations are rather easy to set up. However, the impact of these validations cannot be overemphasized. The consequences for a platform without input validation can be far-reaching if compromised. Overall, understanding what validation parameters are required for a particular input is critical to ensuring proper validation is done. The use-case of most validation parameters needs to be adequately understood as it will aid proper input validation both on the client-side and the server-side.

Hear from the Spring team this January at SpringOne. >

All Guides

This guide walks you through the process of configuring a web application form to support validation.

You will build a simple Spring MVC application that takes user input and checks the input by using standard validation annotations. You will also see how to display the error message on the screen so that the user can re-enter input to make it be valid.

You can use this pre-initialized project and click Generate to download a ZIP file. This project is configured to fit the examples in this tutorial.

To manually initialize the project:

  1. Navigate to //start.spring.io. This service pulls in all the dependencies you need for an application and does most of the setup for you.

  2. Choose either Gradle or Maven and the language you want to use. This guide assumes that you chose Java.

  3. Click Dependencies and select Spring Web, Thymeleaf, and Validation.

  4. Click Generate.

  5. Download the resulting ZIP file, which is an archive of a web application that is configured with your choices.

If your IDE has the Spring Initializr integration, you can complete this process from your IDE.

You can also fork the project from Github and open it in your IDE or other editor.

The application involves validating a user’s name and age, so you first need to create a class that backs the form used to create a person. The following listing (from src/main/java/com/example/validatingforminput/PersonForm.java) shows how to do so:

package com.example.validatingforminput; import javax.validation.constraints.Min; import javax.validation.constraints.NotNull; import javax.validation.constraints.Size; public class PersonForm { @NotNull @Size(min=2, max=30) private String name; @NotNull @Min(18) private Integer age; public String getName() { return this.name; } public void setName(String name) { this.name = name; } public Integer getAge() { return age; } public void setAge(Integer age) { this.age = age; } public String toString() { return "Person(Name: " + this.name + ", Age: " + this.age + ")"; } }

The PersonForm class has two attributes: name and age. It is flagged with a few standard validation annotations:

  • @Size(min=2, max=30): Allows names between 2 and 30 characters long.

  • @NotNull: Does not allow a null value, which is what Spring MVC generates if the entry is empty.

  • @Min(18): Does not allow the age to be less than 18.

In addition to that, you can also see getters and setters for name and age and a convenient toString() method.

Now that you have defined a form-backing object, it is time to create a simple web controller. The following listing (from src/main/java/com/example/validatingforminput/WebController.java) shows how to do so:

package com.example.validatingforminput; import javax.validation.Valid; import org.springframework.stereotype.Controller; import org.springframework.validation.BindingResult; import org.springframework.web.bind.annotation.GetMapping; import org.springframework.web.bind.annotation.PostMapping; import org.springframework.web.servlet.config.annotation.ViewControllerRegistry; import org.springframework.web.servlet.config.annotation.WebMvcConfigurer; @Controller public class WebController implements WebMvcConfigurer { @Override public void addViewControllers(ViewControllerRegistry registry) { registry.addViewController("/results").setViewName("results"); } @GetMapping("/") public String showForm(PersonForm personForm) { return "form"; } @PostMapping("/") public String checkPersonInfo(@Valid PersonForm personForm, BindingResult bindingResult) { if (bindingResult.hasErrors()) { return "form"; } return "redirect:/results"; } }

This controller has a GET method and a POST method. Both methods are mapped to /.

The showForm method returns the form template. It includes a PersonForm in its method signature so that the template can associate form attributes with a PersonForm.

The checkPersonInfo method accepts two arguments:

  • A personForm object marked with @Valid to gather the attributes filled out in the form.

  • A bindingResult object so that you can test for and retrieve validation errors.

You can retrieve all the attributes from the form, which is bound to the PersonForm object. In the code, you test for errors. If you encounter an error, you can send the user back to the original form template. In that situation, all the error attributes are displayed.

If all of the person’s attribute are valid, it redirects the browser to the final results template.

Now build the “main” page, as the following listing (from src/main/resources/templates/form.html) shows:

<!DOCTYPE HTML> <html xmlns:th="//www.thymeleaf.org"> <body> <form action="#" th:action="@{/}" th:object="${personForm}" method="post"> <table> <tr> <td>Name:</td> <td><input type="text" th:field="*{name}" /></td> <td th:if="${#fields.hasErrors('name')}" th:errors="*{name}">Name Error</td> </tr> <tr> <td>Age:</td> <td><input type="text" th:field="*{age}" /></td> <td th:if="${#fields.hasErrors('age')}" th:errors="*{age}">Age Error</td> </tr> <tr> <td><button type="submit">Submit</button></td> </tr> </table> </form> </body> </html>

The page contains a simple form, with each of its field in a separate cell in a table. The form is geared to post to /. It is marked as being backed up by the personForm object that you saw in the GET method in the web controller. This is known as a “bean-backed form”. There are two fields in the PersonForm bean, and you can see that they are tagged with th:field="*{name}" and th:field="*{age}". Next to each field is a secondary element that is used to show any validation errors.

Finally, you have a button that submits the form. In general, if the user enters a name or age that violates the @Valid constraints, it bounces back to this page with the error message displayed. If a valid name and age is entered, the user is routed to the next web page.

The following example (from src/main/resources/templates/results.html) shows the results page:

<html> <body> Congratulations! You are old enough to sign up for this site. </body> </html>

In this simple example, these web pages do not have any sophisticated CSS or JavaScript.

For this application, you are using the template language of Thymeleaf. This application needs more than raw HTML. The Spring Initializr created an application class for you. The following listing (from src/main/java/com/example/validatingforminput/ValidatingFormInputApplication.java) shows that class:

package com.example.validatingforminput; import org.springframework.boot.SpringApplication; import org.springframework.boot.autoconfigure.SpringBootApplication; @SpringBootApplication public class ValidatingFormInputApplication { public static void main(String[] args) throws Exception { SpringApplication.run(ValidatingFormInputApplication.class, args); } }

To activate Spring MVC, you would normally add @EnableWebMvc to the Application class. But Spring Boot’s @SpringBootApplication already adds this annotation when it detects spring-webmvc on your classpath. This same annotation lets it find the annotated @Controller class and its methods.

The Thymeleaf configuration is also taken care of by @SpringBootApplication. By default, templates are located in the classpath under templates/ and are resolved as views by stripping the '.html' suffix off the file name. (Thymeleaf settings can be changed and overridden in a variety of ways, depending on what you need to achieve, but the details are not relevant to this guide.)

You can run the application from the command line with Gradle or Maven. You can also build a single executable JAR file that contains all the necessary dependencies, classes, and resources and run that. Building an executable jar makes it easy to ship, version, and deploy the service as an application throughout the development lifecycle, across different environments, and so forth.

If you use Gradle, you can run the application by using ./gradlew bootRun. Alternatively, you can build the JAR file by using ./gradlew build and then run the JAR file, as follows:

java -jar build/libs/gs-validating-form-input-0.1.0.jar

If you use Maven, you can run the application by using ./mvnw spring-boot:run. Alternatively, you can build the JAR file with ./mvnw clean package and then run the JAR file, as follows:

java -jar target/gs-validating-form-input-0.1.0.jar

The application should be up and running within a few seconds.

The following pair of images show what happens if you enter N for the name and 15 for your age and click on Submit:

The preceding images show that, because the values violated the constraints in the PersonForm class, you get bounced back to the “main” page. Note that, if you click on Submit with nothing in the entry box, you get a different error, as the following image shows:

If you enter a valid name and age, you end up on the results page, as the following image shows:

Congratulations! You have coded a simple web application with validation built into a domain object. This way, you can ensure that the data meets certain criteria and that the user correctly inputs the data.

Postingan terbaru

LIHAT SEMUA