使用videojs进行实时流式传输的CORS和请求标头错误[重复]

Posted 2023-02-27

【中文标题】使用videojs进行实时流式传输的CORS和请求标头错误[重复]

【英文标题】：CORS and Request Headers errors on live streaming using videojs [duplicate]

【发布时间】：2019-02-24 00:30:14

【问题描述】：

我正在尝试使用 videojs@7.0.0 和 videojs/http-streaming 播放带有 html5 的实时流视频，但我无法使其正常工作，因为我遇到了请求标头和 CORS 错误。 我使用的是 HLS 协议，文件是 m3u8 格式。

打印 - 标题

打印 - 控制台错误

这是来自测试的代码：

videojs.Hls.xhr.beforeRequest = function(options) 
    options.headers = 
        "Content-Type": "application/x-mpegURL",
        "Access-Control-Allow-Origin": "*"
    
    return options;
;
player.ready(function() 
    this.src(
        src: 'http://my-url/playlist.m3u8',
        type: 'application/x-mpegURL',
    );
    player.play();
);

当我尝试按需播放视频时，它可以正常工作，但对于实时流媒体，它在任何浏览器中都不起作用。 我认为这可能是服务器端设置的标头出现的一些错误，但我已经使用 Angular 和 Videogular 做了另一个项目，并且无需其他设置即可使其工作，所以我认为我可能在设置请求标头时犯了一些错误在客户端什么的。

【问题讨论】：

我遇到了同样的问题，您是否找到任何解决方法或真正的原因。

【参考方案1】：

Access-Control-Allow-Origin 不是客户端发送的请求头。您需要配置提供 HLS 的服务器以在其响应中发送标头。

https://enable-cors.org/