如何使用Media Player库在Chromecast上启用CORS进行流式传输?

时间:2014-03-05 19:55:15

标签: cors google-cast chromecast xmlhttprequest

Chromecast支持MPEG-DASH,Smooth Streaming和HLS以及媒体播放器库中的流式传输:https://developers.google.com/cast/docs/player为这类用例提供Javascript支持。

由于流式协议与大多数基于文件的协议不同,使用XMLHTTPRequest以异步方式访问内容,因此它们可以防止来自资源源自的服务器的CORS头的不当访问。

这是一个反复出现的问题,关于如何在各种环境(如开发,生产,CDN,云托管等)中启用ChromeS上的Chrome广播。如果SO社区可以全力投入提供见解,那就太棒了。分享您对此主题的体验。

2 个答案:

答案 0 :(得分:3)

要开始使用此主题,请记住,媒体播放器库创建的所有请求:https://developers.google.com/cast/docs/player都使用GET或POST方法。就CORS而言,大多数这些请求属于简单请求的类别(与所谓的预检请求相反)。有关详细信息,请查看以下链接:https://developer.mozilla.org/en-US/docs/HTTP/Access_control_CORS

要为涉及清单,辅助清单,细分和加密密钥的所有媒体内容设置CORS,如果您有权访问服务器,则可以添加.htaccess文件,其中包含非常宽松的行,如:

标题集设置Access-Control-Allow-Origin“*”

或者您可以将此行添加到块内的Apache服务器配置文件中,然后重新启动Apache服务器。您可以验证相应的响应是否具有如下所示的标题字段:

访问控制允许来源:·*(CR)(LF)

如果您使用CDN,则必须使用它们并添加必要的标题字段。

正确配置CORS后,您将不会再看到可怕的网络错误代码:cast.player.api.ErrorCode.NETWORK。

以下是提供CORS标头字段的流示例:

MPEG-DASH:
  - http://commondatastorage.googleapis.com/gtv-videos-bucket/dash/BigBuckBunny/bunny_10s/BigBuckBunny_10s_isoffmain_url_relative_DIS_23009_1_v_2_1c2_2011_08_30.mpd   - http://yt-dash-mse-test.commondatastorage.googleapis.com/media/car-20120827-manifest.mpd

平滑流式传输:   - http://playready.directtaps.net/smoothstreaming/SSWSS720H264/SuperSpeedway_720.ism/Manifest   - http://playready.directtaps.net/smoothstreaming/SSWSS720H264PR/SuperSpeedway_720.ism/Manifest

但是,例如,下面的HLS流不会在其响应中提供CORS Access-Control-Allow-Origin标头字段。

http://devimages.apple.com.edgekey.net/streaming/examples/bipbop_16x9/bipbop_16x9_variant.m3u8

您可以使用例如这个工具:http://web-sniffer.net/来嗅探标题。

答案 1 :(得分:2)

对于大多数CDN来说,此信息为http://enable-cors.org/,但看到所有CDN的信息会很棒。