Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Rethinking Auth for SPAs and Micro Frontends: ...

Sponsored · Your Podcast. Everywhere. Effortlessly. Share. Educate. Inspire. Entertain. You do you. We'll handle the rest. →
Avatar for Manfred Steyer Manfred Steyer PRO
September 26, 2022
Programming
270
0

Rethinking Auth for SPAs and Micro Frontends: Easy and Secure With Gateways

Avatar for Manfred Steyer

Manfred Steyer PRO

September 26, 2022

More Decks by Manfred Steyer

See All by Manfred Steyer
Agentic AI in the Frontend: Architectures with Open Standards @iJS London 2026
Avatar for Manfred Steyer manfredsteyer
PRO
0
38
Agentic AI & UI: Arcitecture, HITL, Emerging Standards
Avatar for Manfred Steyer manfredsteyer
PRO
0
35
Agentic UI Requires Standards: AG-UI, A2UI, and MCP Apps Work Together @Angular London
Avatar for Manfred Steyer manfredsteyer
PRO
1
36
Signal Forms: Beyond the Basics @ngBelgrade 2026
Avatar for Manfred Steyer manfredsteyer
PRO
0
120
Agentic UI in the Frontend: Architectures with Open Standards @JAX 2026 in Mainz
Avatar for Manfred Steyer manfredsteyer
PRO
0
97
Rethinking Angular: The Future with Signal Store and the New Resource API @JAX 2024 in Mainz
Avatar for Manfred Steyer manfredsteyer
PRO
0
60
Agentic UI with Angular @ngAir April 2025
Avatar for Manfred Steyer manfredsteyer
PRO
0
170
Migration to Signals, Signal Forms, Resource API, and NgRx Signal Store @Angular Days 03/2026 Munich
Avatar for Manfred Steyer manfredsteyer
PRO
0
340
AI Assistants for Your Angular Solutions @Angular Graz, March 2026
Avatar for Manfred Steyer manfredsteyer
PRO
0
200

Other Decks in Programming

See All in Programming
cloudnative conference 2026 flyle
Avatar for azihsoyn azihsoyn
0
100
My daily life on Ruby
Avatar for Akira Matsuda a_matsuda
3
180
Augmenting AI with the Power of Jakarta EE
Avatar for ivargrimstad ivargrimstad
0
160
クラウドネイティブなエンジニアに向ける Raycastの魅力と実際の活用事例
Avatar for Nealle nealle
2
240
The Past, Present, and Future of Enterprise Java
Avatar for ivargrimstad ivargrimstad
0
130
2026年のソフトウェア開発を考える（2026/05版） / Software Engineering Scrum Fest Niigata 2026 Edition
Avatar for Takuto Wada twada
PRO
21
11k
Lightning-Fast Method Calls with Ruby 4.1 ZJIT / RubyKaigi 2026
Avatar for Takashi Kokubun k0kubun
3
2.5k
【26新卒研修資料】TDD実装演習
Avatar for ディップ株式会社 dip_tech
PRO
0
170
Explore CoroutineScope
Avatar for tomoEng11 tomoeng11
0
160
Surviving Black Friday: 329 billion requests with Falcon!
Avatar for Samuel Williams ioquatix
0
2.8k
Spec Driven Development | AI Summit Vilnius
Avatar for Daniel Sogl danielsogl
PRO
1
140
AIベース静的検査器の偽陽性率を抑える工夫3選
Avatar for Kuniwak orgachem
PRO
4
440

Featured

See All Featured
Art, The Web, and Tiny UX
Avatar for Lynn Fisher lynnandtonic
304
21k
The Illustrated Guide to Node.js - THAT Conference 2024
Avatar for David Neal reverentgeek
1
340
Effective software design: The role of men in debugging patriarchy in IT @ Voxxed Days AMS
Avatar for Kenny Baas-Schwegler baasie
0
340
Typedesign – Prime Four
Avatar for Hannes Fritz hannesfritz
42
3k
Google's AI Overviews - The New Search
Avatar for Barry Adams badams
0
1k
B2B Lead Gen: Tactics, Traps & Triumph
Avatar for Sophie Logan marketingsoph
0
110
The Success of Rails: Ensuring Growth for the Next 100 Years
Avatar for Eileen M. Uchitelle eileencodes
47
8.1k
Being A Developer After 40
Avatar for Adrian Kosmaczewski akosma
91
590k
How to audit for AI Accessibility on your Front & Back End
Avatar for davetheseo davetheseo
0
360
HU Berlin: Industrial-Strength Natural Language Processing with spaCy and Prodigy
Avatar for Ines Montani inesmontani
PRO
0
370
How To Stay Up To Date on Web Technology
Avatar for Chris Coyier chriscoyier
790
250k
Kristin Tynski - Automating Marketing Tasks With AI
Avatar for Tech SEO Connect techseoconnect
PRO
0
240

Transcript

  1. @ManfredSteyer ManfredSteyer Manfred Steyer, ANGULARarchitects.io

  2. @ManfredSteyer Folie▪ 2 Client Authorization-Server Resource-Server

  3. @ManfredSteyer Folie▪ 3 Client Authorization-Server Resource-Server 1. Redirection 2. Redirect

    w/ (Code for) Access-Token in Query String 3. Access-Token

  4. @ManfredSteyer Folie▪ 4 Client Authorization-Server Resource-Server 1. Redirection 2. Redirect

    w/ (Code for) Access-Token and Id-Token 3. Access-Token User Info Endpoint (OIDC)

  5. @ManfredSteyer

  6. @ManfredSteyer

  7. @ManfredSteyer Manfred Steyer

  8. @ManfredSteyer

  9. @ManfredSteyer

  10. @ManfredSteyer

  11. @ManfredSteyer Several suggestions for using OAuth 2 in a more

    secure way

  12. @ManfredSteyer Example: Using Code Flow + PKCE instead of Implicit

    Flow

  13. @ManfredSteyer Remaining Problem: XSS -> Stealing Tokens

  14. @ManfredSteyer

  15. @ManfredSteyer Why Token Refresh? Short living Tokens increase Security Users

    don't want to login over and over again

  16. @ManfredSteyer Folie▪ 23 Client Authorization-Server Resource-Server 1. Redirection 2. Code

    for Access-Token und Id-Token and Refresh-Token

  17. @ManfredSteyer Folie▪ 24 Client Authorization-Server Resource-Server 3. Refresh-Token 4. Code

    for Access-Token und Id-Token and new Refresh-Token

  18. @ManfredSteyer * with conditions …

  19. @ManfredSteyer

  20. @ManfredSteyer

  21. @ManfredSteyer Client Gateway Authorization-Server Resource-Server Access-Token Id-Token Refresh-Token HTTP-only Cookie

    Static Files (SPA) + XSRF Token SameSite +

  22. @ManfredSteyer Client Gateway Authorization-Server Resource-Server 1 Access-Token Id-Token Refresh-Token HTTP-only

    Cookie Static Files (SPA) Resource-Server 2 ⁉️

  23. @ManfredSteyer

  24. @ManfredSteyer

  25. @ManfredSteyer

  26. @ManfredSteyer

  27. @ManfredSteyer

  28. @ManfredSteyer DEMO

  29. @ManfredSteyer Demo • SPA: https://purple-flower-021fa1b03.azurestaticapps.net/home • SPA behind Security Gateway:

    https://demo-auth-gateway.azurewebsites.net/home • Source Code for Gateway: https://github.com/manfredsteyer/yarp-auth-proxy • Source Code for Auth in SPA: https://github.com/manfredsteyer/auth-gateway-client/

  30. @ManfredSteyer Conclusion Browser: No Safe Place for Tokens Gateway: Generic

    Implementation Token Refresh Easier + More Secure

  31. @ManfredSteyer d Slides & Examples Remote and In-House http://softwarearchitekt.at/workshops