Event Source SSE

[andersoninnove]

Hi,

I would like some help regarding this eventsource implementation. I have an application that needs this part, but in the documentation, I didn't find anything conclusive. I need a guide, more examples...

I thank the attention.

[SimonFrings]

Hey @andersoninnove, thanks for bringing this up 👍

I'm happy to help you out, but I'm not quite sure what you're currently looking for in specific. If you're asking for assistance with implementing Framework X into your application, you need to provide a few more insights and what's currently holding you back to achieve this. This would also help in order to figure out if this is something that isn't currently covered by our documentation.

If you're looking for professional support instead, you can also reach out to us via email or visit https://clue.engineering/ and we can schedule a call to take a look at your project together.

You're also talking about an eventsource implementation above, so if that's what you're looking for, maybe it's worth to check out https://github.com/clue/reactphp-eventsource.

[Wilaak]

Being new to async I found some aspects a bit confusing. For example, writing to the stream immediately doesn’t yield any response:

$app->get('/events', function () {
    $stream = new React\Stream\ThroughStream();
    $stream->write("data: $message\n\n");

    return new React\Http\Message\Response(
        React\Http\Message\Response::STATUS_OK,
        [
            'Content-Type' => 'text/event-stream'
        ],
        $stream
    );
});

However, introducing a timer resolves this—presumably because the response must be returned first so the server can properly attach the consumer to the stream. A deeper explanation of this behavior would be helpful.

$app->get('/events', function () {
    $stream = new React\Stream\ThroughStream();

    // Schedule a closure to execute after sending the response.
    $loop = React\EventLoop\Loop::get();
    $loop->addPeriodicTimer(0, function () use ($stream) {
        // Connection established, do you stuff here e.g first sync
        $data = "data: " . date('Y-m-d H:i:s') . "\\n\\n";
        $stream->write($data);
        $stream->end();
    });

    // Stop the loop once the stream is closed to prevent it from running indefinitely.
    $stream->on('close', function () use ($loop) {
        $loop->stop();
    });

    return new React\Http\Message\Response(
        React\Http\Message\Response::STATUS_OK,
        ['Content-Type' => 'text/event-stream'],
        $stream
    );
});

While this approach works, it feels a bit awkward. I think a more detailed guide or documentation would be very beneficial.

Edit:

A more intuitive way of immediatley sending a response I've found is to use the EventLoop's futureTick method:

$app->get('/events', function () {
    $stream = new React\Stream\ThroughStream();

    // Schedule closure to execute after sending the response.
    $loop = React\EventLoop\Loop::get();
    $loop->futureTick(function () use ($stream) {
        // Connection established, do you stuff here e.g first sync
        $data = "data: " . date('Y-m-d H:i:s') . "\n\n";
        $stream->write($data);
        $stream->end();
    });

    return new React\Http\Message\Response(
        React\Http\Message\Response::STATUS_OK,
        ['Content-Type' => 'text/event-stream'],
        $stream
    );
});

For reference ReactPHP SSE Examples

Currently, I’m working on integrating Datastar into my application, which I believe would be an excellent project to showcase the capabilities of Framework X / ReactPHP