TypeScript के लिए HTTP-क्लाइंट: आधुनिक वेब एप्लिकेशन के लिए शीर्ष लाइब्रेरी

TypeScript के लिए HTTP-क्लाइंट: आधुनिक वेब एप्लिकेशन के लिए शीर्ष लाइब्रेरी

TypeScript ने फ्रंटएंड और Node.js पर सर्वर एप्लिकेशन के विकास के लिए मुख्य भाषा के रूप में अपनी जगह मजबूती से बना ली है। हर डेवलपर के सामने आने वाले प्रमुख कार्यों में से एक API को HTTP अनुरोध भेजना है। सही HTTP-क्लाइंट का चुनाव प्रदर्शन, कोड की पठनीयता और डिबगिंग की सुविधा को प्रभावित करता है। इस लेख में, हम TypeScript में HTTP के साथ काम करने के लिए शीर्ष लाइब्रेरी, उनकी विशेषताओं, मजबूत पक्षों का विश्लेषण करेंगे और व्यावहारिक कोड उदाहरण प्रस्तुत करेंगे।

1. Axios — सार्वभौमिक मानक

Axios ब्राउज़र और Node.js दोनों के लिए सबसे लोकप्रिय HTTP-क्लाइंट बना हुआ है। इसका मुख्य लाभ "बॉक्स से बाहर" समृद्ध कार्यक्षमता है: इंटरसेप्टर के लिए समर्थन, स्वचालित JSON रूपांतरण, अनुरोध रद्द करना और XSRF से सुरक्षा।

TypeScript में, Axios लगभग पूरी तरह से एकीकृत होता है। आप जेनेरिक का उपयोग करके प्रतिक्रियाओं को टाइप कर सकते हैं, जो कोड को सुरक्षित और पूर्वानुमानित बनाता है।

import axios, { AxiosResponse } from 'axios';

interface User {  id: number;  name: string;  email: string;}

async function fetchUser(id: number): Promise<User> {  const response: AxiosResponse<User> = await axios.get<User>(`/api/users/${id}`);  return response.data;}

// उपयोगfetchUser(1).then(user => console.log(user.name));

लाभ: विशाल समुदाय, अनेक उदाहरण, अपलोड प्रगति के लिए समर्थन, अंतर्निहित त्रुटि प्रबंधन।

नुकसान: बंडल का आकार (~14 KB gzipped) सरल प्रोजेक्ट के लिए अत्यधिक हो सकता है।

2. Fetch API — देशी विकल्प

ब्राउज़रों में निर्मित Fetch API ने हाल के वर्षों में XMLHttpRequest का पूर्ण प्रतिस्थापन बन गया है। TypeScript डेवलपर्स के लिए, इसका मतलब है अतिरिक्त निर्भरताओं का अभाव। हालांकि, देशी Fetch को अधिक मैन्युअल काम की आवश्यकता होती है: 4xx/5xx स्थितियों पर स्वचालित त्रुटि उत्पन्न नहीं होती, और Node.js के लिए पॉलीफिल की आवश्यकता होती है।

interface Post {  userId: number;  id: number;  title: string;  body: string;}

async function getPosts(): Promise<Post[]> {  const response = await fetch('https://jsonplaceholder.typicode.com/posts');  if (!response.ok) {    throw new Error(`HTTP error! status: ${response.status}`);  }  return response.json() as Promise<Post[]>;}

getPosts().then(posts => console.log(posts[0].title));

लाभ: शून्य बंडल आकार, Streams API का पूर्ण समर्थन, Promise-आधारित आर्किटेक्चर।

नुकसान: प्रतिक्रिया स्थितियों की मैन्युअल जाँच की आवश्यकता, डिफ़ॉल्ट रूप से टाइमआउट का अभाव, अनुरोध रद्द करने में कठिनाई (AbortController)।

3. Got — Node.js के लिए शक्तिशाली उपकरण

Got लाइब्रेरी विशेष रूप से सर्वर-साइड Node.js वातावरण के लिए बनाई गई है। यह उन्नत क्षमताएँ प्रदान करती है: HTTP/2 के लिए समर्थन, retry तंत्र, कैशिंग, कुकी और प्रॉक्सी के साथ काम करना। TypeScript के लिए, Got उत्कृष्ट टाइपिंग प्रदान करता है।

import got from 'got';

interface ApiResponse {  status: string;  data: {    id: number;    value: string;  };}

async function fetchData(): Promise<ApiResponse> {  const response = await got.get('https://api.example.com/data', {    responseType: 'json',    retry: { limit: 3 },    timeout: { request: 5000 }  }).json<ApiResponse>();  return response;}

fetchData().then(result => console.log(result.data.value));

लाभ: जटिल परिदृश्यों के लिए समृद्ध API, अंतर्निहित त्रुटि प्रबंधन, स्ट्रीम के लिए समर्थन, उत्कृष्ट दस्तावेज़ीकरण।

नुकसान: ब्राउज़र में काम नहीं करता, अपेक्षाकृत बड़ा आकार (~10 KB gzipped), सरल GET अनुरोधों के लिए अत्यधिक।

4. Ky — हल्का और आधुनिक

Ky एक न्यूनतम HTTP-क्लाइंट है, जो Fetch API के ऊपर बनाया गया है। यह देशी Fetch की मुख्य समस्याओं को हल करता है: टाइमआउट जोड़ता है, त्रुटियों को स्वचालित रूप से संभालता है, और एक सरल इंटरफ़ेस प्रदान करता है।