Implementering av publish/subscribe-meldinger
Utform og bygg et pub/sub-system over WebSockets for emnebasert meldingsdistribusjon.
Implementering av publish/subscribe-meldinger er en gratis leksjon i Programmering av WebSockets og sanntidssystemer på CoddyKit. Dette er leksjon 1 av 4. Du kan lese hele leksjonen gratis nedenfor – og deretter øve praktisk i nettleseren med en innebygd kodeeditor og en AI-veileder som er tilgjengelig døgnet rundt. Den er en del av læringsløpet i Programmering av WebSockets og sanntidssystemer, og fremdriften din synkroniseres mellom nettet og CoddyKit-appen. Kurset i Programmering av WebSockets og sanntidssystemer inneholder totalt 4 leksjoner.
Introduksjon til Pub/Sub-meldinger
Velkommen til avanserte WebSocket-mønstre! I dag skal vi utforske Publish/Subscribe (Pub/Sub)-meldinger, en effektiv måte å distribuere sanntidsdata på.
Se for Dem en digital avis der De bare får artikler om temaer De er interessert i. Det er Pub/Sub i praksis!
Dette passer godt til funksjoner som live-chatrom, strømmer i sosiale medier, aksjekurser eller andre applikasjoner som trenger dynamiske, emnebaserte oppdateringer.
De viktigste aktørene i Pub/Sub
Et Pub/Sub-system består av noen få kjernekomponenter:
- Publishers: Dette er enheter som sender meldinger. De vet ikke hvem som mottar meldingene.
- Subscribers: Dette er enheter som mottar meldinger. De uttrykker interesse for bestemte emner.
- Topics: Dette er kategorier eller kanaler for meldinger. Abonnenter «stiller inn» på emner de ønsker å følge.
- Broker: Dette er den sentrale komponenten (WebSocket-serveren vår) som mottar meldinger fra utgivere og videresender dem til relevante abonnenter.
WebSocket-serveren som broker
I WebSocket Pub/Sub-systemet vårt fungerer WebSocket-serveren som broker.
Den har ansvar for å:
- Godta klienttilkoblinger.
- Administrere en liste over hvilke klienter som abonnerer på hvilke emner.
- Motta meldinger fra «publisher»-klienter.
- Distribuere meldingene til alle «subscriber»-klienter for det aktuelle emnet.
Vi bruker datastrukturen Map på serveren til å lagre abonnementer, der hvert emnenavn knyttes til et Set med tilkoblede WebSocket-klientobjekter.
Utforme meldingsformater
For at Pub/Sub-systemet vårt skal fungere, trenger klientene og serveren en tydelig måte å kommunisere på. Vi bruker enkle JSON-meldinger.
1. Abonnementsmelding (klient til server):
{ "action": "subscribe", "topic": "chat:general" }2. Publiseringsmelding (klient til server):
{ "action": "publish", "topic": "news", "payload": "Breaking: New feature released!" }3. Levert melding (server til klient):
{ "type": "message", "topic": "chat:general", "payload": "Hello everyone!" }Server: Grunnleggende Pub/Sub-logikk
Her er en komplett Node.js-WebSocket-server som implementerer grunnleggende Pub/Sub. Den håndterer både subscribe- og publish-meldinger.
Kjør denne koden (node server.js etter npm install ws), og koble deretter klienter til i nettleseren for å teste den!
const { WebSocketServer } = require('ws');
const wss = new WebSocketServer({ port: 8080 });
// Stores active subscriptions: Map<topic, Set<WebSocket>>
const subscriptions = new Map();
wss.on('connection', ws => {
console.log('Client connected.');
ws.on('message', message => {
try {
const data = JSON.parse(message.toString());
const { action, topic, payload } = data;
if (action === 'subscribe' && topic) {
if (!subscriptions.has(topic)) {
subscriptions.set(topic, new Set());
}
subscriptions.get(topic).add(ws);
ws.send(JSON.stringify({ status: 'subscribed', topic }));
console.log(`Client subscribed to '${topic}'.`);
} else if (action === 'publish' && topic && payload) {
const topicSubscribers = subscriptions.get(topic);
if (topicSubscribers) {
topicSubscribers.forEach(subscriber => {
if (subscriber.readyState === ws.OPEN) {
subscriber.send(JSON.stringify({ type: 'message', topic, payload }));
}
});
console.log(`Published to '${topic}': ${payload}.`);
} else {
ws.send(JSON.stringify({ error: `No subscribers for '${topic}'.` }));
}
} else {
ws.send(JSON.stringify({ error: 'Invalid message.' }));
}
} catch (e) {
console.error('Message error:', e.message);
ws.send(JSON.stringify({ error: 'JSON parse error.' }));
}
});
// Connection close and error handling in the next scene
});
console.log('Pub/Sub server running on ws://localhost:8080');Server: Tilkoblingens livssyklus
Det er avgjørende å administrere tilkoblingens livssyklus for å lage en robust Pub/Sub-server. Serveren må håndtere frakoblinger på en kontrollert måte.
- Hendelsen
ws.on('close')utløses når en klient kobler fra. - Inne i denne håndtereren går vi gjennom alle emner og fjerner den frakoblede klienten fra alle abonnementslistene den var en del av.
- Vi rydder også opp i emner som blir tomme etter at en klient forlater dem.
- Håndtereren
ws.on('error')fanger opp kommunikasjonsfeil.
Klient: Koble til og abonnere
La oss nå se på klientsiden, som vanligvis kjører i en nettleser. Vi bruker det innebygde WebSocket-API-et.
Denne kodebiten kobler til serveren vår og sender en subscribe-melding for et bestemt emne.
Husk å åpne denne HTML-filen i en nettleser og sørge for at Node.js-serveren kjører!
<!-- index.html -->
<!DOCTYPE html>
<html>
<head><title>Pub/Sub Client</title></head>
<body>
<h1>Pub/Sub Client</h1>
<p>Status: <span id="status">Disconnected</span></p>
<ul id="messages"></ul>
<script>
const ws = new WebSocket('ws://localhost:8080');
const statusElem = document.getElementById('status');
const messagesElem = document.getElementById('messages');
ws.onopen = () => {
statusElem.textContent = 'Connected';
console.log('Connected to server');
// Subscribe to a topic
ws.send(JSON.stringify({ action: 'subscribe', topic: 'chat:general' }));
ws.send(JSON.stringify({ action: 'subscribe', topic: 'news' }));
};
ws.onclose = () => {
statusElem.textContent = 'Disconnected';
console.log('Disconnected from server');
};
ws.onerror = (error) => {
console.error('WebSocket Error:', error);
};
// Message handling in the next scene
</script>
</body>
</html>Klient: Motta og vise
Når klienten har abonnert, må den lytte etter innkommende meldinger fra serveren. Hendelsen ws.onmessage er stedet der dette skjer.
Når en melding kommer inn, tolker vi JSON-innholdet og kan vise det til brukeren, for eksempel ved å filtrere eller formatere det basert på meldingens topic.
Prøv å åpne flere nettleserfaner, abonnere på det samme emnet og deretter publisere en melding fra én fane (for eksempel via konsollen) for å se den vises i de andre!
<!-- index.html (continued script part) -->
// ... (ws.onopen, ws.onclose, ws.onerror from previous scene)
ws.onmessage = event => {
const data = JSON.parse(event.data);
console.log('Received:', data);
if (data.type === 'message') {
const listItem = document.createElement('li');
listItem.textContent = `[${data.topic}] ${data.payload}`;
messagesElem.appendChild(listItem);
} else if (data.status === 'subscribed') {
const listItem = document.createElement('li');
listItem.textContent = `Successfully subscribed to '${data.topic}'.`;
messagesElem.appendChild(listItem);
} else if (data.error) {
console.error('Server error:', data.error);
const listItem = document.createElement('li');
listItem.style.color = 'red';
listItem.textContent = `Error: ${data.error}`;
messagesElem.appendChild(listItem);
}
};
// Example of how a client could publish a message (e.g., via a button click)
// ws.send(JSON.stringify({ action: 'publish', topic: 'chat:general', payload: 'Hello from client!' }));
</script>
</body>
</html>Avanserte Pub/Sub-mønstre
Selv om det grunnleggende Pub/Sub-systemet vårt fungerer, trenger virkelige applikasjoner ofte mer:
- Avslutte abonnement: En klient bør kunne slutte å motta meldinger for et emne. Dette innebærer en ny meldingshandling (for eksempel
{ "action": "unsubscribe", "topic": "news" }) og logikk på serversiden som fjerner klienten fra emnets abonnementssett. - Emnehierarkier: Gjør det mulig å abonnere på mønstre som
news.*for å motta alle nyhetsemner på lavere nivå. - Vedvarende meldinger: Lagre meldinger slik at nye abonnenter kan motta tidligere meldinger, for eksempel chathistorikk.
Kort kontroll
Se på Pub/Sub-systemet vi nettopp bygde. Hvilken komponent har hovedansvaret for å avgjøre hvilke abonnenter som skal motta en melding som publiseres til et bestemt emne?
Oppsummering og veien videre
Gratulerer! De har lært å utforme og implementere et grunnleggende Publish/Subscribe-meldingssystem ved hjelp av WebSocket.
Vi gikk gjennom kjernekomponentene (Publisher, Subscriber, Topic, Broker), definerte meldingsformater og bygde både broker-logikken på serversiden og abonnements- og mottaksfunksjonaliteten på klientsiden.
Pub/Sub er et grunnleggende mønster for mange sanntidsapplikasjoner. Eksperimenter med å legge til funksjonalitet for å avslutte abonnementer, mer avansert emnebehandling eller integrasjon med eksterne meldingskøer for større skala.
Lær deg Programmering av WebSockets og sanntidssystemer med en AI-veileder – gratis
Skriv og kjør ekte kode i nettleseren, få umiddelbar hjelp fra en AI-veileder som er tilgjengelig døgnet rundt, og fortsett der du slapp – på nettet eller i appen.
- Kurs
- 12
- Leksjoner
- 47
Ofte stilte spørsmål
Er leksjonen «Implementering av publish/subscribe-meldinger» gratis?
Ja – hele teksten i «Implementering av publish/subscribe-meldinger» er gratis å lese her på nettet. For å øve interaktivt med en innebygd kodeeditor og en AI-veileder som er tilgjengelig døgnet rundt, og for å låse opp resten av Programmering av WebSockets og sanntidssystemer-kurset, kan du oppgradere til CoddyKit PRO. Kurset i Programmering av WebSockets og sanntidssystemer inneholder totalt 4 leksjoner.
Hva lærer jeg i «Implementering av publish/subscribe-meldinger»?
Utform og bygg et pub/sub-system over WebSockets for emnebasert meldingsdistribusjon. Du øver på Programmering av WebSockets og sanntidssystemer med praktisk kode som du kjører direkte i nettleseren, mens en AI-veileder som er tilgjengelig døgnet rundt, svarer på spørsmålene dine mens du jobber deg gjennom leksjonen.
Trenger jeg erfaring for å begynne med Programmering av WebSockets og sanntidssystemer?
Ingen tidligere erfaring er nødvendig. Programmering av WebSockets og sanntidssystemer på CoddyKit er lagt opp for både nybegynnere og viderekomne, så De kan begynne her eller helt fra start og lære i Deres eget tempo. Dette er leksjon 1 av 4.
Hvor lang tid tar leksjonen «Implementering av publish/subscribe-meldinger»?
De fleste CoddyKit-leksjoner tar omtrent 5–10 minutter. Hver leksjon er kort og interaktiv, slik at De gjør jevne fremskritt og kan fortsette akkurat der De slapp – både på nettet og i appen.
Kan jeg skrive og kjøre kode i denne Programmering av WebSockets og sanntidssystemer-leksjonen?
Ja. Alle Programmering av WebSockets og sanntidssystemer-leksjoner har en innebygd kodeeditor, slik at De kan skrive og kjøre ekte kode direkte i nettleseren og få umiddelbar tilbakemelding fra AI – uten lokal konfigurering.
Alle leksjonene i dette kurset
- Implementering av publish/subscribe-meldinger
- Request-response over WebSockets
- Toveis strømming og flytkontroll
- Tilbakepress og bunting av meldinger