Why use Client Side Input Validation in JavaScript Applications (Along with server side)

Blog: medium.com/@bedmuthaapoorv/why-use-client-side-inp…

Free Newsletter: medium.com/@bedmuthaapoorv/subscribe

In OWASP’s secure coding checklist, the first recommendation they have is

Conduct all input validation on a trusted system (server side not client side)

which I strongly disagree with. An Input validation experience should be secure but not at the expense of user experience. Using input validation on both client side and server side can bring the best of both worlds together.

#frontend #backend #devops #systemdesign

Client side input validation will validate whether all inputs provided are of valid format, type and structure, whereas Server side input validation will actually run detailed validation logic on it which might include communicating with our database or auth server, encryption, decryption, caching etc.

Benefits
Minimized server calls: Since we are verified the input format on client-side, this eliminates the invalid inputs from making a call
Form completion: With use of fields like “required” mandatory data can be enforced.
User feedback: User does not have to wait for getting a response a server to know that they have provided invalid input, rather they immediately are notified about the same on the screen due to client side validation. This provides quick feedback as compared to relying completely on server side.
Early error detection
Pre-processing: Input provided can undergo operations to make it optimal for consumption by the backend. this includes steps such as whitespace removal, data type conversion, encryption, hashing, etc.
Why not rely completely on Client side
User can turn off JavaScript on their browser, which will basically let them bypass this validation. Hence, Input validation is required on both client side and server side
By relying completely on client side, we will end up exposing API tokens, Service keys that we use to communicate with our Database and cloud servers. As often these are part of Network requests we make to our DBs and Servers.
Types of Validation
1. Enforcing mandatory fields
2. Data type validation
3. Min length and Max length
4. Regex validation / format validation
5. Input range validation
6. Custom Validation