跨源属性中断视频播放答案

【问题标题】：Cross origin attribute breaks video playback跨源属性中断视频播放
【发布时间】：2016-05-26 02:55:14
【问题描述】：

我有一个适用于本地视频 blob 但不适用于外部 URL 的 React sn-p。如果我取消 crossOrigin 属性，视频将为两者播放，但我需要用于画布数据导出的属性。跨域会停止播放的任何原因？

<video
    autoPlay
    controls
    crossOrigin="anonymous"
    onPause={props.onPause}
    onPlay={props.onPlay}
    width='320'>
    <source src={props.src} />
</video>

【问题讨论】：

标签： html reactjs

【解决方案1】：

来自the spec：

当用户代理需要使用“无 CORS”、“匿名”或“使用凭据”的模式模式执行可能启用 CORS 的绝对 URL URL 提取时，可选择使用引用来源来源引用来源源，具有原始来源，并且具有默认的原始行为默认值，即“污点”或“失败”，它必须运行以下列表中的第一个适用的步骤集。仅当模式为“No CORS”时才使用默认的原始行为。该算法封装了上面的fetch算法，将获取的资源标记为CORS-same-origin或CORS-cross-origin，或者完全阻塞资源。

您说的是“使用跨域权限获取此内容”，您请求它的服务器没有授予这些权限，因此浏览器完全阻止了对它的访问。

【讨论】：

是的，这是 CDN 提供商的标头问题。谢谢。