Moeiteloze meldingen in NestJS met behulp van gebeurtenissen aan de serverzijde voor bulkbewerkingen

Gestroomlijnde levering van meldingen voor bulkinvoegbewerkingen

Stel je voor dat je een systeem beheert waarin honderden medewerkers vouchers krijgen toegewezen op basis van verschillende criteria, zoals afdeling, rang of ervaring. Het is een enorme opgave om elke medewerker efficiënt op de hoogte te stellen zonder knelpunten in het systeem te veroorzaken. 🔔 Deze uitdaging wordt nog lastiger als je de complexiteit van sockets of polling-mechanismen wilt vermijden.

In dergelijke scenario's komen Server-Side Events (SSE) naar voren als een krachtige maar eenvoudige oplossing. Door gebruik te maken van SSE in uw NestJS-applicatie kunt u een realtime communicatiekanaal opzetten om specifieke groepen werknemers op de hoogte te stellen op basis van dynamische criteria. Wanneer bijvoorbeeld vouchers worden toegewezen aan de verkoopafdeling, mogen alleen die medewerkers meldingen ontvangen, waardoor nauwkeurige en betekenisvolle updates worden gegarandeerd.

In dit artikel duiken we in een praktisch voorbeeld dat laat zien hoe je SSE kunt integreren in een bulkinvoegingsproces met behulp van NestJS. We doorlopen de levenscyclus, van het activeren van gebeurtenissen in de backend tot het luisteren naar updates aan de frontend, en dit alles met behoud van naadloze prestaties. 💼

Of u nu een HR-tool of een financiële app ontwikkelt, als u deze workflow begrijpt, kunt u in realtime gepersonaliseerde meldingen leveren. Laten we de eenvoud van SSE ontrafelen en hoe het de gebruikerservaring van uw applicatie kan verbeteren.

Efficiënte meldingen met gebeurtenissen en wachtrijen aan de serverzijde

De meegeleverde scripts illustreren een systeem waarbij realtime meldingen naar werknemers worden verzonden nadat voucherrecords in bulk in de database zijn ingevoegd. Het proces begint in de WijsVoucherController toe, dat een eindpunt blootlegt voor het maken van vouchertoewijzingstaken. Wanneer een taak wordt gemaakt, verzendt deze een gebeurtenis met de naam na-toewijzing-voucher. Deze gebeurtenis is essentieel voor het activeren van de volgende stappen en zorgt ervoor dat het systeem gebeurtenisgestuurd en modulair is. Dit ontwerp maakt een duidelijke scheiding van de zorgen mogelijk, waardoor het systeem beter onderhoudbaar en schaalbaarder wordt. 🎯

In de servicelaag wordt de Wijs VoucherService toe verzorgt de logica voor het in de wachtrij plaatsen van taken met behulp van BullMQ. Na ontvangst van de na-toewijzing-voucher gebeurtenis, wordt er een taak toegevoegd aan de wachtrij met de naam toewijzingsbon. Deze wachtrij maakt asynchrone verwerking mogelijk, waardoor het systeem responsief blijft, zelfs bij het verwerken van grote datasets. Als u bijvoorbeeld vouchers toewijst aan 200 medewerkers op de afdeling Verkoop, zorgt de wachtrij ervoor dat de bewerking geen andere aanvragen blokkeert. De configuratie van de wachtrij omvat opties zoals verwijderOnComplete om Redis schoon te houden na voltooiing van de taak.

De wachtrijtaken worden verwerkt door de AllotVoucherConsument klas. Hier wordt de logica geïmplementeerd voor het identificeren van de relevante werknemers en het invoegen van voucherrecords in de database. Het Prisma-commando maakVeel wordt gebruikt om records batchgewijs in te voegen in de medewerker voucher tabel, die is geoptimaliseerd voor prestaties. Nadat de databasebewerking is voltooid, wordt een nieuwe gebeurtenis uitgezonden om de abonnees op de hoogte te stellen. Deze gebeurtenis zorgt ervoor dat werknemers pas op de hoogte worden gesteld nadat de bulkinvoeging met succes is verwerkt, wat de betrouwbaarheid van het meldingssysteem vergroot. 🌟

Aan de frontend luistert de React-component naar de door de server verzonden gebeurtenissen via een Gebeurtenisbron. Wanneer werknemers op de hoogte worden gesteld, worden hun gegevens dynamisch bijgewerkt in de gebruikersinterface zonder dat de pagina hoeft te worden vernieuwd. Deze aanpak biedt een naadloze gebruikerservaring, vergelijkbaar met realtime updates die te zien zijn in moderne webapplicaties zoals live sportuitslagen of meldingen op sociale media. Medewerkers op de HR-afdeling zien bijvoorbeeld geen updates die bedoeld zijn voor Sales, omdat de backend gebeurtenissen nauwkeurig filtert op basis van toewijzingscriteria. Deze specificiteit verbetert zowel de prestaties als de relevantie, waardoor een gebruikersgericht systeem ontstaat. 🖥️

// Backend: AllocateVoucherController
import { Controller, Post, Body, Sse, OnEvent } from '@nestjs/common';
import { AllocateVoucherService } from './allocate-voucher.service';
import { EventEmitter2 } from '@nestjs/event-emitter';
import { Observable } from 'rxjs';
import { map, fromEvent } from 'rxjs';
@Controller('allocate-voucher')
export class AllocateVoucherController {
  constructor(
    private readonly allocateVoucherService: AllocateVoucherService,
    private readonly eventEmitter: EventEmitter2
  ) {}
  @Post()
  async create(@Body() createDto: any) {
    const result = await this.allocateVoucherService.create(createDto);
    return result;
  }
  @Sse('vouchered-employee')
  updatedEmployeeEvent(): Observable<MessageEvent> {
    return fromEvent(this.eventEmitter, 'after-added-voucher').pipe(
      map((data) => new MessageEvent('after-added-voucher', { data })),
    );
  }
}

// Frontend: React Component for SSE
import React, { useEffect, useState } from 'react';
const EmployeeUpdates = () => {
  const [employees, setEmployees] = useState([]);
  useEffect(() => {
    const eventSource = new EventSource('http://localhost:3000/allocate-voucher/vouchered-employee');
    eventSource.onmessage = (event) => {
      const newEmployee = JSON.parse(event.data);
      setEmployees((prev) => [...prev, newEmployee]);
    };
    return () => eventSource.close();
  }, []);
  return (
    <table>
      <thead>
        <tr><th>Name</th><th>Voucher</th></tr>
      </thead>
      <tbody>
        {employees.map((emp) => (
          <tr key={emp.id}><td>{emp.name}</td><td>{emp.voucher}</td></tr>
        ))}
      </tbody>
    </table>
  );
};
export default EmployeeUpdates;

// Jest Test: AllocateVoucherService
import { Test, TestingModule } from '@nestjs/testing';
import { AllocateVoucherService } from './allocate-voucher.service';
import { EventEmitter2 } from '@nestjs/event-emitter';
describe('AllocateVoucherService', () => {
  let service: AllocateVoucherService;
  let eventEmitter: EventEmitter2;
  beforeEach(async () => {
    const module: TestingModule = await Test.createTestingModule({
      providers: [AllocateVoucherService, EventEmitter2],
    }).compile();
    service = module.get(AllocateVoucherService);
    eventEmitter = module.get(EventEmitter2);
  });
  it('should emit after-allocate-voucher event', async () => {
    jest.spyOn(eventEmitter, 'emit');
    const result = await service.create({ someData: 'test' });
    expect(eventEmitter.emit).toHaveBeenCalledWith('after-allocate-voucher', result);
  });
});

Realtime systemen verbeteren met SSE in NestJS

Hoewel we de implementatie van Server-Side Events (SSE) hebben onderzocht om werknemers op de hoogte te stellen van vouchertoewijzingen, is er een breder gebruiksscenario voor SSE in realtime systemen. SSE schittert in scenario's waarin clients op de hoogte moeten blijven van servergegevens zonder voortdurend te moeten pollen. Denk bijvoorbeeld aan een online retailplatform dat live voorraadupdates bijhoudt tijdens een flash-uitverkoop. Met behulp van SSE kunt u op efficiënte wijze updates naar alle aangesloten clients pushen, zodat zij de nieuwste voorraadniveaus kunnen zien zonder onnodige serverbelasting. Deze aanpak zorgt voor schaalbaarheid terwijl de gebruikerservaring naadloos blijft. 🛒

Het integreren van geavanceerde wachtrijsystemen zoals BullMQ, zoals we deden met de toewijzingsbon wachtrij, voegt robuustheid toe aan bulkgegevensverwerkingstaken. De wachtrij zorgt ervoor dat, zelfs als de server opnieuw wordt opgestart, lopende taken intact blijven en de verwerking wordt hervat. Bovendien kunnen mechanismen voor opnieuw proberen worden geconfigureerd, zodat mislukte taken (bijvoorbeeld als gevolg van tijdelijke downtime van de database) automatisch opnieuw worden geprobeerd. Als er bijvoorbeeld bij een toewijzing aan 300 medewerkers op verschillende afdelingen een tijdelijke fout optreedt, zorgt de veerkracht van de wachtrij ervoor dat er geen gegevens onverwerkt blijven, wat de betrouwbaarheid van uw systeem vergroot.

Naast realtime meldingen kan SSE ook e-mailservices aanvullen voor taken waarvoor gedetailleerde samenvattingen nodig zijn. Nadat alle vouchermeldingen via SSE zijn verzonden, kan de backend asynchroon een rapport genereren en een geconsolideerde e-mail naar managers sturen. Deze communicatie via meerdere kanalen zorgt voor zowel onmiddellijke meldingen als uitgebreide follow-ups, waarbij tegemoet wordt gekomen aan een breed scala aan gebruikersvoorkeuren. Een dergelijke integratie vergroot de flexibiliteit van uw systeem, waardoor een goed afgeronde gebruikerservaring ontstaat. 📧