एकतरफ़ा Push के लिए Server-Sent Events
@Sse decorator और RxJS observables से clients को live updates stream कीजिए।
एकतरफ़ा Push के लिए Server-Sent Events, CoddyKit पर NestJS एंटरप्राइज़ बैकएंड API का एक निःशुल्क पाठ है। यह 4 में से 3वाँ पाठ है। आप नीचे पूरा पाठ निःशुल्क पढ़ सकते हैं—फिर अंतर्निहित कोड संपादक और 24/7 एआई ट्यूटर के साथ ब्राउज़र में इसका व्यावहारिक अभ्यास कर सकते हैं। यह NestJS एंटरप्राइज़ बैकएंड API सीखने के मार्ग का हिस्सा है और आपकी प्रगति वेब तथा CoddyKit ऐप पर सिंक होती रहती है। NestJS एंटरप्राइज़ बैकएंड API पाठ्यक्रम में कुल 4 पाठ शामिल हैं।
Server-Sent Events क्यों?
Server-Sent Events (SSE) server को एकल, लंबे समय तक खुले HTTP कनेक्शन पर क्लाइंट को लगातार अपडेट भेजने देते हैं। सूचनाओं, प्रगति पट्टियों या डैशबोर्ड मेट्रिक्स जैसे एकतरफ़ा, server से client तक पहुँचने वाले लाइव डेटा के लिए यह सबसे सरल तरीका है।
- केवल एकतरफ़ा: server बोलता है और client सुनता है। उसी कनेक्शन पर client से server तक कोई चैनल नहीं होता।
- साधारण HTTP: WebSockets की तरह किसी विशेष प्रोटोकॉल अपग्रेड की आवश्यकता नहीं होती। यह सामान्य GET अनुरोध पर चलता है।
- स्वचालित पुनःकनेक्शन: कनेक्शन टूटने पर ब्राउज़र का
EventSourceअपने-आप फिर से कनेक्ट हो जाता है।
NestJS में SSE एक मूल सुविधा है, जिसे @Sse() decorator और RxJS observables के संयोजन से उपलब्ध कराया जाता है।
SSE बनाम WebSockets
दोनों लाइव डेटा प्रवाहित करते हैं, लेकिन अलग-अलग समस्याएँ हल करते हैं। सही विकल्प चुनना एक संरचनात्मक निर्णय है।
- SSE: केवल server → client, पाठ-आधारित, HTTP/1.1 या HTTP/2 पर चलता है, और इसमें पुनःकनेक्शन तथा घटना ID पहले से मौजूद होते हैं। फ़ीड, अलर्ट और प्रगति के लिए आदर्श।
- WebSockets: पूर्ण-द्विदिश (दोनों दिशाओं में), बाइनरी या पाठ, और प्रोटोकॉल अपग्रेड आवश्यक। चैट, बहु-खिलाड़ी खेल और सहयोगी संपादन के लिए आदर्श।
यदि आपके क्लाइंट को केवल अपडेट प्राप्त करने हैं, तो SSE अधिक हल्का है, मानक HTTP अवसंरचना के पीछे स्केल करना आसान है और इसके लिए किसी अतिरिक्त क्लाइंट लाइब्रेरी की आवश्यकता नहीं होती। WebSockets का उपयोग तभी करें जब क्लाइंट को रीयल-टाइम में संदेश भेजने भी हों।
वायर प्रारूप
SSE केवल text/event-stream content type वाला स्ट्रीमिंग HTTP response है। प्रत्येक संदेश नई पंक्तियों से अलग किए गए पाठ फ़ील्ड का एक खंड होता है और हर खंड एक रिक्त पंक्ति पर समाप्त होता है।
data:payload (अक्सर JSON string)।event:नामित घटना प्रकार, जिसे क्लाइंट सुन सकता है।id:संदेश पहचानकर्ता, जिसका उपयोगLast-Event-IDके माध्यम से पुनःकनेक्शन के लिए किया जाता है।retry:मिलीसेकंड में पुनःकनेक्शन विलंब।
NestJS में आपको इसे हाथ से बहुत कम ही प्रारूपित करना पड़ता है — framework आपके लिए प्रकार-सहित object को इन फ़ील्ड में बदल देता है — लेकिन इसका ढाँचा जानने से curl के साथ समस्या की जाँच करने में सहायता मिलती है।
// Raw text/event-stream bytes the server emits
// (NestJS builds this for you from a MessageEvent)
const sample =
'id: 42\n' +
'event: heartbeat\n' +
'data: {"status":"ok","ts":1718000000}\n' +
'\n';
process.stdout.write(sample);आपका पहला @Sse endpoint
@Sse() decorator किसी controller method को SSE stream के रूप में चिह्नित करता है। साधारण मान लौटाने के बजाय, method एक RxJS Observable लौटाता है। Observable द्वारा उत्सर्जित प्रत्येक मान client को भेजा गया एक SSE संदेश बन जाता है।
NestJS अपेक्षा करता है कि उत्सर्जित प्रत्येक मान data property वाले MessageEvent-आकार के object के रूप में हो। यह अपने-आप text/event-stream headers सेट करता है और connection को खुला रखता है।
import { Controller, Sse, MessageEvent } from '@nestjs/common';
import { interval, map, Observable } from 'rxjs';
@Controller('events')
export class EventsController {
@Sse('clock')
clock(): Observable<MessageEvent> {
return interval(1000).pipe(
map((n) => ({ data: { tick: n, time: new Date().toISOString() } })),
);
}
}MessageEvent का प्रारूप
NestJS एक MessageEvent इंटरफ़ेस निर्यात करता है, जो सीधे SSE के वायर फ़ील्ड से मैप होता है। केवल data आवश्यक है; बाकी वैकल्पिक हैं।
data— स्ट्रिंग या ऑब्जेक्ट। ऑब्जेक्ट अपने-आप JSON स्ट्रिंग में बदल जाते हैं।type—event:फ़ील्ड बन जाता है (एक नामित इवेंट)।id—id:फ़ील्ड बन जाता है और पुनः कनेक्ट होने पर वहीं से जारी रखने की सुविधा देता है।retry— मिलीसेकंड मेंretry:फ़ील्ड बन जाता है।
सही प्रकार वाले ऑब्जेक्ट लौटाने से आपकी स्ट्रीम का दस्तावेज़ीकरण स्वयं स्पष्ट रहता है और क्लाइंट विशिष्ट नामित इवेंट की सदस्यता ले सकते हैं।
import { MessageEvent } from '@nestjs/common';
function buildEvent(orderId: string, n: number): MessageEvent {
return {
id: String(n),
type: 'order.updated',
retry: 5000,
data: { orderId, sequence: n },
};
}
console.log(buildEvent('ord_123', 7));Subject के साथ डोमेन इवेंट भेजना
घड़ियों के लिए एक निश्चित interval ठीक है, लेकिन वास्तविक सिस्टम कुछ होने पर डेटा भेजते हैं। इसके लिए सामान्य पैटर्न किसी सेवा में मौजूद RxJS Subject है। जब भी कोई इवेंट होता है, आपका व्यावसायिक तर्क .next() को कॉल करता है और SSE एंडपॉइंट उस Subject को ऑ्ज़र्वेबल के रूप में उपलब्ध कराता है।
इससे उत्पादक (कोई भी सेवा) और ट्रांसपोर्ट (SSE नियंत्रक) के बीच साफ़ तौर पर अलगाव बना रहता है।
import { Injectable, MessageEvent } from '@nestjs/common';
import { Subject, Observable } from 'rxjs';
@Injectable()
export class NotificationsService {
private readonly stream$ = new Subject<MessageEvent>();
emit(payload: unknown): void {
this.stream$.next({ type: 'notification', data: payload });
}
asObservable(): Observable<MessageEvent> {
return this.stream$.asObservable();
}
}सेवा को नियंत्रक से जोड़ना
नियंत्रक सेवा को इंजेक्ट करता है और किसी @Sse() मेथड से उसका ऑ्ज़र्वेबल लौटाता है। ऐप का कोई भी अन्य भाग — कतार उपभोक्ता, वेबहुक हैंडलर या क्रॉन जॉब — उसी सेवा को इंजेक्ट करके हर जुड़े हुए क्लाइंट तक प्रसारण करने के लिए emit() कॉल कर सकता है।
क्योंकि साधारण Subject मल्टीकास्ट करता है, इसलिए सभी सब्सक्राइबर को हर उत्सर्जन प्राप्त होता है। साझा सूचना फ़ीड के लिए आपको ठीक यही चाहिए।
import { Controller, Post, Body, Sse, MessageEvent } from '@nestjs/common';
import { Observable } from 'rxjs';
import { NotificationsService } from './notifications.service';
@Controller('notifications')
export class NotificationsController {
constructor(private readonly notifications: NotificationsService) {}
@Sse('stream')
stream(): Observable<MessageEvent> {
return this.notifications.asObservable();
}
@Post()
publish(@Body() body: { message: string }) {
this.notifications.emit(body);
return { accepted: true };
}
}प्रति-उपयोगकर्ता फ़िल्टर की गई स्ट्रीम
एक वैश्विक Subject सभी को प्रसारण करता है। एंटरप्राइज़ API में सामान्यतः आप चाहते हैं कि प्रत्येक क्लाइंट को केवल उसके अपने इवेंट मिलें। अनुरोध के अनुसार स्ट्रीम को ढालने के लिए filter और map जैसे RxJS ऑपरेटर का उपयोग करें; उपयोगकर्ता को रूट पैरामीटर या प्रमाणित अनुरोध से पढ़ें।
@Sse() मेथड @Param() और @Req() जैसे सामान्य रूट डेकोरेटर स्वीकार कर सकता है, इसलिए आप ऑ्ज़र्वेबल को वर्तमान उपयोगकर्ता तक सीमित कर सकते हैं।
import { Controller, Param, Sse, MessageEvent } from '@nestjs/common';
import { Observable, filter, map } from 'rxjs';
import { EventsBus } from './events.bus';
@Controller('users')
export class UserFeedController {
constructor(private readonly bus: EventsBus) {}
@Sse(':userId/feed')
feed(@Param('userId') userId: string): Observable<MessageEvent> {
return this.bus.events$.pipe(
filter((e) => e.userId === userId),
map((e) => ({ type: e.kind, data: e.payload })),
);
}
}हार्टबीट कनेक्शन को चालू रखती हैं
प्रॉक्सी, लोड बैलेंसर और ब्राउज़र निष्क्रिय कनेक्शन बंद कर सकते हैं। एक हार्टबीट — समय-समय पर भेजी गई टिप्पणी या निष्क्रिय इवेंट — कनेक्शन को सक्रिय रखती है। RxJS के साथ आप अपनी वास्तविक इवेंट स्ट्रीम को धीमे टाइमर के साथ merge करते हैं।
हार्टबीट को अलग इवेंट प्रकार के रूप में (या SSE टिप्पणी पंक्तियों के रूप में) भेजें, ताकि क्लाइंट उन्हें अनदेखा कर सकें। सामान्य अंतराल हर 15–30 सेकंड होता है, जो आम प्रॉक्सी निष्क्रियता समय-सीमा से पर्याप्त कम है।
import { merge, interval, map, Observable } from 'rxjs';
import { MessageEvent } from '@nestjs/common';
export function withHeartbeat(
source$: Observable<MessageEvent>,
): Observable<MessageEvent> {
const heartbeat$ = interval(15000).pipe(
map((): MessageEvent => ({ type: 'heartbeat', data: 'ping' })),
);
return merge(source$, heartbeat$);
}सफ़ाई, त्रुटियाँ और बैकप्रेशर
जब कोई क्लाइंट डिस्कनेक्ट होता है, NestJS आपके ऑ्ज़र्वेबल की सदस्यता समाप्त कर देता है। सुनिश्चित करें कि सदस्यता समाप्त होने पर आपकी स्ट्रीम संसाधन मुक्त करे — सफ़ाई के लिए finalize() का उपयोग करें और टाइमर या लिसनर कभी लीक न होने दें।
- स्ट्रीम को क्रैश करने के बजाय त्रुटियों को अंतिम इवेंट में बदलने के लिए
catchErrorका उपयोग करें। - क्लाइंट के जाने पर लॉग करने या कनेक्शन काउंटर घटाने के लिए
finalizeका उपयोग करें। - बैकप्रेशर से सावधान रहें: धीमे क्लाइंट वाला तेज़ उत्पादक डेटा को मेमोरी में बफ़र करता है। उच्च-आवृत्ति वाले स्रोतों को थ्रॉटल या सैंपल करें।
import { Observable, catchError, finalize, of } from 'rxjs';
import { MessageEvent } from '@nestjs/common';
export function safeStream(
source$: Observable<MessageEvent>,
onClose: () => void,
): Observable<MessageEvent> {
return source$.pipe(
catchError((err) =>
of<MessageEvent>({ type: 'error', data: { message: err.message } }),
),
finalize(onClose),
);
}क्लाइंट से स्ट्रीम का उपभोग करना
ब्राउज़र मूल EventSource API से SSE का उपभोग करते हैं। यह कनेक्ट करता है, संदेश भेजता है और अपने-आप पुनः कनेक्ट करता है। बिना नाम वाले डेटा के लिए डिफ़ॉल्ट message इवेंट सुनें, या अपने नामित इवेंट प्रकारों के लिए लिसनर जोड़ें।
ध्यान दें कि EventSource केवल GET का समर्थन करता है और कस्टम हेडर सेट नहीं कर सकता, इसलिए प्रमाणीकरण सामान्यतः कुकी या क्वेरी स्ट्रिंग में दिए गए टोकन से किया जाता है। टर्मिनल से तुरंत डीबग करने के लिए curl -N जैसे टूल बहुत उपयोगी हैं।
// Browser-side consumer
const es = new EventSource('/notifications/stream');
es.addEventListener('notification', (e) => {
const payload = JSON.parse(e.data);
console.log('new notification', payload);
});
es.addEventListener('heartbeat', () => {
// keep-alive, ignore
});
es.onerror = () => console.warn('reconnecting...');त्वरित जाँच
NestJS में SSE का उपयोग कब और कैसे करना है, इसकी अपनी समझ जाँचें।
पुनरावलोकन
आपने सीखा कि NestJS से Server-Sent Events का उपयोग करके एकतरफ़ा लाइव अपडेट कैसे स्ट्रीम किए जाते हैं:
- SSE साधारण HTTP पर केवल सर्वर से क्लाइंट तक काम करता है और इसमें ब्राउज़र का स्वतः पुनः कनेक्ट होना शामिल है — जब क्लाइंट को केवल डेटा प्राप्त करना हो, तब WebSockets के बजाय इसे चुनें।
@Sse()डेकोरेटर किसी नियंत्रक मेथड को ऐसी स्ट्रीम में बदल देता है जोObservable<MessageEvent>लौटाती है; प्रत्येक उत्सर्जन एक संदेश बन जाता है।MessageEventवायर फ़ील्डdata,type,idऔरretryसे मैप होता है; ऑब्जेक्ट आपके लिए JSON में क्रमबद्ध कर दिए जाते हैं।- सेवा में साझा
Subjectके साथ वास्तविक डोमेन इवेंट भेजें औरfilterतथाmapसे प्रति-उपयोगकर्ता स्ट्रीम सीमित करें। mergeके माध्यम से हार्टबीट भेजकर कनेक्शन स्वस्थ रखें औरcatchErrorतथाfinalizeसे सुरक्षित रूप से सफ़ाई करें।- क्लाइंट पर मूल
EventSourceAPI से इनका उपभोग करें।
एआई शिक्षक के साथ TypeScript सीखें — निःशुल्क
अपने ब्राउज़र में वास्तविक कोड लिखें और चलाएँ, चौबीसों घंटे एआई शिक्षक से तुरंत सहायता पाएँ, और वेब या ऐप पर वहीं से शुरू करें जहाँ आपने छोड़ा था।
- पाठ्यक्रम
- 20
- पाठ
- 76
अक्सर पूछे जाने वाले प्रश्न
क्या “एकतरफ़ा Push के लिए Server-Sent Events” पाठ निःशुल्क है?
हाँ—“एकतरफ़ा Push के लिए Server-Sent Events” का पूरा पाठ यहाँ वेब पर निःशुल्क पढ़ा जा सकता है। इंटरैक्टिव अभ्यास (अंतर्निहित कोड संपादक और 24/7 एआई ट्यूटर) करने और NestJS एंटरप्राइज़ बैकएंड API पाठ्यक्रम का बाकी हिस्सा अनलॉक करने के लिए CoddyKit PRO लें। NestJS एंटरप्राइज़ बैकएंड API पाठ्यक्रम में कुल 4 पाठ शामिल हैं।
“एकतरफ़ा Push के लिए Server-Sent Events” में मैं क्या सीखूँगा?
@Sse decorator और RxJS observables से clients को live updates stream कीजिए। आप ब्राउज़र में सीधे चलाए जाने वाले व्यावहारिक कोड के साथ NestJS एंटरप्राइज़ बैकएंड API का अभ्यास करते हैं, और पाठ पूरा करते समय 24/7 एआई ट्यूटर आपके प्रश्नों के उत्तर देता है।
क्या NestJS एंटरप्राइज़ बैकएंड API शुरू करने के लिए मुझे किसी अनुभव की आवश्यकता है?
पहले के अनुभव की आवश्यकता नहीं है। CoddyKit पर NestJS एंटरप्राइज़ बैकएंड API शुरुआती से लेकर उन्नत शिक्षार्थियों तक सभी के लिए व्यवस्थित किया गया है, इसलिए आप यहीं से या शुरुआत से सीखना शुरू कर सकते हैं और अपनी गति से आगे बढ़ सकते हैं। यह 4 में से 3वाँ पाठ है।
“एकतरफ़ा Push के लिए Server-Sent Events” पाठ पूरा करने में कितना समय लगता है?
CoddyKit का अधिकांश पाठ लगभग 5–10 मिनट में पूरा हो जाता है। हर पाठ छोटा और संवादात्मक है, इसलिए आप लगातार प्रगति करते हैं और वेब या ऐप पर वहीं से सीखना जारी रख सकते हैं जहाँ आपने छोड़ा था।
क्या मैं इस NestJS एंटरप्राइज़ बैकएंड API पाठ में कोड लिख और चला सकता हूँ?
हाँ। हर NestJS एंटरप्राइज़ बैकएंड API पाठ में एक अंतर्निर्मित कोड संपादक शामिल है, जिससे आप सीधे अपने ब्राउज़र में वास्तविक कोड लिख और चला सकते हैं और तुरंत एआई प्रतिक्रिया पा सकते हैं—स्थानीय सेटअप की आवश्यकता नहीं है।
इस पाठ्यक्रम के सभी पाठ
- Socket.IO Adapter के साथ WebSocket Gateways
- Socket Connections का प्रमाणीकरण और सुरक्षा
- एकतरफ़ा Push के लिए Server-Sent Events
- Redis Pub/Sub Adapter से Realtime Scaling