From 3f605cf5d3c8eea57ceff0662217af7c8d9b7650 Mon Sep 17 00:00:00 2001 From: Anand raja Date: Sat, 28 Sep 2024 19:37:41 +0000 Subject: [PATCH 1/2] deployable --- .../available-places/available-places.component.ts | 6 ++++-- src/app/places/places.component.ts | 2 +- src/app/services/places.service.ts | 13 +++++++------ src/environments/environment.development.ts | 4 +++- src/environments/environment.ts | 3 ++- 5 files changed, 17 insertions(+), 11 deletions(-) diff --git a/src/app/places/available-places/available-places.component.ts b/src/app/places/available-places/available-places.component.ts index 1c02e9c..b64e866 100644 --- a/src/app/places/available-places/available-places.component.ts +++ b/src/app/places/available-places/available-places.component.ts @@ -25,8 +25,10 @@ export class AvailablePlacesComponent implements OnInit { const availablePlaceSub = this.placeServ.loadAvailablePlaces().subscribe({ next: resp => { - this.places.set(resp?.places); - this.errorMsg.set(''); + if (resp) { + this.places.set(resp); + this.errorMsg.set(''); + } }, complete: () => { this.isFetching.set(false); diff --git a/src/app/places/places.component.ts b/src/app/places/places.component.ts index 1ff8f45..a926b36 100644 --- a/src/app/places/places.component.ts +++ b/src/app/places/places.component.ts @@ -14,7 +14,7 @@ export class PlacesComponent { places = input.required(); selectPlace = output(); - protected url = env.backendUrl; + protected url = env.backendImgUrl; onSelectPlace(place: Place) { this.selectPlace.emit(place); diff --git a/src/app/services/places.service.ts b/src/app/services/places.service.ts index bf43772..1f08d76 100644 --- a/src/app/services/places.service.ts +++ b/src/app/services/places.service.ts @@ -7,6 +7,7 @@ import { throwError } from 'rxjs'; import { Place } from '../models/place.model'; import { ErrorService } from './error.service'; +import { environment as env } from '../../environments/environment.development'; @Injectable({ providedIn: 'root', @@ -19,15 +20,15 @@ export class PlacesService { private errorServ = inject(ErrorService); loadAvailablePlaces() { - return this.fetchPlaces('/api/v2/places', 'Error loading available places!'); + return this.fetchPlaces(env.backendUrl + 'places.json', 'Error loading available places!'); } loadUserPlaces() { - return this.fetchPlaces('/api/v2/user-places', 'Error loading user places!').pipe( + return this.fetchPlaces(env.backendUrl + 'user-places.json', 'Error loading user places!').pipe( tap({ next: resp => { if (resp) { - this.userPlaces.set(resp.places); + this.userPlaces.set(resp); } }, }), @@ -43,7 +44,7 @@ export class PlacesService { } return this.http - .put('/api/v2/user-places', { + .put(env.backendUrl + 'user-places', { placeId: place.id, }) .pipe( @@ -63,7 +64,7 @@ export class PlacesService { this.userPlaces.set(prevPlaces.filter(pl => pl.id !== place.id)); } - return this.http.delete('/api/v2/user-places/' + place.id).pipe( + return this.http.delete(env.backendUrl + 'user-places/' + place.id).pipe( catchError(err => { this.userPlaces.set(prevPlaces); this.errorServ.showError('Unable to remove the selected place!'); @@ -74,7 +75,7 @@ export class PlacesService { private fetchPlaces(url: string, errMsg: string) { return this.http - .get<{ places: Place[] }>(url, { + .get(url, { observe: 'response', // it'll give full response including status code }) .pipe( diff --git a/src/environments/environment.development.ts b/src/environments/environment.development.ts index ef430c8..5c430ca 100644 --- a/src/environments/environment.development.ts +++ b/src/environments/environment.development.ts @@ -1,4 +1,6 @@ export const environment = { - backendUrl: 'https://3000-actionanand-angularhttp-six5y8k89a8.ws-us116.gitpod.io/', + // backendUrl: 'https://3000-actionanand-angularhttp-six5y8k89a8.ws-us116.gitpod.io/', // backendUrl: 'http://localhost:3000/', + backendUrl: 'https://raw.githubusercontent.com/actionanand/angular-http-project/master/backend/data/', + backendImgUrl: 'https://raw.githubusercontent.com/actionanand/angular-http-project/refs/heads/master/backend/images/', }; diff --git a/src/environments/environment.ts b/src/environments/environment.ts index 281c828..2c28f2a 100644 --- a/src/environments/environment.ts +++ b/src/environments/environment.ts @@ -1,3 +1,4 @@ export const environment = { - backendUrl: 'http://localhost:3000/', + backendUrl: 'https://raw.githubusercontent.com/actionanand/angular-http-project/master/backend/data/', + backendImgUrl: 'https://raw.githubusercontent.com/actionanand/angular-http-project/refs/heads/master/backend/images/', }; From ffb03bfabc28f331312dd9e8ad791e9ef9c0195b Mon Sep 17 00:00:00 2001 From: Anand Raja Date: Tue, 8 Oct 2024 03:26:21 +0530 Subject: [PATCH 2/2] retry interceptor added --- src/app/services/retry.interceptor.ts | 26 ++++++++++++++++++++++++++ src/main.ts | 9 ++------- 2 files changed, 28 insertions(+), 7 deletions(-) create mode 100644 src/app/services/retry.interceptor.ts diff --git a/src/app/services/retry.interceptor.ts b/src/app/services/retry.interceptor.ts new file mode 100644 index 0000000..a8b2b02 --- /dev/null +++ b/src/app/services/retry.interceptor.ts @@ -0,0 +1,26 @@ +import { HttpErrorResponse, HttpHandlerFn, HttpInterceptorFn, HttpRequest } from '@angular/common/http'; +import { retry, timer } from 'rxjs'; + +const maxRetries = 3; +const delayMs = 2000; + +export const RetryInterceptor: HttpInterceptorFn = (req: HttpRequest, next: HttpHandlerFn) => { + return next(req).pipe( + retry({ + count: maxRetries, + delay: (error: HttpErrorResponse, retryCount) => { + if (error.status == 401) { + console.log(req.url, ' : 401 retrying...', retryCount); + return timer(delayMs); + } else if (error.status >= 500) { + console.log(req.url, ' : 500 retrying...', retryCount); + return timer(delayMs); + } else { + console.log(`${req.url} : ${error.status} retrying... ${retryCount}`); + return timer(delayMs); + } + throw error; + }, + }), + ); +}; diff --git a/src/main.ts b/src/main.ts index 2294c19..9806fc0 100644 --- a/src/main.ts +++ b/src/main.ts @@ -2,18 +2,13 @@ import { bootstrapApplication } from '@angular/platform-browser'; import { HttpHandlerFn, HttpRequest, provideHttpClient, withInterceptors } from '@angular/common/http'; import { AppComponent } from './app/app.component'; +import { RetryInterceptor } from './app/services/retry.interceptor'; function loggingInterceptor(req: HttpRequest, next: HttpHandlerFn) { - /* - const newReq = req.clone({ - headers: req.headers.set('new-Header', 'headerValue') - }); - */ - console.log('Interceptor: ', req); return next(req); } bootstrapApplication(AppComponent, { - providers: [provideHttpClient(withInterceptors([loggingInterceptor]))], + providers: [provideHttpClient(withInterceptors([loggingInterceptor, RetryInterceptor]))], }).catch(err => console.error(err));