The most common error when playing M3U8 streams online is a CORS (Cross-Origin Resource Sharing) error. This happens when the video server does not include the required HTTP headers to allow cross-origin access.
How to identify: Open browser DevTools (F12) → Console. Look for messages like:
Access to XMLHttpRequest has been blocked by CORS policy
Nginx
location /hls/ {
add_header 'Access-Control-Allow-Origin' '*';
add_header 'Access-Control-Allow-Methods' 'GET, OPTIONS';
}
Apache (.htaccess)
Header set Access-Control-Allow-Origin "*"
Header set Access-Control-Allow-Methods "GET, OPTIONS"
CDN (Cloudflare/AWS)
Enable CORS in your CDN settings panel. Most CDNs have a dedicated CORS configuration section. Set allowed origins to * or your player domain.
Node.js/Express
app.use((req, res, next) => {
res.header('Access-Control-Allow-Origin', '*');
next();
});