HttpClient ఎలా పని చేస్తుంది?

Question

Accepted Answer

**`HttpClient`** HTTP అభ్యర్థనలు చేయడానికి Angular యొక్క నిర్మిత సేవ. ఇది **Observables** (Promises కాదు) తిరిగి ఇస్తుంది, RxJS ఆపరేటర్‌లతో సమన్వయ చేస్తుంది మరియు టైప్ చేసిన ప్రతిస్పందనలు, ఇంటర్‌సెప్టర్‌లు మరియు లోపం నిర్వహణను సపోర్ట్ చేస్తుంది. ## ప్రాథమిక ఉపయోగం ```ts import { HttpClient } from "@angular/common/http"; import { Injectable } from "@angular/core"; @Injectable({ providedIn: "root" }) export class UserService { constructor(private http: HttpClient) {} getUsers() { return this.http.get("/api/users"); // typed: Observable } createUser(user: User) { return this.http.post("/api/users", user); // body as 2nd arg } deleteUser(id: number) { return this.http.delete(`/api/users/${id}`); } } ``` జెనెరిక్ (``) ప్రతిస్పందనను టైప్ చేస్తుంది. అభ్యర్థనలు **సోమరి** — అవి సబ్‌స్క్రిప్ట్ చేసినప్పుడు మాత్రమే చేరుకుంటాయి. ## ఒక భాగంలో వినియోగం ```ts ngOnInit() { this.userService.getUsers().subscribe(users => this.users = users); } // or with the async pipe (no manual subscribe/unsubscribe): users$ = this.userService.getUsers(); // template:

``` ## అభ్యర్థన ఎంపికలు: పారామితులు, హెడర్‌లు ```ts import { HttpParams, HttpHeaders } from "@angular/common/http"; this.http.get("/api/users", { params: new HttpParams().set("page", "1").set("limit", "10"), // ?page=1&limit=10 headers: new HttpHeaders({ Authorization: `Bearer ${token}` }), }); ``` ## RxJS తో లోపం నిర్వహణ ```ts import { catchError, retry } from "rxjs/operators"; import { of } from "rxjs"; this.http.get("/api/users").pipe( retry(2), // retry failed requests twice catchError(err => { console.error(err); return of([]); // fallback value, keep the stream alive }) ).subscribe(users => this.users = users); ``` ఇది Observable-ఆధారితమైనందున, మీరు పున: ప్రయత్నాలను, ఫాల్‌బ్యాక్‌లను, టైమ్‌అవుట్‌లను మరియు రూపాంతరాలను ఆపరేటర్‌లతో కూర్చుకోండి. ## ఇంటర్‌సెప్టర్‌లు క్రాస్-కటింగ్ సమస్యలను నిర్వహిస్తాయి ```text HTTP interceptors automatically attach auth tokens, log requests, handle errors globally, or show loading spinners — for ALL requests. ``` ## ఇది ఎందుకు ముఖ్యమైనది `HttpClient` Angular యాప్‌లు బ్యాకెండ్‌ల వలె మాట్లాడే విధానం — టైప్ చేయబడిన, Observable-ఆధారితమైన మరియు పున: ప్రయత్నాలు/ఫాల్‌బ్యాక్‌లు/పరివర్తనాల కోసం RxJS తో కూర్చుకోయగలిగినది. ఇది Observable స్వభావం (fetch Promises కు విరుద్ధంగా) Angular యొక్క మిగిలిన భాగంతో సమన్వయ చేస్తుంది (async pipe, ఆపరేటర్‌లు, ఇంటర్‌సెప్టర్‌లు). టైప్ చేసిన అభ్యర్థనలు, ఎంపికలు, లోపం నిర్వహణ మరియు `async` పైపతో జత చేయడం గురించిన జ్ఞానం Angular లో డేటా-ఫెచింగ్ అవసరాలను ఆచరణాత్మకంగా కవర్ చేస్తుంది.