Search⌘ K
AI Features

Synchronize Multiple Channel Clients

Explore how to synchronize real-time shopping cart data across multiple browser tabs using Phoenix channels and PubSub. Understand broadcasting techniques, message interception, and state updates to ensure all clients reflect cart changes instantly.

Synchronize our cart

Each shopper that joins our ShoppingCartChannel does so on a private topic, like cart:123abc. This cart ID is random and long, so we can uniquely identify a cart. To synchronize our cart across multiple tabs, we’ll use this topic. We’ll send the serialized version of our cart using Phoenix.PubSub and intercept it in the ShoppingCartChannel. It will only be received by Channel ...