javascript - 不安全的 JavaScript 尝试访问框架...协议(protocol)必须匹配

Question

这是我的情况:我有一个 Javascript 插件，单击该插件后会在托管它的第三方网站上启动一个弹出窗口。然后，该弹出窗口会显示一个 IFRAME，我在其中使用 Facebook 作为登录方法。

当弹出窗口启动时，它最近开始出现错误:

Unsafe JavaScript attempt to access frame with URL http://{THIRD-PARTY-SITE-GOES-HERE} from frame with URL https://s-static.ak.facebook.com/connect/xd_arbiter.php?version=18#channel=…%3Dtabmodule%26utm_term%3D200000%26fb_xd_fragment%23xd_sig%3Df2ade8e518%26.

The frame requesting access has a protocol of 'https', the frame being accessed has a protocol of 'http'. Protocols must match.

IFRAME 本身位于 https 上并且可以正常工作。我不知道为什么 Chrome 试图访问父页面。我无法控制父页面，因此无法将它们设置为 https。

这是我在 IFRAME 中的 FB 初始化代码:

    window.fbAsyncInit = function() 
    {
        FB.init({
            appId: '{myappid}', 
            status: true, 
            cookie: true, 
            xfbml: true, 
            oauth: true,
            channelURL : 'https://degree3.com/channel.php'
        });

        FB.getLoginStatus( function(response) 
        {   
            if (resp = response.authResponse) 
            {
                $( '#fb_button' ).attr( "onclick", "signinViaFacebook( response.authResponse.userID, response.authResponse.accessToken );" ).show();
            } 
        });
    };
    (function() 
    {
        var e = document.createElement('script'); e.async = true;
        e.src = document.location.protocol + '//connect.facebook.net/en_US/all.js';
        document.getElementById('fb-root').appendChild(e);
    }());

有什么想法可以解决这个错误吗？

Answer 1

您不能在 iframe 内使用 facebook 登录，它永远不会起作用。甚至不用费心去尝试，我已经花了几个令人沮丧的小时尝试做同样的事情。即使您解决了现在遇到的 https 问题，您也会遇到 X-Frame 选项错误，因为 facebook 在响应 header 中设置的选项仅接受来自同一来源(即 facebook)的请求。

我基本上想说的是，出于安全原因，Facebook 无法在 Iframe 中启动。在当前的困境中，最好的选择是打开另一个带有 Facebook 登录信息的弹出窗口。 iframe 根本无法工作。我知道它看起来不太优雅，但这是唯一的方法，或者您将弹出窗口本身重定向到 Facebook，并有一个回调机制来重定向回您的插件。

希望有帮助。