Facebook是否有可能获取用户的数据并在iframe中填充表单？

Question

我正在尝试为Facebook页面创建iframe选项卡.

在这个页面上,我正在加载一个iframe,它包含来自另一个域/站点的表单.

是否可以使用javascript查询图形api,使用javascript将用户的数据加载到这个iframe加载的表单中,这样会出现预先填充给用户？

我知道存在跨域安全问题.在这种情况下,假设我的iframe选项卡现在托管在与iframe加载的表单相同的域中,这现在可行吗？

Answer 1

你是对的,由于安全原因(相同的原始政策),浏览器会阻止你想要的东西.

你可以做什么:

1. 在iframe中重新加载表单并将其从js sdk传递给您,您甚至可以将数据发布到iframe中(就像facebook使用canvas应用程序一样).

2. 您应该能够更改iframe的位置,但只能更改哈希部分(片段),这不会导致iframe重新加载.
   在iframe中,请注意位置更改并从片段中提取数据.
   问题是这种方法可能会搞乱浏览器历史记录.

3. 找到另一个跨域通信解决方案,也许是easyXDM？

编辑

以下是第一个选项的两个实现:

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>