Angular HTTP integration

HTTP & Backend Integration

Keep HTTP communication in typed Angular services and interceptors with clear request lifecycles, error normalization and zero leaked server secrets.

1. Typed HttpClient services and parameters

• Encapsulate API calls in dedicated domain/data services rather than calling HttpClient directly inside components.
• Type every request and response (this.http.get<OrderSummaryDto>(...)) and map transport DTOs into domain models where the API shape differs from UI needs.
• Build query strings with HttpParams (new HttpParams({ fromObject: ... })) or the params option object rather than manual string concatenation so special characters are properly URL-encoded.
• Never embed server-side API keys or secrets in Angular environment files or client bundles.

2. Interceptors and HttpContext

• Match the project's interceptor registration (withInterceptors([fn]) in provideHttpClient vs HTTP_INTERCEPTORS class providers).
• Remember HttpRequest and HttpHeaders are immutable: always pass the result of req.clone({ setHeaders: ... }) to next(clonedReq).
• Use HttpContext and HttpContextToken<T> to pass per-request metadata (such as skipping auth headers, suppressing global error toasts, or tagging cache policy) to interceptors cleanly without polluting URLs or headers.

3. Error handling, retries and cancellation

• Normalize HttpErrorResponse (status 0 network/CORS failure, 401/403 auth, 422 validation errors, 5xx server failures) so components receive actionable error states.
• Apply retry({ count, delay }) only to idempotent reads (GET) or transient network errors, never blindly to non-idempotent POST/PATCH mutations.
• Understand that unsubscribing from HttpClient aborts the in-flight XHR/fetch request; use switchMap for reads/searches and exhaustMap or concatMap for mutations.

Before you finish

• All HttpClient calls live in typed services and use HttpParams for query parameters.
• Interceptors clone requests immutably and use HttpContextToken for per-request flags.
• HttpErrorResponse statuses (0, 401/403, 422, 5xx) and cancellation are handled predictably.