SSE — co to je, Server-Sent Events a jednosměrný streaming

Co je SSE?

SSE (Server-Sent Events) — technologie, která umožňuje webovému serveru odesílat data klientovi kdykoli po navázání připojení. Je standardizována WHATWG jako součást HTML Living Standard a používá MIME typ text/event-stream. SSE podporuje přenos textových dat s možností určení identifikátoru zprávy, typu události a zpoždění znovupřipojení.

Na rozdíl od WebSocketu, který vyžaduje obousměrný protokol a upgrade požadavek, SSE funguje přes běžné HTTP. Server nastaví hlavičku Content-Type: text/event-stream, odesílá data po částech a udržuje připojení otevřené. Klient přijímá data přes EventSource API prohlížeče, které automaticky parsuje stream a generuje události.

Podle údajů CanIUse (2025) je EventSource API podporován v 97,5 % prohlížečů globálně. Není podporován v Internet Exploreru a některých mobilních prohlížečích (Samsung Internet do verze 7.0). Pro tyto případy existují polyfilly emulující EventSource přes XHR streaming. SSE nefunguje s HTTP/1.1 pipelining, ale je plně kompatibilní s HTTP/2 server push.

Historie a standardizace

SSE byl navržen jako součást specifikace HTML5 v roce 2009 pod názvem Server-Sent DOM Events. První implementace se objevila v Opera 9.0, poté ve Firefox 6.0 (2011), Chrome 9.0 (2011) a Safari 5.0 (2010). V roce 2015 byla specifikace vyčleněna do samostatné sekce HTML Living Standardu. Navzdory desetileté historii zůstává SSE méně populární než WebSocket kvůli své jednosměrné povaze.

Jak funguje SSE

Mechanismus fungování SSE je následující: klient vytvoří instanci EventSource s URL serverového endpointu. Prohlížeč odešle GET požadavek s hlavičkou Accept: text/event-stream. Server odpoví stavem 200 OK a hlavičkou Content-Type: text/event-stream, poté začne odesílat data ve formátu event-stream. Připojení zůstává otevřené, dokud server neodešle terminate signál nebo klient nezavolá close().

Na straně serveru jsou data odesílána po částech (chunked transfer encoding). Každý blok dat je textová zpráva sestávající z řádků polí (event, data, id, retry). Server může odesílat zprávy kdykoli, což činí SSE ideálním pro oznámení a aktualizace stavu. Připojení nevyžaduje stálou výměnu heartbeat paketů (jako WebSocket), ačkoli pole retry řídí frekvenci znovupřipojení.

Podle údajů výkonnostních testů (2024) poskytuje SSE propustnost až 10 000 zpráv za sekundu na jedno připojení při velikosti zprávy 256 bajtů. Na straně serveru spotřebuje každé SSE připojení přibližně 5–10 KB paměti, což umožňuje jednomu serveru podporovat 50 000+ současných připojení s 1 GB RAM. To je výrazně méně než WebSocket kvůli absenci binárního protokolu.

Formát event-stream

Formát text/event-stream — jednoduchý textový protokol, kde každá zpráva sestává z pojmenovaných polí oddělených znaky nového řádku. Každé pole má formát „NázevPole: hodnota“. Zprávy jsou odděleny dvěma znaky nového řádku ( ).

Podporovaná pole: event (typ události, výchozí message), data (řetězec dat, může být víceřádkový), id (poslední identifikátor události, uložen v Last-Event-ID), retry (čas znovupřipojení v milisekundách). Komentáře začínají dvojtečkou (:) a parser je ignoruje, ale mohou být použity pro heartbeat.

Příklad toku event-stream

: heartbeat comment
event: update
data: {"user": "Alice", "action": "typing"}
id: 1001

event: notification
data: {"type": "info", "text": "New version available"}
data: {"type": "action", "url": "/upgrade"}
retry: 3000

event: close
data: Session ended

EventSource API na straně klienta

EventSource API — vestavěné rozhraní prohlížeče pro příjem SSE. Pro vytvoření připojení stačí zavolat konstruktor s URL endpointu. EventSource automaticky naváže připojení, spravuje znovupřipojení a parsuje příchozí zprávy do JavaScript událostí.

Události EventSource: open (připojení navázáno), message (přijata zpráva bez uvedení event), error (chyba připojení). Pro vlastní události (event: custom) lze použít addEventListener s názvem události. EventSource automaticky odesílá hlavičku Last-Event-ID při znovupřipojení, což umožňuje serveru obnovit stream od přerušeného místa.

Podle dokumentace MDN (2025) EventSource podporuje CORS a přenos pověření (withCredentials). Pro přenos vlastních hlaviček nebo těla požadavku není EventSource vhodný — vyžaduje ruční implementaci pomocí fetch + ReadableStream. EventSource nepodporuje binární data — pouze text a JSON.

Klientský kód JavaScript

const eventSource = new EventSource('/api/events/stream');

eventSource.addEventListener('open', () => {
    console.log('SSE připojení otevřeno');
});

eventSource.addEventListener('message', (event) => {
    const data = JSON.parse(event.data);
    console.log('Přijato:', data);
    renderUpdate(data);
});

eventSource.addEventListener('notification', (event) => {
    const notification = JSON.parse(event.data);
    showNotification(notification.text);
});

eventSource.addEventListener('error', (error) => {
    console.error('Chyba SSE:', error);
    // Automatické znovupřipojení prohlížeče
});

// Zavřít připojení
eventSource.close();

SSE vs WebSocket: srovnání

SSE a WebSocket — různé technologie pro komunikaci v reálném čase, každá se svými silnými stránkami. WebSocket je vhodný pro obousměrnou výměnu dat (chaty, hry, společné úpravy), SSE pro jednosměrné toky ze serveru ke klientovi (oznámení, zpravodajské kanály, tickery).

Klíčový rozdíl — WebSocket vyžaduje upgrade požadavek z HTTP/1.1 na WebSocket protokol (ws://), který může být blokován firemními proxy. SSE funguje přes běžné HTTP, prochází všemi proxy a nevyžaduje speciální konfiguraci serveru. SSE je také jednodušší na implementaci — server nepotřebuje další knihovnu, stačí správně naformátovat HTTP odpověď.

Podle údajů srovnávacích testů (2024) na jednom serverovém procesu SSE podporuje o 30–50 % více připojení než WebSocket díky jednoduššímu protokolu. Latence SSE je však vyšší (50–200 ms oproti 10–50 ms u WebSocketu), protože SSE používá chunked HTTP, nikoli plně obousměrný tok s binárními rámci.

Jak implementovat SSE na serveru

Implementace SSE na serveru nevyžaduje knihovny — stačí nastavit správné HTTP hlavičky a odesílat data ve formátu text/event-stream. Podívejme se na příklad v Node.js pomocí vestavěného modulu http. Server nastaví hlavičky Content-Type a Cache-Control, poté odesílá zprávy každých N sekund.

Podle MDN Web Docs (2025) jsou povinné hlavičky pro SSE: Content-Type: text/event-stream, Cache-Control: no-cache a Connection: keep-alive. Bez Cache-Control může prohlížeč stream SSE uložit do mezipaměti, což povede k zastavení doručování. Connection: keep-alive výslovně instruuje prohlížeč, aby udržoval připojení otevřené.

Serverový kód v Node.js

const http = require('http');

http.createServer((req, res) => {
    res.writeHead(200, {
        'Content-Type': 'text/event-stream',
        'Cache-Control': 'no-cache',
        'Connection': 'keep-alive'
    });

    let eventId = 0;
    const interval = setInterval(() => {
        eventId++;
        res.write(`id: ${eventId}\n`);
        res.write(`event: update\n`);
        res.write(`data: {"čas": "${new Date().toISOString()}", "id":${eventId}}\n\n`);
    }, 2000);

    req.on('close', () => {
        clearInterval(interval);
    });
}).listen(3000);

SSE v Pythonu (Flask)

from flask import Response, Flask
import time
import json

app = Flask(__name__)

@app.route('/stream')
def stream():
    def generate():
        event_id = 0
        while True:
            event_id += 1
            data = json.dumps(
                {'ticker': 'AAPL', 'price': 150.25})
            yield f'id: {event_id}\nevent: price\ndata: {data}\n\n'
            time.sleep(1)
    return Response(generate(),
        mimetype='text/event-stream')

SSE v mobilních aplikacích

Použití SSE v mobilních aplikacích je omezeno absencí nativní implementace EventSource pro iOS a Android. Na mobilních platformách je SSE implementován prostřednictvím knihoven třetích stran: na iOS — přes URLSession s NSURLProtocol, na Androidu — přes OkHttp s podporou SSE (okhttp-sse). Pro React Native a Flutter jsou k dispozici balíčky emulující EventSource.

Na iOS je nativní implementace SSE možná přes URLSessionDataDelegate. Při příjmu dat v metodě urlSession(_:dataTask:didReceive:) aplikace hromadí buffer a ručně parsuje formát event-stream. Podle blogu iOS vývoje (2024) je spotřeba baterie při SSE na iOS o 40 % nižší než při stálém WebSocket připojení, kvůli absenci heartbeat paketů.

Na Androidu OkHttp poskytuje třídu EventSource.Factory pro odběr SSE streamů. Android aplikace mohou používat SSE pro oznámení, když FCM není dostupný, nebo pro synchronizaci dat na pozadí. SSE na Androidu dobře funguje s WorkManager pro dlouhodobé úlohy na pozadí. Podle dokumentace OkHttp (2025) okhttp-sse podporuje automatické znovupřipojení s vlastním listenerem.