De cele mai multe ori vedem că echipele (prin Socket.io sau Pusher) atunci când trebuie doar să actualizeze un UI cu modificări ale stării de pe partea serverului. În timp ce WebSockets sunt puternice, ele sunt adesea overkill. Acesta este protocolul pe care trebuie să-l stăpânești. WebSockets Server-Sent Events (SSE) SSE rulează pe standard HTTP/1.1 sau HTTP/2. Nu necesită mânere complexe, funcționează cu mecanisme de autentificare standard, iar suportul nativ este încorporat în fiecare browser modern prin intermediul . EventSource API În acest ghid, vom implementa SSE în Symfony 7.4 folosind două abordări: 
 
 
 Abordarea nativă: utilizarea StreamedResponse (Bine pentru înțelegerea protocolului și a sarcinilor simple, cu concurență redusă). Abordarea de producție: Folosind protocolul Mercure (standardul scalabil, non-blocant pentru Symfony). Abordarea nativă (StreamedResponse) Simfonia lui Vă permite să și spălați datele către client în mod progresiv. Aceasta este implementarea „brutală” a standardului SSE. StreamedResponse keep an HTTP connection open Vom folosi un generator sau o buclă pentru a simula datele de streaming. namespace App\Controller;

use Symfony\Bundle\FrameworkBundle\Controller\AbstractController;
use Symfony\Component\HttpFoundation\StreamedResponse;
use Symfony\Component\Routing\Attribute\Route;

#[Route('/api/stream', name: 'api_stream_stock')]
class StockStreamController extends AbstractController
{
    #[Route('/stock/{symbol}', name: 'stock_ticker', methods: ['GET'])]
    public function stream(string $symbol): StreamedResponse
    {
        // 1. Create the StreamedResponse
        $response = new StreamedResponse(function () use ($symbol) {
            // 2. Prevent PHP time limits for long-running processes
            set_time_limit(0); 
            
            // 3. Simple loop to simulate data stream
            // In a real app, you might check Redis or a Database here
            $i = 0;
            while (true) {
                // Connection check: Stop if client disconnected
                if (connection_aborted()) {
                    break;
                }

                $data = [
                    'symbol' => strtoupper($symbol),
                    'price' => rand(100, 200),
                    'timestamp' => date('c'),
                    'sequence' => $i++
                ];

                // 4. Format according to SSE Spec
                // Format: "data: {payload}\n\n"
                echo "event: stock_update\n"; // Optional event name
                echo 'data: ' . json_encode($data) . "\n\n";

                // 5. Critical: Flush the buffer to send data immediately
                ob_flush();
                flush();

                // simulate delay
                sleep(2);
            }
        });

        // 6. Set Headers specifically for SSE
        $response->headers->set('Content-Type', 'text/event-stream');
        $response->headers->set('Cache-Control', 'no-cache');
        $response->headers->set('X-Accel-Buffering', 'no'); // Crucial for Nginx

        return $response;
    }
}
 Nu aveți nevoie de o bibliotecă pentru acest lucru.Sursa nativă de evenimente a browserului este robustă. <!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Symfony SSE Stream</title>
</head>
<body>
    <h1>Live Ticker: <span id="symbol">LOADING...</span></h1>
    <div id="price" style="font-size: 2rem;">--</div>
    <ul id="log"></ul>

    <script>
        const symbol = 'AAPL';
        // Connect to the Symfony endpoint
        const eventSource = new EventSource(`/api/stream/stock/${symbol}`);

        // Listen for the specific 'stock_update' event name defined in PHP
        eventSource.addEventListener('stock_update', (e) => {
            const data = JSON.parse(e.data);
            
            document.getElementById('symbol').innerText = data.symbol;
            document.getElementById('price').innerText = '$' + data.price;
            
            // Log for visibility
            const li = document.createElement('li');
            li.innerText = `${data.timestamp}: $${data.price}`;
            document.getElementById('log').prepend(li);
        });

        eventSource.onerror = (err) => {
            console.error("EventSource failed:", err);
            // EventSource auto-reconnects by default, but you can handle closure here
        };
    </script>
</body>
</html>
 Configurarea serverului (critică) Acesta este punctul în care majoritatea dezvoltatorilor eșuează. serverele web (nginx, etc.) iubesc ieșirea tamponului pentru a optimiza compresia. Pentru SSE, tamponarea ucide fluxul (clientul nu primește nimic până când tamponul se umple). Trebuie să dezactivezi Sau să folosească Am adăugat controlerul. fastcgi_buffering X-Accel-Buffering: no header # inside your location ~ \.php$ block
fastcgi_split_path_info ^(.+\.php)(/.+)$;
# ... standard config ...
# Ensure buffering is off for SSE if headers fail
fastcgi_buffering off;
 Verifică-ți Asigură Este stabilit să sau o valoare scăzută. php.ini output_buffering Off Verificări : 
 
 
 
 
 
 Start your local server:  symfony server:start 
 
 Open your terminal. 
 
 Use   to verify the stream without a browser: curl curl -N -v http://127.0.0.1:8000/api/stream/stock/AAPL
 
 
 
 -N: Dezactivează tamponarea în curl. Rezultate așteptate: ar trebui să vedeți un obiect JSON care apare la fiecare 2 secunde. Verificarea realității „Senior” (de ce nativul este periculos) În timp ce codul de mai sus funcționează, rar îl recomand pentru aplicațiile de producție cu trafic ridicat. Când un client se conectează la /api/stream/stock/AAPL, acel proces de lucru PHP-FPM intră într-o . . . PHP is synchronous while(true) loop It is locked Dacă aveți 50 de angajați PHP-FPM și 50 de utilizatori deschid această pagină, întregul site se prăbușește. De asemenea, păstrează o conexiune de bază de date deschisă dacă nu sunteți atenți. Trebuie să descărcați managementul conexiunii deschise într-un serviciu dedicat special conceput pentru acesta. . Mercure Metoda de producţie (mercur) Mercure este un protocol deschis pentru actualizări în timp real. 
 
 
 
 
 Clientul se conectează la Hub (nu la aplicația dvs. PHP) pentru a asculta evenimente. Symfony trimite o singură solicitare POST la Hub atunci când datele se schimbă. Hub transmite datele către mii de ascultători. Rezultatul: blocarea zero a proceselor PHP. În mediul de producție, nu puteți lăsa fluxul public. Trebuie să controlați cine poate asculta ce. Utilizarea mercurului pentru aceasta. JSON Web Tokens (JWT) 
 
 
 Publisher JWT: Permite aplicației Symfony să împingă date (tratate automat de pachet prin MERCURE_JWT_SECRET). JWT: Permite browser-ului unui utilizator să asculte actualizări private. Iată cum se pune în aplicare Cuvânt cheie: Symfony 7.4 Subscriber JWT Instalați biblioteca JWT Avem nevoie de o bibliotecă pentru a genera token-uri manual pentru utilizatorii noștri. este standardul în ecosistemul PHP. lcobucci/jwt composer require lcobucci/jwt
 Serviciul Token Generator Creați un serviciu care generează un JWT semnat pentru un anumit utilizator. să solicite listarea subiectelor la care utilizatorul are permisiunea de a accesa. mercure //src/Service/MercureTokenGenerator.php

namespace App\Service;

use Lcobucci\JWT\Configuration;
use Lcobucci\JWT\Signer\Hmac\Sha256;
use Lcobucci\JWT\Signer\Key\InMemory;
use Symfony\Component\DependencyInjection\Attribute\Autowire;

class MercureTokenGenerator
{
    private Configuration $config;

    public function __construct(
        // Inject the same secret used in your .env for the Mercure Hub
        #[Autowire('%env(MERCURE_JWT_SECRET)%')]
        private string $secret
    ) {
        $this->config = Configuration::forSymmetricSigner(
            new Sha256(),
            InMemory::plainText($this->secret)
        );
    }

    public function generate(string $userTopic): string
    {
        return $this->config->builder()
            ->withClaim('mercure', [
                'subscribe' => [
                    $userTopic, // Allow access to this specific topic
                    // 'https://mysite.com/books/{id}' // You can add patterns here
                ]
            ])
            ->getToken($this->config->signer(), $this->config->signingKey())
            ->toString();
    }
}
 Injectarea token-ului (metoda cookie) Browserul nativ nu acceptă trimiterea de titluri HTTP (cum ar fi ) din EventSource API Authorization: Bearer Pentru a rezolva acest lucru fără a adăuga polyfills JavaScript grele, folosim un Mercure Hub caută automat un cookie numit . Cookie mercureAuthorization //src/Controller/StockPageController.php

namespace App\Controller;

use App\Service\MercureTokenGenerator;
use Symfony\Bundle\FrameworkBundle\Controller\AbstractController;
use Symfony\Component\HttpFoundation\Cookie;
use Symfony\Component\HttpFoundation\Response;
use Symfony\Component\Routing\Attribute\Route;

class StockPageController extends AbstractController
{
    #[Route('/dashboard', name: 'app_dashboard')]
    public function index(MercureTokenGenerator $tokenGenerator): Response
    {
        // 1. Define the private topic this user is allowed to see
        $userTopic = 'https://mysite.com/user/123/alerts';

        // 2. Generate the JWT
        $token = $tokenGenerator->generate($userTopic);

        // 3. Create the response (render your Twig template)
        $response = $this->render('dashboard/index.html.twig', [
            'userTopic' => $userTopic
        ]);

        // 4. Attach the JWT as a Cookie
        // The Hub must be on the same domain (or subdomain) for this to work
        $response->headers->setCookie(Cookie::create(
            'mercureAuthorization',
            $token,
            0,              // Session cookie
            '/.well-known/mercure', // Path (critical: restricts cookie to Hub)
            null,           // Domain (null = current domain)
            false,          // Secure (true if HTTPS)
            true,           // HttpOnly
            false,          // Raw
            'strict'        // SameSite
        ));

        return $response;
    }
}
 Actualizarea editorului Acum, actualizați serviciul editorului pentru a marca actualizarea ca privată. // ...
public function publishPrivateAlert(string $userId, string $message): void
{
    $topic = "https://mysite.com/user/{$userId}/alerts";
    
    $update = new Update(
        $topic,
        json_encode(['alert' => $message]),
        true // <--- TRUE marks this as Private
    );

    $this->hub->publish($update);
}
 Pagina clientului (nu este nevoie de modificări) Pentru că am folosit o , JavaScript rămâne exact același. Browser-ul va trimite automat cookie atunci când se conectează la hub. Cookie mercureAuthorization // The browser sends the cookie automatically!
const eventSource = new EventSource(hubUrl);
 Verificare 
 
 
 
 
 Cookie-uri clare: Ștergeți cookie-urile browserului localhost. Load Dashboard: Vizitați /dashboard. Inspectați fila Rețea. Ar trebui să vedeți un titlu Set-Cookie cu mercureAuthorization. Verificarea conexiunii: Cererea EventSource către hub ar trebui să fie acum verde (200 OK). Test Confidențialitate: Încercați să curbați hub-ul direct fără cookie-ul; veți primi un 401 Neautorizat pentru subiecte private. Concluzie După cum am explorat, implementarea datelor în timp real în Symfony 7.4 nu este doar despre deschiderea unei conexiuni; este despre alegerea arhitecturii care se potrivește cu modelele de trafic. În timp ce Oferă o rută rapidă, fără dependență pentru sarcinile administrative (cum ar fi bare de progres ale exportului) sau instrumente interne cu trafic scăzut, prezintă riscuri semnificative în ceea ce privește epuizarea lucrătorilor PHP. Native StreamedResponse Pentru orice caracteristică orientată spre utilizator – fie că este vorba de un dashboard live, un centru de notificări sau un instrument de colaborare – Este cea Pentru cei Se deconectează complet logica aplicației de la gestionarea conexiunii, permițând backend-ului Symfony să rămână stateless și performant, în timp ce Caddy se ocupă de ridicarea grea a menținerii a mii de conexiuni inactiv. Mercure non-negotiable standard modern Symfony ecosystem Stăpânirea acestor modele vă permite să vă deplasați dincolo de ciclurile de viață simple „cerere-răspuns” și să construiți aplicații care se simt vii și receptive. Să rămânem în atingere Arhitectura în timp real aduce adesea complexități ascunse în ceea ce privește echilibrarea sarcinii, configurația proxy inversă (Nginx / HAProxy) și limitele de securitate. Să discutăm cum vă putem pregăti aplicația în timp real.

Read My Stories

Acest audio este produs în limba originală a poveștii!

Tot ce trebuie să știți despre Mastering Server-Sent Events (SSE) în Symfony 7.4

About Author

COMENTARII

Etichete suspendate

ACEST ARTICOL A FOST PREZENTAT IN

Related Stories

The TechBeat: Apple Customers Return Vision Pro By The Droves (2/26/2024)

The #bitcoin Writing Contest by Rootstock and HackerNoon: Round 1 Results 🎉

Round the year with the stars by Garrett Putman Serviss - Table of Links

Can Bitcoin Hit 1 Million Dollars?

The TechBeat: Apple Customers Return Vision Pro By The Droves (2/26/2024)

The #bitcoin Writing Contest by Rootstock and HackerNoon: Round 1 Results 🎉

Round the year with the stars by Garrett Putman Serviss - Table of Links

Can Bitcoin Hit 1 Million Dollars?

Light-Mode

Classic

Newspaper

Minty

Dark-Mode

Neon Noir

Minty

HN StartUps