use_event_source

Usage

Values are decoded via the given decoder. You can use any of the string codecs or a binary codec wrapped in Base64.

Please check the codec chapter to see what codecs are available and what feature flags they require.

use leptos::prelude::*;
use leptos_use::{use_event_source, UseEventSourceReturn};
use codee::string::JsonSerdeCodec;
use serde::{Deserialize, Serialize};

#[derive(Serialize, Deserialize, Clone, PartialEq)]
pub struct EventSourceData {
    pub message: String,
    pub priority: u8,
}

#[component]
fn Demo() -> impl IntoView {
let UseEventSourceReturn {
    ready_state, message, error, close, ..
} = use_event_source::<EventSourceData, JsonSerdeCodec>("https://event-source-url");

view! { }
}

Named Events

You can define named events when using use_event_source_with_options.

use leptos::prelude::*;
use leptos_use::{use_event_source_with_options, UseEventSourceReturn, UseEventSourceOptions};
use codee::string::FromToStringCodec;

#[component]
fn Demo() -> impl IntoView {
let UseEventSourceReturn {
    ready_state, message, error, close, ..
} = use_event_source_with_options::<String, FromToStringCodec>(
    "https://event-source-url",
    UseEventSourceOptions::default()
        .named_events(["notice".to_string(), "update".to_string()])
);

view! { }
}

You can provide a custom on_event handler using use_event_source_with_options. on_event wil be run for every received event, including the built-in open, error, and message events, as well as any named events you have specified.

With the return value of on_event you can control, whether message and named events should be further processed by use_event_source (UseEventSourceOnEventReturn::ProcessMessage) or ignored (UseEventSourceOnEventReturn::IgnoreProcessingMessage).

By default, the handler returns UseEventSourceOnEventReturn::ProcessMessage.

use leptos::prelude::*;
use leptos_use::{use_event_source_with_options, UseEventSourceReturn, UseEventSourceOptions, UseEventSourceMessage, UseEventSourceOnEventReturn};
use codee::string::FromToStringCodec;

#[component]
fn Demo() -> impl IntoView {
// Custom example handler: log event name and check for named `custom_error` event
let custom_event_handler = |e: &web_sys::Event| {
    leptos::logging::log!("Received event: {}", e.type_());
    if e.type_() == "custom_error" {
        if let Ok(error_message) = UseEventSourceMessage::<String, FromToStringCodec>::try_from(e.clone()) {
            // Decoded successfully, log the error message
            leptos::logging::log!("Error message: {}", error_message.data);
            // skip processing this message event further
            return UseEventSourceOnEventReturn::IgnoreProcessingMessage;
        }
    }
    // Process other message events normally
    UseEventSourceOnEventReturn::ProcessMessage
};
let UseEventSourceReturn {
    ready_state, message, error, close, ..
} = use_event_source_with_options::<String, FromToStringCodec>(
    "https://event-source-url",
    UseEventSourceOptions::default()
        .named_events(["custom_error".to_string()])
        .on_event(custom_event_handler)
);

view! { }
}

Immediate

Auto-connect (enabled by default).

This will call open() automatically for you, and you don't need to call it by yourself.

Auto-Reconnection

Reconnect on errors automatically (enabled by default).

You can control the number of reconnection attempts by setting reconnect_limit and the interval between them by setting reconnect_interval.

use leptos::prelude::*;
use leptos_use::{use_event_source_with_options, UseEventSourceReturn, UseEventSourceOptions, ReconnectLimit};
use codee::string::FromToStringCodec;

#[component]
fn Demo() -> impl IntoView {
let UseEventSourceReturn {
    ready_state, message, error, close, ..
} = use_event_source_with_options::<bool, FromToStringCodec>(
    "https://event-source-url",
    UseEventSourceOptions::default()
        .reconnect_limit(ReconnectLimit::Limited(5))         // at most 5 attempts
        .reconnect_interval(2000)   // wait for 2 seconds between attempts
);

view! { }
}

SendWrapped Return

The returned closures open and close are sendwrapped functions. They can only be called from the same thread that called use_event_source.

To disable auto-reconnection, set reconnect_limit to 0.

Server-Side Rendering

Make sure you follow the instructions in Server-Side Rendering.

On the server-side, use_event_source will always return ready_state as ConnectionReadyState::Closed, data, event and error will always be None, and open and close will do nothing.

Feature

This function is only available if the crate feature use_event_source is enabled

Types

Source

Source • Docs