Caught in the Middle! A story of HTTPModule and Interceptors

A presentation highlighting the benefits of migrating applications to leverage the power of HTTPClient Module over HTTP Api and HTTP Module for legacy enterprise scale applications.

Additionally, it is connected to a repo you can download, to play with GraphQL, ApolloClient, Lazy Loading in Angular, Authentication Guards and HTTP Interceptors.

GraphQL/Express Server: https://github.com/anfibiacreativa/myapp-server
Apollo Client: https://github.com/anfibiacreativa/myapp-apollo-interceptors

Transcript

1. Natalia Venditto @ ngVikings Copenhagen 2019 Caught in The Middle! Photo by Alexandre Debiève on Unsplash
2. Photo by Annie Spratt on Unsplash Photo by Hello I'm Nik on Unsplash Build us a very large app! It connects to Many apis!
4. Content Policies: Structure v2.0.0 v2.1.2 v2.2.4 v2.3.1 v2.4.3 v4.0.0 v5.2.2 https://github.com/angular/angular/blob /master/CHANGELOG.md
7. Hello? Can I have some data, pls? The typical HTTP over TCP/IP request/response thingy.
8. Ack! What’s your Exact request? The typical HTTP over TCP/IP request/response thingy.
9. Let me see,... We have some options... The typical HTTP over TCP/IP request/response thingy.
10. I can allow for that only if you give me the headsup The typical HTTP over TCP/IP request/response thingy.
11. What about a… Errm, some csrf token, a few cookies Aaaand, this credentials The typical HTTP over TCP/IP request/response thingy.
12. The typical HTTP request thingy. CoOL! You can now Get what you Pinged for!
13. Life BEFORE the HTTPClient Module
15. Life WITH the HTTPClient Module Mild-Panic Emoji by @cassidoo
16. TOKENS HTTPClient Module perks ... ▪ Typed req/res ▪ Observable based API’s ▪ Streamlined error handling ▪ Event progress ▪ Req/Res Interceptors
17. Photo by Annie Spratt on Unsplash Photo by Chris Moore on Unsplash Interceptors____
18. TOKENS Interceptors... ▪ Must be provided in the root module ▪ Get executed in the order provided
20. Interceptor 1 Interceptor 2 Interceptor N Interceptor N Interceptor 2 Interceptor 1 Request Response
21. TOKENS Interceptors use cases... ▪ Caching and logging data Catching errors ▪ Implementing authentication
22. Photo by Annie Spratt on Unsplash Photo by Keegan Houser on Unsplash JWTokens____
23. TOKENS Types of tokens ▪ XSRF (CSRF) Token ▪ Session validation token ▪ XYZ API Key… etc.
24. TOKENS Usually these tokens... ▪ Expire after each use in an idempotent request ▪ Must travel back and forth with each request
25. Photo by Annie Spratt on Unsplash Photo by Thierry Chabot on Unsplash RouteGuards___ _
26. TOKENS Route Guards... ▪ CanActivate ▪ CanactivateChild ▪ CanDeactivate ▪ CanLoad ▪ Resolve
27. TOKENS $ code .
28. Thank you! @anfibiacreativa All images are from unsplash.com Including all cats (By several authors) https://unsplash.com/search/photos/kitten Gifs by Tenor https://tenor.com Learn more at https://github.com/anfibiacreativa/myapp-apollo-interceptors