使用videojs在实时流上的CORS和请求标头错误

Question

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

Print - Headers

Print - Console Error

这是测试的代码：

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做了另一个项目，并且能够使它无需任何设置，所以我想我可能在设置请求标题时犯了一些错误在客户端或某事。

谢谢！

Answer 1

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

https://enable-cors.org/