Cloudflare Stream is fundamentally a way to bypass the insane bandwidth costs and latency associated with self-hosting video, but it’s actually more about controlling the delivery of your video than just storing it.
Let’s say you’ve got a video file – maybe a training video, a marketing explainer, or even just a cool clip you want to share. You upload it to Cloudflare Stream. What happens then?
First, Stream transcodes your video into a few different resolutions and formats. This is crucial because not everyone has a blazing fast internet connection or a fancy 4K monitor. Cloudflare does this automatically, creating versions optimized for various devices and network conditions.
{
"id": "4f3c72b3e0f74d9a8c1b2d3e4f5a6b7c",
"uid": "798e0f1d-a1b2-4c3d-8e4f-5a6b7c8d9e0f",
"thumbnail": "https://imagedelivery.net/xxxxxxxxxxxx/4f3c72b3e0f74d9a8c1b2d3e4f5a6b7c/public",
"status": "ready",
"created": "2023-10-27T10:30:00Z",
"modified": "2023-10-27T10:35:00Z",
"meta": {
"duration": 120.5,
"width": 1920,
"height": 1080,
"vbv_delay": 200
},
"input": {
"width": 1920,
"height": 1080,
"aspect_ratio": "16:9"
},
"allowed_origins": [
"example.com",
"another-site.org"
],
"require_signed_urls": false,
"require_boost_ வித": false
}
This JSON is what you get back after uploading. The id is your video’s unique identifier within Stream. The thumbnail is a generated preview. status: "ready" means the transcoding is complete. meta gives you the video’s technical specs like duration and resolution. The allowed_origins field is important – it specifies which websites are permitted to embed your video.
Once your video is ready, you get a playback URL. This isn’t a direct link to a .mp4 file. Instead, it points to a Cloudflare Stream player. This player is a piece of JavaScript that dynamically selects the best video stream (based on resolution and bandwidth) for the viewer and serves it from Cloudflare’s global network.
Here’s how you’d embed it on your website:
<iframe
src="https://customer-xxxxxxxx.cloudflarestream.com/xxxxxxxxxxxx/xxxxxxxxxxxx/embed"
style="border: none; width: 100%; height: 360px;"
allowfullscreen
allow="accelerometer; gyroscope; picture-in-picture"
></iframe>
Notice the customer-xxxxxxxx.cloudflarestream.com domain. This is Cloudflare’s infrastructure serving your video. The allowfullscreen and allow attributes are standard for modern video players, enabling features like fullscreen mode and better device compatibility.
The problem Stream solves is primarily about delivery optimization and cost reduction. Hosting video yourself means you’re responsible for:
- Bandwidth: Every single view consumes significant bandwidth. If you have popular videos, this bill can be astronomical.
- Transcoding: You need to convert your source video into multiple formats (H.264, VP9, etc.) and resolutions (360p, 720p, 1080p, 4K) to ensure compatibility and good viewing experiences across devices and network speeds. This is computationally expensive.
- Player Development: Building a robust, adaptive player that works everywhere is a non-trivial engineering task.
- CDN: You need a Content Delivery Network to cache your video files closer to your users globally, reducing latency.
Cloudflare Stream handles all of this. You upload one master file, and Cloudflare takes care of the rest. They use their massive global network to deliver the video, automatically adapt to viewer conditions, and manage the transcoding process.
The allowed_origins field is a critical security and control mechanism. If you don’t specify any origins, anyone can embed your video anywhere, which is rarely what you want. By listing your website domains, you ensure that only your content is displayed on your approved pages, preventing hotlinking and unauthorized use. If you do want to allow embedding on any domain, you can leave allowed_origins empty or set it to ["*"] (though this is generally not recommended for public-facing videos).
The require_signed_urls flag is another layer of control. When set to true, every request to play the video must include a short-lived, cryptographically signed URL. This is essential if you need to protect your content from being easily downloaded or shared outside of authorized sessions, for example, for paid content or private training materials. This involves generating a token on your backend server before serving the embed link.
When you enable require_boost_ வித (this is a typo in the example, it should be require_boost), Cloudflare Stream prioritizes delivering your video streams over its network, ensuring a smoother playback experience, especially during periods of high network congestion. This is particularly useful for live streams or critical on-demand content where minimizing buffering is paramount. It ensures your video gets preferential treatment on Cloudflare’s network.
The next thing you’ll likely explore is integrating Cloudflare Stream with Cloudflare Workers for dynamic URL signing or implementing custom player UIs using the Stream API.