Unsafe JavaScript attempt to access frame…Protocols must match

Question

Here's my situation: I have a Javascript plugin that when clicked launches a popup on the third-party sites that host it. That popop then displays an IFRAME, in which I am using Facebook as a login method.

When the popup is launched, it recently started giving an error:

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.

The IFRAME itself is on https and used to work properly. I'm not sure why Chrome is trying to access the parent page. I have no control over the parent pages, so I can't make them https.

Here is my FB init code from within the IFRAME:

    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);
    }());

Any ideas how I can fix the error?

“The IFRAME itself it on https ” – the error message seems to suggest otherwise. — CBroe
@CBroe Sorry if I wasn't more clear: the error message for some reason refers to the parent page (third-party-site-goes-here), not the IFRAME itself. The iframe is controlled by me and is on https. — Wemmick
Regarding the dupes: Unsafe JavaScript attempt to access frame with URL: Doesn't look related to me. All their pages are on same domain, and Facebook not involved,. Unsafe JavaScript attempt to access frame with URL…” error being continuously generated in Chrome webkit inspector: Also not really the same: my error is not continuous, and it DOES prevent normal operation of the Facebook JS SDK. — Wemmick

Ram G Athreya Ram G Athreya · Accepted Answer · 2013-02-13T06:05:06

You can't use facebook login inside an iframe it will never work. Dont even bother trying I have spent several frustrating hours trying to do the same. Even if you solve the https problem you have right now, you will then face an X-Frame Options error because of an option set in the response header by facebook which accepts only requests from same origin(that is facebook).

What I'am basically trying to say is that facebook cannot be launched in an Iframe for security reasons. Your best bet in your current predicament is to open another popup with facebook login in it. Iframe simply wouldn't work. I know it wouldn't look elegant but it is the only way to go or you redirect your popup itself to facebook and have a callback mechanism to redirect back to your plugin.

Hope it helps.

Unsafe JavaScript attempt to access frame…Protocols must match

1 Answers