Question

当包含页面和内容页面不是来自同一个域时，调整IFRAME的高度以匹配其内容页面的高度can be a real drag。

跨域资源共享（CORS）标头是否允许内容页面授权跨域访问其资源，从而允许其包含页面读取其高度？（或者，包含页面授权内容页面宣布其高度？）

或者CORS严格来说是一个AJAX的东西吗？

Answer 1

CORS不允许您这样做，但您可以使用跨文档消息传递在iframe及其父窗口之间发送字符串，甚至在不同的域上，并使用它来进行通信。

尽管Internet Explorer's way与the others'不同，但大多数浏览器都支持此功能。

假设您想让iframe向父页面宣布其所需的高度，您可以将其放入iframe代码中（未经测试）：

var message = {
    width: desiredWidth,
    height: desiredHeight
};
window.parent.postMessage(JSON.stringify(message),'*');

这在您的收录页面中：

function onMessage (event) {
    if (event.source != theIFrameElement.contentWindow) return;
    var message = JSON.parse(event.data);
    var desiredHeight = message.height;
    var desiredWidth = message.width;   
}

if (window.attachEvent)
    window.attachEvent('onmessage', onMessage);
else if (window.addEventListener)
    window.addEventListener('message', onMessage, false);

attachEvent用于IE，addEventListener用于其他所有人。出于安全考虑，您可能需要检查目标原点，但这是一般的想法。

编辑：Browser support for Cross-document messaging（-fsb）

跨域资源共享标头可以授权X域IFRAME访问吗？

1 个答案: