cors - 如何使用媒体播放器库启用 CORS 以在 Chromecast 上进行流式传输？

Question

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

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

关于如何在开发、生产、CDN、云托管等各种环境中启用 CORS 以在 Chromecast 上进行流式传输，这是一个反复出现的问题。如果 SO 社区都可以提供见解并分享您的经验，那就太好了关于这个话题。

Answer 1

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

要为涉及 list 、辅助 list 、分段和加密 key 的所有媒体内容设置 CORS，如果您有权访问您的服务器，您可以添加一个 .htaccess 文件，其中包含一个非常宽松的行，例如:

header 集 Access-Control-Allow-Origin "*"

或者您可以将此行添加到 block 内的 Apache 服务器配置文件中并重新启动您的 Apache 服务器。您可以验证相应的响应是否具有如下 header 字段:

Access-Control-Allow-Origin:·*(CR)(LF)

如果您使用 CDN，则必须使用它们并添加必要的 header 字段。

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

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

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 header 字段。

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

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