Updated proxy to redirect api-calls to localhost:3000

Author: PI-Mathis

package.json

@@ -3,12 +3,12 @@
   "version": "0.0.0",
   "scripts": {
     "ng": "ng",
-    "start": "ng serve --proxy-config proxy.conf.js",
+    "json:server": "json-server --watch mocks/data.json",
+    "start": "ng serve --proxy-config proxy.conf.json",
     "build": "ng build --prod",
     "test": "ng test",
     "lint": "ng lint",
-    "e2e": "ng e2e",
-    "json:server": "json-server --watch mocks/data.json"
+    "e2e": "ng e2e"
   },
   "private": true,
   "dependencies": {

proxy.conf.js

@@ -0,0 +1,10 @@
+{
+  "/api/*": {
+    "target": "http://localhost:3000",
+    "secure": false,
+    "logLevel": "debug",
+    "pathRewrite": {
+      "^/api": ""
+    }
+  }
+}

proxy.conf.json

@@ -0,0 +1,12 @@
+import { TestBed } from '@angular/core/testing';
+
+import { ApiService } from './api.service';
+
+describe('ApiService', () => {
+  beforeEach(() => TestBed.configureTestingModule({}));
+
+  it('should be created', () => {
+    const service: ApiService = TestBed.get(ApiService);
+    expect(service).toBeTruthy();
+  });
+});

src/app/core/services/api.service.spec.ts

@@ -0,0 +1,40 @@
+import { HttpClient, HttpHeaders, HttpParams } from '@angular/common/http';
+import { Injectable } from '@angular/core';
+import { environment as env } from '@env/environment';
+import { Observable, throwError } from 'rxjs';
+import { catchError } from 'rxjs/operators';
+
+const BASE_URL = env.serverUrl;
+
+@Injectable({
+  providedIn: 'root'
+})
+export class ApiService {
+  private options = { headers: new HttpHeaders().set('Content-Type', 'application/json') };
+
+  constructor(private httpClient: HttpClient) {}
+
+  public get(path: string, params: HttpParams = new HttpParams()): Observable<any> {
+    return this.httpClient.get(BASE_URL + path, { params }).pipe(catchError(this.formatErrors));
+  }
+
+  public put(path: string, body: object = {}): Observable<any> {
+    return this.httpClient
+      .put(BASE_URL + path, JSON.stringify(body), this.options)
+      .pipe(catchError(this.formatErrors));
+  }
+
+  public post(path: string, body: object = {}): Observable<any> {
+    return this.httpClient
+      .post(BASE_URL + path, JSON.stringify(body), this.options)
+      .pipe(catchError(this.formatErrors));
+  }
+
+  public delete(path: string): Observable<any> {
+    return this.httpClient.delete(BASE_URL + path).pipe(catchError(this.formatErrors));
+  }
+
+  public formatErrors(error: any): Observable<any> {
+    return throwError(error.error);
+  }
+}

src/app/core/services/api.service.ts

@@ -1,3 +1,4 @@
 export * from './auth.service';
 export * from './json-api.service';
 export * from './project.service';
+export * from './api.service';

src/app/core/services/index.ts

@@ -4,21 +4,23 @@ import { JsonApiService } from './json-api.service';
 import { Observable } from 'rxjs';
 
 import { Project } from '../models/project.model';
+import { ApiService } from './api.service';
 
 const routes = {
-    projects: '/projects.json'
+    projects: '/projects'
 };
 
 @Injectable({
   providedIn: 'root'
 })
 export class ProjectService {
 
-    constructor(private jsonApiService: JsonApiService) {}
+    constructor(
+      private jsonApiService: JsonApiService,
+      private apiService: ApiService) {}
 
     getAll(): Observable<Project[]> {
-        return this.jsonApiService
-            .fetch(routes.projects);
+        return this.apiService.get(routes.projects);
     }
 
 }