![Build a UGC Live Streaming App with Amazon IVS: Creating a Channel Page for a User (Lesson 5.1)](/_next/image?url=https%3A%2F%2Fassets.community.aws%2Fa%2F2Zb5E4jbz99dKSm7y7yLEMM1Rwt.png%3FimgSize%3D1280x720&w=3840&q=75)
Build a UGC Live Streaming App with Amazon IVS: Creating a Channel Page for a User (Lesson 5.1)
Welcome to Lesson 5.1 in this series where we're looking at building a web based user-generated content live streaming application with Amazon IVS. This entire series is available in video format on the AWS Developers YouTube channel and all of the code related to the sample application used in this series can be viewed on GitHub. Refer to the links at the end of the post for more information.
Todd Sharp
Amazon Employee
Published Jan 2, 2024
In this lesson, we'll take a look at how the StreamCat UGC application handles playback for both low-latency and real-time live streams.
If you remember from earlier lessons in this course, each registered user in the StreamCat application is assigned a dedicated low-latency Amazon IVS
Channel
when they sign up for a new account. ![User Channel Relationship User Channel Relationship](/_next/image?url=https%3A%2F%2Fassets.community.aws%2Fa%2F2aOy8N8nul9Nr3hqQhcFkzwhb49.png%3FimgSize%3D700x482&w=3840&q=75)
In past lessons, we saw how users can broadcast to this channel from third-party applications or directly within their browser via the Amazon IVS Web Broadcast SDK.
Users are also assigned a
Stage
which is used for real-time streaming.![User Stage Relationship User Stage Relationship](/_next/image?url=https%3A%2F%2Fassets.community.aws%2Fa%2F2aOyDnHkvOsWXlqxEgJnzXon9q3.png%3FimgSize%3D700x308&w=3840&q=75)
Depending on your business needs, your application might want to combine both of these stream types into a single web page or offer only low-latency or real-time streams. To keep things simple and easier to demo, the StreamCat application uses two separate web pages for playback, depending on the type of broadcast (low-latency vs. real-time).
To create a playback channel for low-latency streams, StreamCat needs the following data:
- The
Channel
which contains theplaybackUrl
- The
ChatRoom
which contains the information necessary to create a chat experience for viewers (more in a future lesson) - If the current user follows the current channel to know if it needs to render a "follow" button (more in a future lesson)
Playback channels for low-latency streams use the
/channel/{channelName}
format, where {channelName}
determines which channel is being viewed. The endpoint for this playback channel looks like this:To create a web page for real-time stream playback, StreamCat needs:
- The
Stage
- The
Channel
- A token to connect as a view-only stage participant
Playback channels for real-time streams use the
/channel/realtime/{channelName}
format, where {channelName}
determines which stage is being viewed. The endpoint for this playback channel looks like this:In this lesson, we learned that StreamCat uses separate web views for low-latency and real-time streams. We saw how the application retrieves information related to those streams and passes that data to the views. In the next few lessons, we'll see how this information is used to create a playback experience for channel viewers.
Any opinions in this post are those of the individual author and may not reflect the opinions of AWS.