SecurityError from Facebook and Cross Domain Messaging

Question

We have an application that utilizes the facebook javascript sdk and login capabilities.

We've been noticing this error come up in our production logs. Specifically for iOS devices with versions 10.3 and higher. Also seems to only be targeting safari browsers

SecurityError (DOM Exception 18): Blocked a frame with origin "https://www.mymadeupsite.com" from accessing a frame with origin "https://staticxx.facebook.com". The frame being accessed set "document.domain" to "facebook.com", but the frame requesting access did not. Both must set "document.domain" to the same value to allow access.

Here is our init function:

        init: function(options) {
            var facebookUrl, scriptInclude;
            Facebook.baseHost = options.baseHost;
            if (typeof FB !== "undefined" && FB !== null) {
                return Facebook.setup();
            } else {
                if (options.appId == null) {
                    throw 'Facebook: cannot init without appId';
                }
                window.fbAsyncInit = function() {
                    FB.init({
                        appId: options.appId,
                        version    : 'v2.3',
                        channelUrl: options.channelUrl || ("" + document.location.protocol + "//" + document.location.host + "/channel.html"),
                        status: true,
                        cookie: false,
                        xfbml: false,
                        oauth: true
                    });
                    return Facebook.setup();
                };
                $('body').append('<div id="fb-root"></div>');
                facebookUrl = "//connect.facebook.net/" + (Facebook.getLocaleFacebookSupports(Social.SETTINGS.fbLocale)) + "/sdk.js";
                scriptInclude = "<script type=\"text/javascript\" async=\"true\" src=\"" + facebookUrl + "\"></script>";
                return $('#fb-root').append(scriptInclude);
            }
        }

My question, why are we only getting this error on iOS devices and versions 10.3?

Answer 1

I ran into this issue as well, and after digging around it seems to be a bug in the browser's autofill: the stacktrace that is send to our logging cluster looks as followed:

g@https://example.com:5:190, 
g@https://example.com:7:323, 
extractNewForms@https://example.com:13:37, 
extractForms@https://example.com:8:381, 
global code@https://example.com:1:98

As you can see, the error happens somewhere in an extractForms function, which (for us) doesn't exist anywhere in the code base. A Google search reveals that both extractForms and extractNewForms are part of the browser's autofill library, and the thread here suggests that there is a bug in there (comments 12 & 15 are most relevant to your issue).

As far as I can tell this is also not specifically related to Facebook: in our logs we see similar errors for more iframes, including iframes from (sub)domains we control ourselves.

Unfortunately I don't know about any fix or workaround, and I also highly doubt if a (user-land) fix/workaround is actually possible. I think the only thing you can do is to ignore these errors.