2011-06-23 7 views
9

を含むとコンテンツページが同じドメインからでないときにそのコンテンツページの高さcan be a real dragに合わせて、IFRAMEの高さを調整します。 クロスドメインリソース共有ヘッダーは、XドメインのIFRAMEアクセスを許可できますか?

はクロスオリジンリソース共有(CORS)ヘッダは、コンテンツページはそのリソースへのクロスドメインアクセスを許可するので、それを含むページがその高さを読み取ることができるようにすることが可能になるのですか? (または、その代わりに、含むページがその高さを発表するコンテンツページを認可?)

それともCORSを厳密にAJAXの事でしょうか?

答えて

17

CORSは、あなたがそれを行うことはできませんが、あなたも、異なるドメイン上のiframeと親ウィンドウの間で文字列を送信するためにクロスドキュメントメッセージングを使用し、通信するためにそれを使用することができます。 Internet Explorer's waythe others」とは異なりますが

ほとんどのブラウザはこれをサポートしています。あなたの含まれているページで

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

そして、この:

何をしたいと仮定すると、

はIFRAMEを親ページへの所望の高さを発表することです、あなたのiframeコード(テストしていない)でこれを置くことができます

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は他の人のためのものです。セキュリティの目的でターゲットの起点を確認することもできますが、それは一般的な考えです。

EDITBrowser support for Cross-document messaging近代的なものでonmessage` `サポート(-fsb)

+0

ブラウザ? IE8、FF3など? –

+2

ここにはブラウザサポートテーブルがあります。私はもっ​​と多くの担当者がいなかったので、私の答えには2つのリンクしか追加できませんでした。 http://caniuse.com/x-doc-messaging – PaulG

+1

ブラウザサポートテーブルのリンクとその回答に感謝します。 CORSが役に立たないと思っていることを前提にして受け入れていますが、特に元の質問をはるかに上回る代替案で解決することができます。 onmessageは知る価値がある。 –

関連する問題