🧤 request and response caching

Author: SAINIAbhishek

README.md

@@ -11,6 +11,7 @@ This project was generated with [Angular CLI](https://github.com/angular/angular
 - Angular Material (https://material.angular.io/guide/getting-started)
 - Angular Universal (https://angular.io/guide/universal)
 - Webpack
+- Web Caching
 
 ## Development server
 

src/app/interceptors/caching.interceptor.ts

@@ -0,0 +1,50 @@
+import { Injectable } from '@angular/core';
+import {
+  HttpRequest,
+  HttpHandler,
+  HttpEvent,
+  HttpInterceptor, HttpResponse
+} from '@angular/common/http';
+import {Observable, of} from 'rxjs';
+import {tap} from 'rxjs/operators';
+import {HttpCacheService} from '../services/http-cache/http-cache.service';
+
+@Injectable()
+export class CachingInterceptor implements HttpInterceptor {
+
+  constructor(private httpCacheService: HttpCacheService) {}
+
+  public intercept(request: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
+
+    if (request.method !== 'GET') {
+      return next.handle(request);
+    }
+
+    if (request.headers.get('cache') === 'clear') {
+      this.httpCacheService.clearCache();
+    }
+
+    if (request.headers.get('cache') === 'reset') {
+      this.httpCacheService.delete(request.urlWithParams);
+    }
+
+    const cachedResponse = this.httpCacheService.get(request.urlWithParams);
+
+    if (cachedResponse) {
+      return of(cachedResponse.clone());
+    }
+
+    /**
+     * request is going for the first time then let the request process
+     * and cache the response
+     */
+    return next.handle(request).pipe(
+      tap( (event) => {
+        if (event instanceof HttpResponse) {
+          this.httpCacheService.set(request.urlWithParams, event.clone());
+        }
+      })
+    );
+
+  }
+}

src/app/services/http-cache/http-cache.service.ts

@@ -0,0 +1,29 @@
+import { Injectable } from '@angular/core';
+import { HttpResponse } from '@angular/common/http';
+
+@Injectable({
+  providedIn: 'root'
+})
+export class HttpCacheService {
+
+  private cache: Map<string, HttpResponse<any>> = new Map<string, HttpResponse<any>>();
+
+  constructor() { }
+
+  public get(url: string): HttpResponse<any> | undefined {
+    return this.cache[url];
+  }
+
+  public set(url: string, response: HttpResponse<any>): void {
+    this.cache[url] = response;
+  }
+
+  public clearCache(): void {
+    this.cache = new Map<string, HttpResponse<any>>();
+  }
+
+  public delete(url: string): void {
+    delete this.cache[url];
+  }
+
+}