![The most common web application security weakness is the failure to properly validate input from the client or environment. - OWASP[1]](https://image.slidesharecdn.com/datavalidationinwebapplications-110621063012-phpapp02/85/Data-validation-in-web-applications-4-320.jpg)
![JavaScript Validation“Current” solution, useful & widely supported (Probably about 95%)Any JavaScript errors and validation disappearsFairly difficult to implement, though libraries help[3]](https://image.slidesharecdn.com/datavalidationinwebapplications-110621063012-phpapp02/85/Data-validation-in-web-applications-11-320.jpg)
![JavaScript Validation: EmailIs this a good email regex?\b[A-Z0-9._%+-]+@[A-Z0-9.-]+\.[A-Z]{2,4}\bYes, except when it isn’tNon-english, some TLDs not covered, no special charsHow about this (RFC 2822)?(?:[a-z0-9!#$%&'*+/=?^_`{|}~-]+(?:\.[a-z0-9!#$%&'*+/=?^_`{|}~-]+)*|"(?:[\x01-\x08\x0b\x0c\x0e-\x1f\x21\x23-\x5b\x5d-\x7f]|\\[\x01-\x09\x0b\x0c\x0e-\x7f])*")@(?:(?:[a-z0-9](?:[a-z0-9-]*[a-z0-9])?\.)+[a-z0-9](?:[a-z0-9-]*[a-z0-9])?|\[(?:(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.){3}(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?|[a-z0-9-]*[a-z0-9]:(?:[\x01-\x08\x0b\x0c\x0e-\x1f\x21-\x5a\x53-\x7f]|\\[\x01-\x09\x0b\x0c\x0e-\x7f])+)\])Allows some crazy stuff, like \@scott\@=k@domain.com](https://image.slidesharecdn.com/datavalidationinwebapplications-110621063012-phpapp02/85/Data-validation-in-web-applications-12-320.jpg)
![HTML5 Constraint ValidationRequired<input type=“text” required />MaxLength<input type=“text” maxlength=“10” />Pattern<input type=“text” pattern=“[0-9]{5}” />](https://image.slidesharecdn.com/datavalidationinwebapplications-110621063012-phpapp02/85/Data-validation-in-web-applications-23-320.jpg)
Data validation in web applications
- 1. Data Validation in Web ApplicationsWelcome to:
- 2. Hi! I’m Scott KirklandSlinging code @ UCDavis for 8 yearsCurrently Sr. Application Architect for the College Of Agricultural and Environmental Sciences Dean’s OfficeOpen source coderhttps://github.com/srkirklandMvcHtml5, Data Annotations Extensions, ITSecuritySymposiumhttps://github.com/ucdavisUCDArch, Web ApplicationsCo-founded the local .NET User Group
- 3. Data Validation in Web ApplicationsWelcome to:
- 4. The most common web application security weakness is the failure to properly validate input from the client or environment. - OWASP[1]
- 6. Aka: Trust No One Data
- 8. Topics:
- 9. Input Validation in Web FormsEnsure user supplied data is Strongly typedCorrect syntaxWithin length boundariesContains only permitted charactersOr that numbers are correctly signed and within range boundariesIs “business rule correct”
- 10. Client Side ValidationValidate data on the client firstProvides better feedback to the end userMakes your site feel more responsiveAlways validate on server-side as well!
- 11. JavaScript Validation“Current” solution, useful & widely supported (Probably about 95%)Any JavaScript errors and validation disappearsFairly difficult to implement, though libraries help[3]
- 12. JavaScript Validation: EmailIs this a good email regex?\b[A-Z0-9._%+-]+@[A-Z0-9.-]+\.[A-Z]{2,4}\bYes, except when it isn’tNon-english, some TLDs not covered, no special charsHow about this (RFC 2822)?(?:[a-z0-9!#$%&'*+/=?^_`{|}~-]+(?:\.[a-z0-9!#$%&'*+/=?^_`{|}~-]+)*|"(?:[\x01-\x08\x0b\x0c\x0e-\x1f\x21\x23-\x5b\x5d-\x7f]|\\[\x01-\x09\x0b\x0c\x0e-\x7f])*")@(?:(?:[a-z0-9](?:[a-z0-9-]*[a-z0-9])?\.)+[a-z0-9](?:[a-z0-9-]*[a-z0-9])?|\[(?:(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.){3}(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?|[a-z0-9-]*[a-z0-9]:(?:[\x01-\x08\x0b\x0c\x0e-\x1f\x21-\x5a\x53-\x7f]|\\[\x01-\x09\x0b\x0c\x0e-\x7f])+)\])Allows some crazy stuff, like \@scott\@[email protected]
- 13. Input Validation w/ HTML5
- 14. HTML5 Input ValidationTwo major form validation innovationsNew Input TypesConstraint Validation
- 15. HTML5 Input TypesNew input types were added to augment<input type=“text” />
- 17. HTML5 Input TypesGives semantic meaning to your formsEnable behaviors based on input type
- 18. DEMO: Html5 Input Types
- 19. HTML5 Input TypesSo, that was pretty coolSimply changing input types can add basic validationBenefits go beyond validationAdditive only – no drawbacks
- 20. HTML5 Input Types<input type=“email” /><input type=“url” />
- 21. HTML5 Input Types<input type=“tel” /><input type=“number” />
- 23. HTML5 Constraint ValidationRequired<input type=“text” required />MaxLength<input type=“text” maxlength=“10” />Pattern<input type=“text” pattern=“[0-9]{5}” />
- 25. Of course, this only works in HTML5 capable browsersOlder browsers will ignore these new attributesWith JavaScript you can “Polyfill” for “regressive” enhancement
- 26. One More Thing…
- 27. PolyfillA polyfill, or polyfiller, is a piece of code (or plugin) that provides the technology that you, the developer, expect the browser to provide nativelyGenerally, you test the browser for a feature. If it is not present natively, use JavaScript to add the feature
- 28. Develop for tomorrow… today!Great library called Modernizrhttp://www.modernizr.com/Helps with feature detection & media queriesAllows older browsers to work with Html5 elementsMuch more
- 29. DEMO: Polyfills
- 30. HTML5 Data Validation:Pragmatic Advice
- 31. Use the new input types They may do data validation for youMake your users happy (iOS & more)They will keep getting betterNative experience
- 32. Constraint ValidationUseful for “first line of defense” or backupYou should continue to use JavaScript for client validation
- 33. Recap: Validating Web FormsMakes the experience better for your usersResults in better, more reliable dataFirst line of defense against a plethora of vulnerabilities
- 35. Thanks for listeningI’m Scott KirklandEmail: [email protected]: http://weblogs.asp.net/srkirkland/GitHub:Personal: https://github.com/srkirkland/UCDavis: https://github.com/ucdavis/Slides and demo:https://github.com/srkirkland/ITSecuritySymposium
Editor's Notes
- #3: Scott Kirkland has been writing web applications at UC Davis for eight years, currently in his capacity as Senior Application Architect for the College of Agricultural and Environmental Sciences Dean's Office. Scott has also created and released several open-source projects including the architectural framework UCDArch (https://github.com/ucdavis/UCDArch) for developing secure ASP.NET MVC applications at UC Davis, as well as DataAnnotationsExtensions (http://dataannotationsextensions.org) for extending client and server validation in .NET applications. Scott enjoys educating other developers and co-founded the UC Davis .NET User Group and recently led a three day workshop about ASP.NET MVC for several dozen UC Davis developers.
- #5: The most common web application security weakness is the failure to properly validate input from the client or environment. This weakness leads to almost all of the major vulnerabilities in applications, such as Interpreter Injection, locale/Unicode attacks, file system attacks and buffer overflows. Data from the client should never be trusted for the client has every possibility to tamper with the data.
- #8: Possibly include Sql Injection, Xss,etc
- #9: Possibly include Xss, depending on time
- #10: https://www.owasp.org/index.php/Data_Validation#Data_Validation_and_Interpreter_Injection
- #11: Might decrease bandwidth
- #12: “Current” because it isn’t really going to go anywhere, but it is “all we have”Most frameworks don’t come with much in the way of help, and when they do its complex and they contain lots of messy JavaScript.
- #13: May not want to use this slide…
- #14: Html5 to the rescue?
- #16: Type=“text” but what kind of text? HTML5 goes further
- #17: Search – assistive technologies like screen reader
- #18: Type=“text” but what kind of text? HTML5 goes further
- #19: <input type='text' /> Show output, looks like regular text box<input type='email' /> Show output, looks the same, but show how iphone and opera treat it differently. Also, type='email' validates email!Same thing with url <input type='url' />Same with number <input type='number' /> Even can do min/max with number
- #20: You could style them independently, different sizes for email, etc
- #21: Also tel you get the keypad, number you get a special input tooScreenshots from http://diveintohtml5.org/forms.html
- #22: Also tel you get the keypad, number you get a special input tooScreenshots from http://diveintohtml5.org/forms.html
- #25: http://miketaylr.com/code/input-type-attr.htmlShow in FF, Chrome, Explorer (nothing breaks with explorer, completely additive)
- #27: Html5 validation constraints
- #28: http://remysharp.com/2010/10/08/what-is-a-polyfill/
- #29: Widely used: Google, Twitter, Microsoft (ships with MVC)
- #30: http://miketaylr.com/code/input-type-attr.htmlShow in FF, Chrome, Explorer (nothing breaks with explorer, completely additive)
- #32: Really, no downside
- #33: Really,no downside