philippederyck
play

@PhilippeDeRyck 3 @PhilippeDeRyck 4 @PhilippeDeRyck 5 3 Who - PowerPoint PPT Presentation

Jul 04, 2023 •773 likes •1.23k views

A UTHENTICATION WITH O PEN ID C ONNECT IN A NGULAR D R . P HILIPPE D E R YCK https://Pragmatic Web Security.com D R . P HILIPPE D E R YCK - Deep understanding of the web security landscape - Google Developer Expert (not employed by Google) -

  1. A UTHENTICATION WITH O PEN ID C ONNECT IN A NGULAR D R . P HILIPPE D E R YCK https://Pragmatic Web Security.com

  2. D R . P HILIPPE D E R YCK - Deep understanding of the web security landscape - Google Developer Expert (not employed by Google) - Course curator of the SecAppDev course (https://secappdev.org) Pragmatic Web Security High-quality security training for developers and managers Custom courses covering web security, API security, Angular security, … Consulting services on security, OAuth 2.0, OpenID Connect, … @P HILIPPE D E R YCK @PhilippeDeRyck 2 HTTPS ://P RAGMATIC W EB S ECURITY . COM

  3. @PhilippeDeRyck 3

  4. @PhilippeDeRyck 4

  5. @PhilippeDeRyck 5

  6. 3 Who that? 4 It's me, Philippe! 2 Follows the redirect to Github 1 Open Github for authentication @PhilippeDeRyck 6

  7. 3 Who that? 4 It's me, Philippe! 2 Follows the redirect to Github 1 Open Github for authentication @PhilippeDeRyck 7

  8. 3 Who that? 4 It's me, Philippe! 2 Follows the redirect to Github 1 Open Github for authentication @PhilippeDeRyck 8

  9. 3 Who that? 4 It's me, Philippe! 2 Follows the redirect to Github 1 Open Github for authentication @PhilippeDeRyck 9

  10. 3 Who that? 4 It's me, Philippe! 2 Follows the redirect to Github Redirect back to Netlify 5 with information about Philippe 1 Open Github for authentication 6 Follows redirect to Netlify 7 Github says it's Philippe. Hi Philippe! @PhilippeDeRyck 10

  11. 3 Who that? 4 It's me, Philippe! 2 Follows the redirect to Github Redirect back to Netlify 5 with information about Philippe 1 Open Github for authentication 6 Follows redirect to Netlify 7 Github says it's Philippe. Hi Philippe! @PhilippeDeRyck 11

  12. 3 Who that? 4 It's me, Philippe! 2 Follows the redirect to Github Redirect back to Netlify 5 with information about Philippe 1 Open Github for authentication 6 Follows redirect to Netlify 7 Github says it's Philippe. Hi Philippe! @PhilippeDeRyck 12

  13. Not part of the OIDC spec 3 Who that? 4 It's me, Philippe! 2 Follows the redirect to Github Redirect back to Netlify 5 with information about Philippe OpenID Connect 1 Open Github for authentication 6 Follows redirect to Netlify 7 Github says it's Philippe. Hi Philippe! @PhilippeDeRyck 13

  14. @PhilippeDeRyck 14

  15. @PhilippeDeRyck 15

  16. @PhilippeDeRyck 16

  17. @PhilippeDeRyck 17

  18. 3 Who that? On-premise or cloud-based 4 It's me, Philippe! 2 Follows the redirect to the identity provider Redirect back 5 with information about Philippe 1 Authenticate with my provider 6 Follows redirect 7 My provider says it's Philippe. Hi Philippe! @PhilippeDeRyck 18

  19. D ELEGATE AUTHENTICATION WITH O PEN ID C ONNECT Building a secure custom authentication mechanism is hard Identity providers are specialized in managing & authenticating users Offloading authentication makes sense, even in a non-SSO scenario @PhilippeDeRyck 19

  20. Obtain an authorization code User authentication Session Exchange code for identity token @PhilippeDeRyck 20

  21. Obtain an authorization code Obtain an authorization code Session Exchange code Exchange code for identity token for identity token @PhilippeDeRyck 21

  22. Obtain an authorization code Obtain an authorization code Call API with an OAuth 2.0 Session access token Exchange code Exchange code for identity token for identity token and access token @PhilippeDeRyck 22

  23. Obtain an authorization code Obtain an authorization code Call API with an OAuth 2.0 Session access token Exchange code for identity token Exchange code for identity token and access token Call API with and access token an OAuth 2.0 access token @PhilippeDeRyck 23

  24. @PhilippeDeRyck 24

  25. R EDIRECT FROM N ETLIFY TO G ITHUB 1 2 GitHub's OIDC endpoint https://github.com/openid-connect/auth Indicates the OIDC hybrid flow ?response_type=id_token code &client_id=NetlifyClient Requests access to user's identity information &scope=openid email profile &redirect_uri=https://netlify.com/codeCallback &state=s0wzojm2w8c23xzprkk6 &nonce=Bh91lG2QLb1jAiaha372 Redirect to Github 2 for authentication 1 Sign in with Github @PhilippeDeRyck 25

  26. 5 Request client authorization 3 Authenticate yourself 4 Login credentials 6 Authorize client Redirect to Github 2 for authentication 1 Sign in with Github @PhilippeDeRyck 26

  27. R EDIRECT FROM G ITHUB TO N ETLIFY 7 8 Approved redirect URI https://netlify.com/codeCallback Authorization code 5 ?code=q3AKQ...0X4UeQ Request client authorization JWT containing authentication information &id_token= eyJhbGciO...du6TY9w 3 Authenticate yourself &state=s0wzojm2w8c23xzprkk6 4 Login credentials 6 Authorize client Redirect to Github 2 for authentication Redirect with authorization code 7 and identity token 1 Sign in with Github 8 Authorization code and identity token @PhilippeDeRyck 27

  28. T HE IDENTITY TOKEN CONTAINS INFORMATION ABOUT THE USER ' S AUTHENTICATION 8 { Profile information about the user "name": "Philippe De Ryck", 5 Request client authorization "email": "philippe@pragmaticwebsecurity.com", 3 Authenticate yourself "email_verified": true, The identifier of the issuer of the token "iss": "https://github.com", "aud": "NetlifyClient", The intended audience for this token 4 Login credentials "iat": "1550400912", 6 Authorize client "exp": "1550422512", The unique ID of the user within the issuer "sub": "github|bBFd87uO9PDaVpOjZRB7", } Redirect to Github 2 for authentication Redirect with authorization code 7 and identity token 1 Sign in with Github 8 Authorization code and identity token @PhilippeDeRyck 28

  29. 5 Request client authorization 3 Authenticate yourself 4 Login credentials 6 Authorize client Authorization code 9 10 access token / refresh token Redirect to Github with client credentials 2 for authentication Redirect with authorization code 7 and identity token 1 Sign in with Github 11 Github repo 8 API Authorization code 12 Data to deploy and identity token @PhilippeDeRyck 29

  30. @PhilippeDeRyck 30

  31. 3 Authenticate yourself Frontends are no 4 Login credentials place to keep a secret. Authorization code 8 7 access token Redirect for with client credentials 2 authentication Redirect with authorization code 5 and identity token 1 Sign in 9 Github repo 6 API Authorization code 10 Data to deploy and identity token @PhilippeDeRyck 31

  32. 4 Store code challenge 10 Match code challenge to verifier 5 Authenticate yourself 6 PKCE replaces client Login credentials credentials with a "one-time password" Authorization code 11 Redirect for 9 access token with code verifier 3 authentication with code challenge Redirect with authorization code 7 and identity token 2 Sign in URL with code challenge 12 Github repo 8 API Authorization code 13 Data to deploy and identity token 1 Generate code verifier @PhilippeDeRyck 32

  33. @PhilippeDeRyck 33

  34. npm install angular-oauth2-oidc this.oauthService.initCodeFlow(); @PhilippeDeRyck 34

  35. npm install @auth0/auth0-spa-js this.auth0Client$.subscribe((client: Auth0Client) => { client.loginWithRedirect() }); @PhilippeDeRyck 35

  36. npm install keycloak-js keycloak.init({ flow: 'hybrid', promiseType: 'native', }) @PhilippeDeRyck 36

  37. U SE THE RIGHT OIDC FLOW FOR YOUR APPLICATION Both a backend and a frontend can use the OIDC hybrid flow Backends require client authentication & frontends require PKCE OIDC is typically used along with OAuth 2.0 to enable API access @PhilippeDeRyck 37

  38. @PhilippeDeRyck 38

  39. Authenticate with preferred provider 3 Redirect to Github 2 for authentication Redirect with authorization code 4 and identity token 1 Sign in with Github 5 Authorization code and identity token @PhilippeDeRyck 39

  40. Users Employees Allowing employees to be normal users as well 2 Identity brokering 1 Sign in Employee-only applications A public application available to all users @PhilippeDeRyck 40

  41. OIDC IS MORE THAN AUTHENTICATION ALONE OIDC also includes support for session management and logout Identity brokering enables the chaining of multiple identity providers Identity brokering is a crucial concept in enterprise architectures @PhilippeDeRyck 41

  42. F REE REE SE SECU CURITY CH CHEAT SH SHEETS FO FOR MO MODERN APPL APPLICATIONS https://cheatsheets.pragmaticwebsecurity.com/ @PhilippeDeRyck 42

  43. March 9 th – 13 th , 2020 Leuven, Belgium A week-long course on Secure Application Development Taught by experts from around the world 38 in-depth lectures and 3 one-day workshops https://secappdev.org A yearly initiative from the SecAppDev.org non-profit, since 2005 @PhilippeDeRyck 43

  44. T HANK YOU ! Follow me on Twitter to stay up to date on web security best practices @PhilippeDeRyck

Recommend

More recommend