2

I have hosted a html5 video generated by Adobe captivate at Amazon S3. When I access using browser its working fine.

Working url : http://lmtestforhtmlfive.s3.amazonaws.com/html5version/test/Hello%20World/story_html5.html

But when I use the above working video in IFRAME at another html page, its not working.

Error : "Unsafe JavaScript attempt to access frame with URL http://temptesttobedelete.s3.amazonaws.com/html5test.html from frame with URL http://lmtestforhtmlfive.s3.amazonaws.com/html5version/test/Hello%20World/story_html5.html. Domains, protocols and ports must match."

Not working URL : http://temptesttobedelete.s3.amazonaws.com/html5test.html

After few research I got need to enable CORS on S3 bucket, added below CORS configuration on lmtestforhtmlfive bucket.

<CORSRule>
<AllowedOrigin>*</AllowedOrigin>
<AllowedMethod>GET</AllowedMethod>
<AllowedHeader>*</AllowedHeader>
<MaxAgeSeconds>3000</MaxAgeSeconds>
</CORSRule>

But still I am not able to access the html5 video in iframe.

Please suggest me how to access html5 videos in IFRAME.

Thanks, Laxmilal Menaria

4

1 回答 1

1

您的问题是storyline_compiled.js文件中的代码正在尝试访问它所加载的 IFRAME 的父页面的 DOM，尽管它是从不同的域加载的，特别是使用以下行：

if(self!=top){var meta=$('<meta name="viewport" id="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no"/>');top.document.getElementsByTagName("head")[0].appendChild(meta.get(0))}

更具体地说，有问题的 JS 调用是：

top.document.getElementsByTagName

这个问题是由于从不同域加载的 JS 试图修改它嵌入的页面，违反了大多数浏览器的 XSS 保护特性。

您有一个选择是从 JS 文件本身中删除该行代码，然后只需将它尝试创建的标记添加到嵌入 IFRAME 的页面的头部部分。即只需将以下内容添加到您的html5test.html文件中：

<meta name="viewport" id="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no"/>
于 2013-03-05T09:19:26.003 回答