7

Facebook ページの iframe タブを作成しようとしています。

このページでは、別のドメイン/サイトからのフォームで構成される iframe を読み込んでいます。

javascript を使用してグラフ API にクエリを実行し、JavaScript を使用してユーザーのデータをこの iframe が読み込まれたフォームに読み込むことは可能ですか?

クロス ドメイン セキュリティの問題があることを認識しています。その場合、私の iframe タブが iframe で読み込まれたフォームと同じドメインでホストされているとします。これは今すぐ実行できますか?

4

3 に答える 3

6

その通りです。セキュリティ上の理由 (同一オリジン ポリシー) により、必要なものはブラウザによってブロックされます。

できること:

  1. iframe でフォームをリロードし、js SDK から取得したデータを渡します。データを iframe に POST することもできます (Facebook がキャンバス アプリで行うように)。

  2. iframe の場所を変更できるはずですが、ハッシュ部分 (フラグメント) のみを変更すると、iframe がリロードされません。
    iframe では、場所の変更に注意し、フラグメントからデータを抽出します。
    問題は、この方法ではおそらくブラウザの履歴が台無しになることです。

  3. クロスドメイン通信の別のソリューション、おそらくeasyXDMを見つけてください。

編集

最初のオプションの 2 つの実装を次に示します。

1) GET を使用する

<iframe id="userform"></iframe>

<script type="text/javascript">
    // load and init FB JS SDK

    FB.api("me", function(response) {
        document.getElementById("userform").src = USER_FORM_URL + "?name=" + response.name;
    });
</script>

2) POST を iframe に使用する

<form method="POST" action="USER_FORM_URL" target="userform" id="postForm">
    <input type="hidden" name="fbResponse" id="fbResponseInput" />
</form>

<iframe name="userform"></iframe>

次に、iframe 自体で (GET または POST から) データを取得し、それに応じてユーザー フォームをレンダリングします。

<script type="text/javascript">
    // load and init FB JS SDK

    FB.api("me", function(response) {
        document.getElementById("fbResponseInput").value = JSON.stringify(response);
        document.getElementById("postForm").submit();
    });
</script>
于 2012-05-29T07:38:04.340 に答える
2 
var ifrm = document.getElementById('myIframe');
ifrm = (ifrm.contentWindow) ? ifrm.contentWindow : (ifrm.contentDocument.document) ? ifrm.contentDocument.document : ifrm.contentDocument;

これで iframe ができました。

ifrm.getElementById('textBoxId').value = 'value-fetched-from-facebook';

FBからデータを取得する

FB.api('me?fields=firstName&lastName', function(res)
{
//response contains your user info.
});
于 2012-05-23T03:32:19.943 に答える
1

タブ ページで GraphAPI を呼び出す必要があります。

ユーザーのデータが JavaScript スレッドに返されたら、次の 2 つのオプションがあります。

1) クエリ文字列を使用して、いつでも IFRAME にデータを渡すことができます。クエリ文字列のデータを含む適切な URL を使用して iframe を生成するのは、この瞬間だけです。

2) 内部 IFRAME ページにある JavaScript 関数を呼び出すことができます。この関数は、Facebook グラフ API 応答からオブジェクトを受け取り、ページに直接入力します。

この記事をチェックしてください。

親ページから iframe 内の JavaScript コードを呼び出す

于 2012-05-30T22:37:47.613 に答える