Cross-Origin Request Blocked HLS URL

Question

we are using seaweedFS to save our images and mp4 video file. Now, we are planning to save HLS files on seaweedFS. Everything is perfect, HLS files are now saving on seaweedFS but when we try to use HLS URL in HTML5 video player it gives following warnings:

Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at http://{seaweedFS-URL}/gpocam/timelapses/testt-ymgqr/index.m3u8. (Reason: CORS header 'Access-Control-Allow-Origin' missing).

When I used the same URL in VLC then it works but not worked in the browser's player. Can anyone point the problem here?

Answer 1

I used NGINX in front of seaweedFS to add additional headers. Using this way I solved my problem.

Here is NGINX config:

upstream media_evercam {
            server 127.0.0.1:8888;
    }

    more_set_headers 'Access-Control-Allow-Origin: *';
    more_set_headers "Content-Type: $upstream_http_content_type";

    include /etc/nginx/mime.types;
    default_type application/octet-stream;

    server {
            listen 80;
            server_name localhost;

            location / {
                    proxy_pass http://media_evercam;
                    proxy_connect_timeout 60s;
            }
    }