Next.js Discord

Discord Forum

How to consume SSE with NextJs

Unanswered
Giant panda posted this in #help-forum
Open in Discord
Avatar
Giant pandaOP
Hello, is there a easy way with NextJs to deal with SSE, or should I use the default api ?

export default function ContainersList() {

    const [containers, setContainers] = useState([]);

    useEffect(() => {
        let eventSource = new EventSource('http://localhost:8080/api/v1/docker/containers');

        eventSource.addEventListener("docker-container-update", (event) => {
            const container = JSON.parse(event.data);

            console.log(container.Id);
            setContainers(container);
        });

        return () => {
            eventSource.close();
        };
    }, []);

    return (
        <div>
            <h1 className="text-2xl font-bold mb-4">Containers</h1>
            <ul>
                {
                    containers && containers.length === 0 &&
                    <li>No containers</li>
                }
            </ul>
        </div>
    );
}


Regards;

0 Replies