Unsafe JavaScript attempt to access a frame when using secure browsing on Facebook

Question

I\'ve launched an application last week and have noticed since that in Chrome only the height of my canvas is not always adjusted. I\'ve spent a bunch of hours looking at the is

Answer 1

Entirely possible.

Your error message states:

Domains, protocols and ports must match

You are accessing a frame with a script included from

https://apps.facebook.com/tabletr/

from frame with URL

http://static.ak.facebook.com/connect/canvas_proxy.php? ...

So that sure looks like an http/https mismatch. I don't think that extends to subdomains, but that could be problematic.

But is this your code, or the framework's? Basically you need to make sure the two protocols match up in either secure or regular browsing scenarios.

Answer 2

 //js.src = "//connect.facebook.net/en_US/all.js";
 js.src = "//tabletr.herokuapp.com/js/all.js";

It looks like you copied http://connect.facebook.net/en_US/all.js to your local server as https://tabletr.herokuapp.com/js/all.js.

A diff of http://connect.facebook.net/en_US/all.js and https://connect.facebook.net/en_US/all.js shows a few URLs with "http" and "https" hardcoded in them respectively. If you want to duplicate those locally, you're going to have to host two separate versions like Facebook does.

But I'd suggest just pointing to the official Facebook script, so you don't have to synchronise it up all the time.

Answer 3

Facebook has acknowledged this as a bug and assigned to an engineer. You can track the progress at https://developers.facebook.com/bugs/192507854181725?browse=search_4f2bbd593f8798794293016

Answer 4

This can also happen when you configure your fb app wrongly, check next three steps

1- make sure that redirect_uriof your facebook app isnt missing

Go to your App >> Settings >> Advanced >> Security. then set the redirect_uri

2- Make sure that login Client OAuth Login and Embedded browser OAuth Login is allowed for your app

Go to your App >> Settings >> Advanced >> Security. then select "yes" for both Client OAuth Login and Embedded browser OAuth Login

3- Don't forget also to configure your app to accept logins from your site

Go to your App >> Settings >> Add platfrom >> Website. then set Site URL with your domain.