web-dev-qa-db-ja.com

このページがクロスドメインiframe内にあるかどうかを検出するための確実な方法

「 iframeがクロスドメインかどうかを確認するための確実な方法 "に対する回答は、ページ上のiframeが同じドメインまたはクロスドメインページを指しているかどうかをテストする方法を説明しています、異なるブラウザのクロスドメインポリシーの解釈に対処し、ユーザーを妨害したりJavaScriptを停止したりするエラーメッセージを回避します。

これと同等ですが、 from iframe内の子ページ inside クロスドメインiframeかどうかをテストしていますか否か。

親に関する（同じドメイン）情報にアクセスparentグローバルを使用して可能です。 _parent.document.location_、しかし、親がクロスドメインであることを検出したときに、エラーにクラッシュすることなくこのクロスブラウザを実行する信頼できる方法はありますか？

便利なテストのために、ここに jsbin が jsfiddleの中にあります。これは、_parent.location.Host_がアクセス可能かどうかをテストしようとすると、エラーにクラッシュします。エラーの代わりに、これがクロスドメインの親であることをfalseに通知するような信頼できる方法はありますか？

堅牢なクロスブラウザとなる_try...catch_バリアントはありますか？または、parent.postMessage()からの戻り値を使用した巧妙なトリックかもしれません。 （ただし、親ページは編集できません）

使用例：独自のサイトのページに埋め込まれる埋め込みコンテンツや、サードパーティによって埋め込まれるコンテンツを想像してください。ページが同じドメインのiframeにある場合、ユーザーは既にここにいるため、ブランドと非表示のリンクを元のサイトに戻します。ユーザーがサードパーティのiframeからページにアクセスしたり、ページを直接読み込んだりすると、ブランディングとクレジットが表示され、コンテンツのソースを確認できます。

明確にするために、私は同じドメインのポリシーについて知っていて、何クロスブラウザドメインが気にしない、私は単純ですが信頼できるifif( crossDomainParent() ){ /* do something */}のような条件

javascripthtmliframecross-browser
24
user56reinstatemonica8

最初にIFramedかどうかを確認します。

window.self !== window.top

IFramedの場合、参照元は親フレームのURLです。

document.referrer

このURLから、コードを分岐するかどうかを検出できるはずです。

43
palanik

後世のための実際のクロスブラウザソリューション：

function isCrossOriginFrame() {
  try {
    return (!window.top.location.hostname);
  } catch (e) {
    return true;
  }
}

console.log(isCrossOriginFrame());

デスクトップブラウザーとモバイルブラウザーの適切な範囲でテストされています。

https://jsfiddle.net/arzd4btc/3/

9
Jeff Mixon

x-frameヘッダーを使用します。これにより、サイトをframe/iframeにロードできなくなります。さまざまなオプションがあります ここをお読みください

2
Pushker Yadav

私はリファラーを使用してクロスドメインを決定しようとしましたが、多くのサイトでは信頼できないことがわかりました。多分誰かがこれが便利だと思うでしょう。

function IsCrossDomainFrame() {
    if( parent === window ) return false; //not a frame
    var parentLocation = new URL(document.referer);//the referer of an iframe is the parent
    return (parentLocation.protocol !== location.protocol ||
            parentLocation.hostname !== location.hostname ||
            parentLocation.port     !== location.port);
}

プロトコル、ホスト名、およびポートは、クロスドメインを決定します。

1
N-ate

これを試してください（iframe内）

<script type="text/javascript">
  var detectOrigin = (window.location.ancestorOrigins === undefined ? 
  /example.com/.test(document.domain) /* firefox */ : 
  /example.com/.test(window.location.ancestorOrigins[0])); /* webkit */
  if (detectOrigin === true) {console.log(detectOrigin)}; /* `true` example.com Origin */
  if (detectOrigin === false) {console.log(detectOrigin)}; /* `false` !example.com Origin */
</script>
1
guest271314

私があなたのユースケースを見た場合：

$_SERVER['REMOTE_ADDR']を使用して、サーバー側（サイトを呼び出した人）を確認します。IPの場合は、ブランディングを隠してバックをリンクできます。

ユースケースがサイトのフレーミングを防止しようとしている場合は、X-Frame-Options: denyを使用できます。

その他の推測：ドキュメント内の要素にはownerDocumentプロパティがあります。これは、必要なものを検出するのに役立つ場合があります。

1
user669677

現在の制限では、DOM APIを使用してこれを実現する方法はありません。別のドメインに属するウィンドウを使用した評価では、エラーが発生します。

ただし、「ハッキング」とは、XHRを子ウィンドウから送信して、ドメイン内の既知のページをロードすることです。このXHRが正常に完了すると、両方のウィンドウが同じドメインであることがわかります。

ただし、これによりコンソールにエラーメッセージが記録されます。

1
ncabral

ネストされたiframeの場合：iframe（このコードが実行される場所）がクロスドメインかどうかを再帰的に知る方法：

function crosDomIfrm(win, data) {
        data = (typeof data === 'undefined')?{ref:win.document.location,isCD:false}:data;
        try { 
            if( win.document.referrer != '' ){
                data.isCD = parseURL(data.ref) != parseURL(win.document.referrer);
            }
        } catch(e){}
        if ( (win.self !== win.parent) && !data.isCD ) { //I'm in iframe
            data = crosDomIfrm( win.parent, data );
        }
        return {ref:data.ref,isCD:data.isCD};
    },

function parseURL(url) {
                var a=document.createElement('a');
                a.href=url;
                return a.hostname;
            }
0
Grégoire Lafortune