Я часто бачу, як команди досягають (через Socket.io або Pusher), коли їм просто потрібно оновити інтерфейс користувача зі змінами стану на стороні сервера. Хоча WebSockets є потужними, вони часто надбиваються. Це протокол, яким ви повинні керувати. WebSockets Server-Sent Events (SSE) SSE працює над стандартним HTTP/1.1 або HTTP/2. Він не вимагає складних рукостискань, працює зі стандартними механізмами автентифікації, а вбудована підтримка вбудована в кожен сучасний браузер через . EventSource API У цьому посібнику ми будемо впроваджувати SSE в Symfony 7.4 за допомогою двох підходів: 
 
 
 The Native Approach: Using StreamedResponse (Великий для розуміння протоколу і простих, низькоконкурентних завдань). Виробничий підхід: Використання протоколу Mercure (складовий, не блокуючий стандарт для Symfony). Народився підхід (StreamedResponse) Симфонія Дозволяє вам Це є «грубим» застосуванням стандарту SSE. StreamedResponse keep an HTTP connection open Створіть новий контролер. Ми будемо використовувати генератор або цикл, щоб імітувати потокові дані. 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;
    }
}
 Для цього вам не потрібна бібліотека. native EventSource браузера є надійним. <!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>
 Конфігурація сервера (критична) Саме тут більшість розробників зазнають невдачі. Веб-сервери (nginx, і т.д.) люблять буферний вихід для оптимізації компресії. Для SSE буферне знищує потік (клієнт не отримує нічого, поки буфер не заповниться). Ви повинні бути знешкоджені Або використовуйте Ми додали в контролер. 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;
 Перевір свій Забезпечити Встановлено на або низької вартості. php.ini output_buffering Off Перевірка : 
 
 
 
 
 
 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: Вимкніть буферування в Curl. Очікуваний вихід: Ви повинні побачити один об'єкт JSON, який з'являється кожні 2 секунди. Перевірка реальності «старшого» (Чому індіанці небезпечні) Хоча вищезазначений код працює, я рідко рекомендую його для виробничих додатків з високим трафіком. Коли клієнт підключається до /api/stream/stock/AAPL, цей процес PHP-FPM вводить . . . PHP is synchronous while(true) loop It is locked Якщо у вас є 50 співробітників PHP-FPM і 50 користувачів, які відкривають цю сторінку, весь ваш сайт падає. Він також тримає зв'язок з базою даних відкритим, якщо ви не обережні. Ви повинні завантажити управління відкритим підключенням до спеціально розробленої для нього служби. . Mercure Підхід до виробництва (Меркурій) Mercure - це відкритий протокол для оновлень в режимі реального часу. 
 
 
 
 
 Клієнт підключається до Hub (а не до вашої програми PHP) для прослуховування подій. Symfony надсилає один запит POST до центру, коли дані змінюються. Hub передає дані тисячам слухачів. Результат: нульове блокування процесів PHP. У виробничому середовищі ви не можете залишити свій потік публічним. Ви повинні контролювати, хто може слухати що. Меркурій використовується Для цього JSON Web Tokens (JWT) 
 
 
 Publisher JWT: Дозволяє вашому додатку Symfony завантажувати дані (автоматично обробляється пакет через MERCURE_JWT_SECRET). JWT: дозволяє браузеру користувача слухати приватні оновлення. Ось як реалізувати Створення Symfony 7.4 Subscriber JWT Завантажити JWT Library Нам потрібна бібліотека для ручного генерування токенів для наших користувачів. Це стандарт в екосистемі PHP. lcobucci/jwt composer require lcobucci/jwt
 Послуги Token Generator Створити сервіс, який генерує підписаний JWT для конкретного користувача. Назвіть теми, до яких користувач має доступ. 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();
    }
}
 Ін’єкція токена (метод cookie) Народився браузер не підтримує надсилання заголовків HTTP (наприклад, ) EventSource API Authorization: Bearer Щоб вирішити це без додавання важких поліфілів JavaScript, ми використовуємо Mercure Hub автоматично шукає файл cookie під назвою . 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;
    }
}
 Оновлення видавця Тепер оновлюйте службу видавця, щоб позначити оновлення як приватне. // ...
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);
}
 Клієнтська сторона (не потрібно ніяких змін) Тому що ми використовуємо , JavaScript залишається точно таким же. браузер автоматично відправляє cookie, коли він підключається до Hub. Cookie mercureAuthorization // The browser sends the cookie automatically!
const eventSource = new EventSource(hubUrl);
 Перевірка 
 
 
 
 
 Очищення файлів cookie: Очищення файлів cookie вашого браузера для localhost. Load Dashboard: Відвідайте /dashboard. Перевірте вкладку Мережа. Ви повинні побачити заголовок Set-Cookie з mercureAuthorization. Перевірка підключення: запит EventSource до Хб тепер повинен бути зеленим (200 ОК). Тест конфіденційності: спробуйте закрутити центр безпосередньо без файлу cookie; ви отримаєте 401 Несанкціонований для приватних тем. Висновок Як ми досліджували, впровадження даних в реальному часі в Symfony 7.4 полягає не тільки в відкритті підключення; це про вибір архітектури, яка відповідає вашим шаблонам трафіку. У той час як пропонує швидкий, беззалежний маршрут для адміністративних завдань (наприклад, барів прогресу експорту) або внутрішніх інструментів з низьким трафіком, він несе значні ризики щодо виснаження працівників PHP. Native StreamedResponse Для будь-якої функції, спрямованої на користувача — будь то панель приладів, центр повідомлень або інструмент співпраці — Це та Для The Він повністю відокремлює вашу логіку додатків від управління підключенням, дозволяючи вашому підключенню Symfony залишатися безстороннім і продуктивним, в той час як Caddy справляється з важким підняттям підтримки тисяч нерухомих підключень. Mercure non-negotiable standard modern Symfony ecosystem Освоєння цих моделей дозволяє вийти за рамки простих життєвих циклів «запиту-відповіді» і створювати додатки, які відчувають себе живими і чуйними. Давайте залишимося на дотику Архітектура в реальному часі часто приносить приховані складнощі щодо збалансування навантаження, конфігурації зворотного проксі (Nginx/HAProxy) та меж безпеки. Давайте поговоримо про те, як ми можемо підготувати вашу заявку в реальному часі.

Read My Stories

Це аудіо створено мовою оригіналу історії!

Все, що потрібно знати для освоєння подій відправлення сервера (SSE) в Symfony 7.4

About Author

КОМЕНТАРІ

ПОВІСИТИ БИРКИ

ЦЯ СТАТТЯ БУЛА ПРЕДСТАВЛЕНА В

Related Stories

Light-Mode

Classic

Newspaper

Minty

Dark-Mode

Neon Noir

Minty

HN StartUps