首页
学习
活动
专区
工具
TVP
发布
社区首页 >问答首页 >为webGL纹理分配HTML5视频标签时出现CORS/跨域安全异常

为webGL纹理分配HTML5视频标签时出现CORS/跨域安全异常
EN

Stack Overflow用户
提问于 2013-01-08 08:05:27
回答 3查看 4.1K关注 0票数 17

我想在WebGL中为一个纹理指定一个远程视频。由于视频源与文档源不同,我在视频源的http头中添加了Access-Control-Allow-Origin:*。此外,我使用video.crossOrigin = '';为视频标签分配了一个匿名来源。有趣的是,跨域属性适用于图像,但不适用于视频标记。一旦将WebGL纹理指定给视频对象,javascript就会抛出以下异常:

未捕获的错误: SECURITY_ERR: DOM异常18

这里有一个重现这个问题的jsfiddle。此示例基于three.js的webgl_kinect示例:http://jsfiddle.net/ZgeTU/2/

以下是相关部分:

代码语言:javascript
复制
// CROSS-ORIGIN VIDEO SOURCE 
// REMOTE VIDEO SOURCE PROVIDES "Access-Control-Allow-Origin:*" HEADER
video.src =
  'http://kammerl.de/threejs/three.js/examples/textures/kinect.webm';
// DEFINING ANONYMOUS ORIGIN
video.crossOrigin = '';
video.play();

稍后,视频标签被分配给Three.js纹理:

代码语言:javascript
复制
texture = new THREE.Texture( video );  

显然,在webGL中使用crossOrigin视频的这个问题已经存在一段时间了,但我还没有找到任何更新:http://jbuckley.ca/2012/02/cross-origin-video/

有没有人知道这个问题的现状?在webGL中访问远程视频有什么解决方法吗?任何帮助都是非常感谢的!

谢谢!

EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/14206244

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档