Data validation in web applications
-
Upload
srkirkland -
Category
Documents
-
view
9.989 -
download
0
Transcript of Data validation in web applications
![Page 1: Data validation in web applications](https://reader036.fdocuments.net/reader036/viewer/2022062823/586f76e81a28ab10258b6635/html5/thumbnails/1.jpg)
Data Validation in Web Applications
Welcome to:
![Page 2: Data validation in web applications](https://reader036.fdocuments.net/reader036/viewer/2022062823/586f76e81a28ab10258b6635/html5/thumbnails/2.jpg)
Hi! I’m Scott Kirkland Slinging code @ UCDavis for 8 years Currently Sr. Application Architect
for the College Of Agricultural and Environmental Sciences Dean’s Office
Open source coderhttps://github.com/srkirkland
○ MvcHtml5, Data Annotations Extensions, ITSecuritySymposium
https://github.com/ucdavis○ UCDArch, Web Applications
Co-founded the local .NET User Group
![Page 3: Data validation in web applications](https://reader036.fdocuments.net/reader036/viewer/2022062823/586f76e81a28ab10258b6635/html5/thumbnails/3.jpg)
Data Validation in Web Applications
Welcome to:
![Page 4: Data validation in web applications](https://reader036.fdocuments.net/reader036/viewer/2022062823/586f76e81a28ab10258b6635/html5/thumbnails/4.jpg)
The most common web application security
weakness is the failure to properly validate
input from the client or environment.
- OWASP[1]
![Page 5: Data validation in web applications](https://reader036.fdocuments.net/reader036/viewer/2022062823/586f76e81a28ab10258b6635/html5/thumbnails/5.jpg)
![Page 6: Data validation in web applications](https://reader036.fdocuments.net/reader036/viewer/2022062823/586f76e81a28ab10258b6635/html5/thumbnails/6.jpg)
Input Validation
![Page 7: Data validation in web applications](https://reader036.fdocuments.net/reader036/viewer/2022062823/586f76e81a28ab10258b6635/html5/thumbnails/7.jpg)
Input Validation in Web FormsEnsure user supplied data is Strongly typed Correct syntax Within length boundaries Contains only permitted characters Or that numbers are correctly signed
and within range boundaries Is “business rule correct”
![Page 8: Data validation in web applications](https://reader036.fdocuments.net/reader036/viewer/2022062823/586f76e81a28ab10258b6635/html5/thumbnails/8.jpg)
Client Side ValidationValidate data on the client first
Provides better feedback to the end user
Makes your site feel more responsive
Always validate on server-side as well!
![Page 9: Data validation in web applications](https://reader036.fdocuments.net/reader036/viewer/2022062823/586f76e81a28ab10258b6635/html5/thumbnails/9.jpg)
JavaScript Validation “Current” solution, useful & widely
supported (Probably about 95%)
Any JavaScript errors and validation disappears
Fairly difficult to implement, though libraries help[3]
![Page 10: Data validation in web applications](https://reader036.fdocuments.net/reader036/viewer/2022062823/586f76e81a28ab10258b6635/html5/thumbnails/10.jpg)
Input Validation w/ HTML5
![Page 11: Data validation in web applications](https://reader036.fdocuments.net/reader036/viewer/2022062823/586f76e81a28ab10258b6635/html5/thumbnails/11.jpg)
HTML5 Input Validation
Two major form validation innovations
1. New Input Types
2. Constraint Validation
![Page 12: Data validation in web applications](https://reader036.fdocuments.net/reader036/viewer/2022062823/586f76e81a28ab10258b6635/html5/thumbnails/12.jpg)
HTML5 Input TypesNew input types were added to augment<input type=“text” />
![Page 13: Data validation in web applications](https://reader036.fdocuments.net/reader036/viewer/2022062823/586f76e81a28ab10258b6635/html5/thumbnails/13.jpg)
HTML5 Input Types search tel url email number range color
datetime date month week time datetime-local
![Page 14: Data validation in web applications](https://reader036.fdocuments.net/reader036/viewer/2022062823/586f76e81a28ab10258b6635/html5/thumbnails/14.jpg)
HTML5 Input Types
Gives semantic meaning to your forms
Enable behaviors based on input type
![Page 15: Data validation in web applications](https://reader036.fdocuments.net/reader036/viewer/2022062823/586f76e81a28ab10258b6635/html5/thumbnails/15.jpg)
DEMO: Html5 Input Types
![Page 16: Data validation in web applications](https://reader036.fdocuments.net/reader036/viewer/2022062823/586f76e81a28ab10258b6635/html5/thumbnails/16.jpg)
HTML5 Input TypesSo, that was pretty cool
Simply changing input types can add basic validation
Benefits go beyond validation
Additive only – no drawbacks
![Page 17: Data validation in web applications](https://reader036.fdocuments.net/reader036/viewer/2022062823/586f76e81a28ab10258b6635/html5/thumbnails/17.jpg)
HTML5 Input Types
<input type=“email” /> <input type=“url” />
![Page 18: Data validation in web applications](https://reader036.fdocuments.net/reader036/viewer/2022062823/586f76e81a28ab10258b6635/html5/thumbnails/18.jpg)
HTML5 Input Types
<input type=“tel” /> <input type=“number” />
![Page 19: Data validation in web applications](https://reader036.fdocuments.net/reader036/viewer/2022062823/586f76e81a28ab10258b6635/html5/thumbnails/19.jpg)
HTML5 Constraint Validation Required
Pattern
MaxLength
Min/Max
![Page 20: Data validation in web applications](https://reader036.fdocuments.net/reader036/viewer/2022062823/586f76e81a28ab10258b6635/html5/thumbnails/20.jpg)
HTML5 Constraint ValidationRequired<input type=“text” required />
MaxLength<input type=“text” maxlength=“10” />
Pattern<input type=“text” pattern=“[0-9]{5}” />
![Page 21: Data validation in web applications](https://reader036.fdocuments.net/reader036/viewer/2022062823/586f76e81a28ab10258b6635/html5/thumbnails/21.jpg)
DEMO: Html5 Constraints
![Page 22: Data validation in web applications](https://reader036.fdocuments.net/reader036/viewer/2022062823/586f76e81a28ab10258b6635/html5/thumbnails/22.jpg)
Of course, this only works in HTML5 capable browsers
Older browsers will ignore these new attributes
With JavaScript you can “Polyfill” for “regressive” enhancement
![Page 23: Data validation in web applications](https://reader036.fdocuments.net/reader036/viewer/2022062823/586f76e81a28ab10258b6635/html5/thumbnails/23.jpg)
One More Thing…
![Page 24: Data validation in web applications](https://reader036.fdocuments.net/reader036/viewer/2022062823/586f76e81a28ab10258b6635/html5/thumbnails/24.jpg)
Polyfill A polyfill, or polyfiller, is a piece of code
(or plugin) that provides the technology that you, the developer, expect the browser to provide natively
Generally, you test the browser for a feature. If it is not present natively, use JavaScript to add the feature
![Page 25: Data validation in web applications](https://reader036.fdocuments.net/reader036/viewer/2022062823/586f76e81a28ab10258b6635/html5/thumbnails/25.jpg)
Develop for tomorrow… today! Great library called Modernizr
http://www.modernizr.com/
Helps with feature detection & media queries
Allows older browsers to work with Html5 elements
Much more
![Page 26: Data validation in web applications](https://reader036.fdocuments.net/reader036/viewer/2022062823/586f76e81a28ab10258b6635/html5/thumbnails/26.jpg)
DEMO: Polyfills
![Page 27: Data validation in web applications](https://reader036.fdocuments.net/reader036/viewer/2022062823/586f76e81a28ab10258b6635/html5/thumbnails/27.jpg)
HTML5 Data Validation:
Pragmatic Advice
![Page 28: Data validation in web applications](https://reader036.fdocuments.net/reader036/viewer/2022062823/586f76e81a28ab10258b6635/html5/thumbnails/28.jpg)
Use the new input types They may do data validation for you
Make your users happy (iOS & more)
They will keep getting better
Native experience
![Page 29: Data validation in web applications](https://reader036.fdocuments.net/reader036/viewer/2022062823/586f76e81a28ab10258b6635/html5/thumbnails/29.jpg)
Constraint Validation Useful for “first line of defense” or
backup
You should continue to use JavaScript for client validation
![Page 30: Data validation in web applications](https://reader036.fdocuments.net/reader036/viewer/2022062823/586f76e81a28ab10258b6635/html5/thumbnails/30.jpg)
Recap: Validating Web Forms Makes the experience better for your
users
Results in better, more reliable data
First line of defense against a plethora of vulnerabilities
![Page 31: Data validation in web applications](https://reader036.fdocuments.net/reader036/viewer/2022062823/586f76e81a28ab10258b6635/html5/thumbnails/31.jpg)
![Page 32: Data validation in web applications](https://reader036.fdocuments.net/reader036/viewer/2022062823/586f76e81a28ab10258b6635/html5/thumbnails/32.jpg)
Thanks for listening I’m Scott Kirkland Email: [email protected] Web: http://weblogs.asp.net/srkirkland/ GitHub:
Personal: https://github.com/srkirkland/UCDavis: https://github.com/ucdavis/
Slides and demo: https://github.com/srkirkland/ITSecuritySymposium