Chrome 中的 HTML5 视频，安全错误：DOM 异常 18答案

【问题标题】：HTML5 Video in Chome, SECURITY_ERR: DOM Exception 18Chrome 中的 HTML5 视频，安全错误：DOM 异常 18
【发布时间】：2013-01-19 19:29:55
【问题描述】：

我正在尝试让我的网页显示来自我的视频服务器的视频。视频服务器与我的网络服务器在同一主机上运行，但在不同的端口上。

当我使用canvas.toDataURL() 从画布上播放的视频中刮取像素时，我在浏览器上得到一个“Uncaught Error: SECURITY_ERR: DOM Exception 18”。我使用的是 Chrome，版本 24。

这是随视频页面发送的 HTTP 标头

HTTP/1.1 200 OK
Access-Control-Allow-Origin: *
Content-Type: video/x-mp4
Transfer-Encoding: chunked
Date: Mon, 04 Feb 2013 23:28:00 GMT
Server: OizysLight

我错过了什么？ “Access-Control-Allow-Origin: *”不应该允许跨域资源共享吗？

【问题讨论】：

我正在尝试在用户点击按钮时捕获帧。我正在使用 canvas.toDataURL() 从画布上播放的视频中删除像素。
我用这些新信息编辑了您的问题，因为它可能会帮助将来遇到同样问题的人。如果您想更改我的编辑的任何内容，请随时这样做。

标签： javascript google-chrome canvas cross-domain

【解决方案1】：

我找到了答案。我需要在我的视频上设置 crossOrigin 属性。

video.crossOrigin = "Anonymous";

【讨论】：

【解决方案2】：

您可能需要在<video> 元素上设置crossOrigin property。如果对视频资源的请求不需要 cookie 或 HTTP 身份验证，则可以将其设置为 anonymous，否则设置为 use-credentials。

Mozilla 在<canvas> 上有一篇关于cross-domain images 的文章，而且几乎所有文章都适用于视频。

【讨论】：