HTML5 Canvas - origin-clean 标志如何设置为 false?

标签 html video canvas cross-domain

我开始使用 HTML5 Canvas 和视频,但一直遇到这个问题:我尝试演示和实验,但除非将它们上传到我的网络服务器,否则我无法查看它们。目前这不会造成大问题,因为我正在处理相对较小的文件,但实际上我正在准备一个更大的项目,这个问题很快就会变得非常不便。而且我只想弄清楚我的事实。我一直在使用我自己创建的视频和来自演示的视频。我处理过我很久以前编码的视频,我处理过我在代码中使用它们之前一分钟编码的视频。结果始终相同,使用 HTML5 视频容器有效,但在 Canvas 中使用视频无效,Canvas 只是不显示任何视频(除非像我提到的那样,我将它们上传到服务器)。

这是我目前找到的信息:

http://html5doctor.com/video-canvas-magic/

http://www.whatwg.org/specs/web-apps/current-work/multipage/the-canvas-element.html#security-with-canvas-elements

(还有一些关于 w3 的信息,但我不允许发布超过两个链接)

据我所知,我的 Canvas 一定是被污染了,而且我的文件似乎不是“原始干净”的,但这就是我所能弄清楚的。我不明白为什么。

有没有人对此有更多了解并且可以解释这是如何以及为什么起作用的?

最佳答案

浏览器严格区分从 http:// 加载的内容和从 file:// URI 加载的内容。这实际上是非常明智的,否则您从网络加载的随机页面将能够从您的硬盘驱动器读取文件。 apply to file:// URIs themselves 还有几个额外的限制,同样,这些旨在防止您从网络上下载的文件在您的硬盘上自由运行。

话虽如此,如果您的 HTML 文件和视频都位于硬盘驱动器上的同一目录中,那么一切都应该仍然有效,因为所有这些条件都应该得到满足。

如果您仍然遇到问题,本地开发的一种有用方法是使用轻量级 Web 服务器。我个人使用 Python's SimpleHTTPServer因为它已经安装在我的机器上,但还有很多其他的 - 通常是内置的 Web 开发框架(例如 Ruby on Rails)。

关于HTML5 Canvas - origin-clean 标志如何设置为 false?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/4989347/

相关文章:

javascript - 如何使用 $window 从模板脚本访问 AngularJS 作用域变量

android - 将视频从资源加载到 HTML5 webview - Android

Android - 在 html 代码中播放 html5 <video>

javascript - Box2dweb - 碰撞接触点

javascript - 弹球破砖游戏,砖 block 弹不起来

jquery - 如何在 Materialize CSS 中将图标 float 到右侧?

javascript - 如何在单击按钮上向此 JavaScript 或 HTML 添加 CSS?

html - 如何使元素水平和垂直居中

Swift ImagePicker 开始视频捕获

JavaScript 游戏框架