Cloudflare Docs
Stream
Visit Stream on GitHub
Set theme to dark (⇧+D)

Vidstack

Example of video playback with Cloudflare Stream and Vidstack

Run and edit this code in your browser on Stackblitz.

<html>
<head>
<script
type="module"
src="https://cdn.jsdelivr.net/npm/@vidstack/[email protected]/cdn/bundle.js"
></script>
</head>
<body>
<vds-media>
<vds-hls
controls
poster="https://customer-m033z5x00ks6nunl.cloudflarestream.com/b236bde30eb07b9d01318940e5fc3eda/thumbnails/thumbnail.jpg"
>
<video
controls
src="https://customer-m033z5x00ks6nunl.cloudflarestream.com/b236bde30eb07b9d01318940e5fc3eda/manifest/video.m3u8"
preload="none"
></video>
</vds-hls>
</vds-media>
</body>
</html>

Refer to the Vidstack documentation for more information.