added AuthInterceptor for sending api key in the header on every request to api

src/app/app.module.ts

@@ -1,5 +1,6 @@
 import { NgModule, CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
 import { BrowserModule } from '@angular/platform-browser';
+import { HTTP_INTERCEPTORS, HttpClientModule } from '@angular/common/http';
 
 import { AppComponent } from './app.component';
 import { ContactSidebarComponent } from './contact-sidebar/contact-sidebar.component';
@@ -10,7 +11,8 @@ import { ProjectsComponent } from './projects/projects.component';
 import { BlogComponent } from './blog/blog.component';
 import { ContactComponent } from './contact/contact.component';
 import { AppRoutingModule } from './app-routing.module';
-import { HttpClientModule } from '@angular/common/http';
+import { AuthInterceptor } from './http-interceptors/auth.interceptor';
+import { httpInterceptorProviders } from './http-interceptors';
 
 @NgModule({
   declarations: [
@@ -29,7 +31,7 @@ import { HttpClientModule } from '@angular/common/http';
     AppRoutingModule
   ],
   schemas: [CUSTOM_ELEMENTS_SCHEMA],
-  providers: [],
+  providers: [httpInterceptorProviders],
   bootstrap: [AppComponent]
 })
 export class AppModule { }

src/app/base/base.component.ts

@@ -5,7 +5,7 @@ import { CvService } from "../services/cv.service";
 export abstract class BaseComponent<T extends object> {
     public model: T = <T>{};
     candidateId: number = 1;
-    imagesOrigin: string = environment.imagesUrl + '/images/';
+    imagesOrigin: string = environment.apiUrl + '/images/';
 
     constructor(public svc: CvService) {
     }

src/app/http-interceptors/auth.interceptor.ts

@@ -0,0 +1,18 @@
+import { HttpEvent, HttpHandler, HttpInterceptor, HttpRequest } from "@angular/common/http";
+import { Observable } from "rxjs";
+import { AuthService } from "../services/auth.service";
+import { Injectable } from "@angular/core";
+
+@Injectable()
+export class AuthInterceptor implements HttpInterceptor{
+  constructor(public authSvc: AuthService){}
+  intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
+    const apiKey = this.authSvc.getApiKey();
+
+    const authReq = req.clone({
+      headers: req.headers.set('XApiKey', apiKey)
+    });
+
+    return next.handle(authReq);
+  }
+}

src/app/http-interceptors/index.ts

@@ -0,0 +1,7 @@
+import { HTTP_INTERCEPTORS } from "@angular/common/http";
+
+import { AuthInterceptor } from "./auth.interceptor";
+
+export const httpInterceptorProviders = [
+    {provide: HTTP_INTERCEPTORS, useClass: AuthInterceptor, multi: true}
+]

src/app/services/auth.service.spec.ts

@@ -0,0 +1,16 @@
+import { TestBed } from '@angular/core/testing';
+
+import { AuthService } from './auth.service';
+
+describe('AuthService', () => {
+  let service: AuthService;
+
+  beforeEach(() => {
+    TestBed.configureTestingModule({});
+    service = TestBed.inject(AuthService);
+  });
+
+  it('should be created', () => {
+    expect(service).toBeTruthy();
+  });
+});

src/app/services/auth.service.ts

@@ -0,0 +1,12 @@
+import { Injectable } from '@angular/core';
+import { environment } from 'src/environments/environment';
+
+@Injectable({
+  providedIn: 'root'
+})
+export class AuthService {
+
+  getApiKey(): string{
+    return environment.apiKey;
+  }
+}

src/environments/environment.development.ts

@@ -1,4 +1,5 @@
 export const environment = {
-    imagesUrl: 'https://localhost:7013',
-    blogImagesUrl: 'https://bangararaju.kottedi.in/blog/assets/img/posts/'
+    apiUrl: 'https://localhost:7013',
+    blogImagesUrl: 'https://bangararaju-uat.kottedi.in/blog/assets/img/posts/',
+    apiKey: "c6eAXYcNT873TT7BfMgQyS4ii7hxa53TLEUN7pAGaaU="
 };

src/environments/environment.ts

@@ -1,4 +1,5 @@
 export const environment = {
-    imagesUrl: 'https://localhost:7013',
-    blogImagesUrl: 'https://bangararaju.kottedi.in/blog/assets/img/posts/'
+    apiUrl: 'https://localhost:7013',
+    blogImagesUrl: 'https://bangararaju-uat.kottedi.in/blog/assets/img/posts/',
+    apiKey: ""
 };