Leptos Server Sent Events

GitHub Actions Crates.io docs.rs

Server signals are leptos kept in sync with the server through server-sent-events (SSE).

The signals are read-only on the client side, and can be written to by the server. This is useful if you want real-time updates on the UI controlled by the server.

Changes to a signal are sent through a SSE to the client as [json patches].

This project is heavily based on leptosserversignal.

Feature flags

Example

Cargo.toml

```toml [dependencies] leptos_sse = "" serde = { version = "", features = ["derive"] }

[features] ssr = [ "leptossse/ssr", "leptossse/axum", # or actix ] ```

Client

```rust use leptos::*; use leptossse::createsse_signal; use serde::{Deserialize, Serialize};

[derive(Clone, Default, Serialize, Deserialize)]

pub struct Count { pub value: i32, }

[component]

pub fn App(cx: Scope) -> impl IntoView { // Provide SSE connection leptossse::providesse(cx, "http://localhost:3000/sse").unwrap();

// Create server signal
let count = create_sse_signal::<Count>(cx, "counter");

view! { cx,
    <h1>"Count: " {move || count().value.to_string()}</h1>
}

} ```

If on stable, use count.get().value instead of count().value.

Server (Axum)

```rust

[cfg(feature = "ssr")]

use { axum::response::sse::{Event, KeepAlive, Sse}, futures::stream::Stream, };

[cfg(feature = "ssr")]

async fn handlesse() -> Sse>> { use futures::stream; use leptossse::ServerSentEvents; use std::time::Duration; use tokio_stream::StreamExt as _;

let mut value = 0;
let stream = ServerSentEvents::new(
    "counter",
    stream::repeat_with(move || {
        let curr = value;
        value += 1;
        Ok(Count { value: curr })
    })
    .throttle(Duration::from_secs(1)),
)
.unwrap();
Sse::new(stream).keep_alive(KeepAlive::default())

} ```

License

This work is released under the MIT license. A copy of the license is provided in the LICENSE file.