我有一个页面,其中有一个 iframe,它从 amazon aws s3 存储桶加载 html 模板。在iframe中,我想获取父窗口的链接,然后添加一些参数。
例如:我的父窗口有链接 http://xx.xx.x.xxx:8088 。我想获取此网址,添加“#abc/edf”并重定向到该页面。但我不能,因为我的 iFrame 有 url https://bucketName.s3.amazonaws.com
我得到的错误是
Uncaught SecurityError: Blocked a frame with origin "https://bucketName.s3.amazonaws.com" from accessing a frame with origin "http://xx.xx.x.xxx:8088". The frame requesting access has a protocol of "https", the frame being accessed has a protocol of "http". Protocols must match.
我用来从 iFrame 中重定向到另一个页面的 javascript
function navigateTo(e){
var destination = e.data.destination;
var url = window.parent.location.host;
window.parent.location.href = url+destination;
}
$("#button").click({destination: "/#abc/edf"}, navigateTo);
html
<div id="button"><a href="#">Redirect to another page</a></div>
由于某种原因,我无法使用绝对路径。父窗口链接将会以某种方式发生变化。我认为最好的解决方案是获取父网址并附加我想要的参数。我怎样才能在不出现安全错误的情况下实现这一点?
最佳答案
简短的回答是“你不能”。
浏览器安全模型阻止来自客户端的跨域和跨协议(protocol)脚本编写。 https 协议(protocol)下的嵌入式 iframe 不允许访问(甚至不能读取)其父级的非 https 上下文。
为了完成您想要的操作,两个上下文必须在源域和协议(protocol)上达成一致,以便在客户端进行交互。
关于JavaScript iframe : accessing http from https,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/25670573/