I have a Facebook application that uses the Facebook Connect.js https://connect.facebook.net/en_US/all.js
I am running my application over HTTPS. All content on the site is delivered from https:// with the exception of some content that must be included within Facebook's Connect.js
The problem is that I get warning messages saying that there are non-secure items within the page.
I've checked what scripts are being loaded using Chromes Developer Tools / Network tab to see what files are being loaded and from where.
The only one I can see that is being loaded over HTTP and not over HTTPS is a file called: http://static.ak.facebook.com/connect/canvas_proxy.php
How can I force this file to use HTTPS?
Many thanks,
P.
Source: Tips4all, CCNA FINAL EXAM
TL;DR
ReplyDeleteset FB._https to true before calling FB.init. Like so:
FB._https = true;
FB.init({
/* your app id and stuff */
});
Explanation
If you unminify the Facebook JavaScript SDK, you'll see that its basically an object literal with a bunch of properties. One of these properties is _https, which is a boolean. This property determines which set of URLs to use (stored in FB._domain) when making API requests. It seems as though Facebook keeps two sets of URLs for each type of API request -- a secure URL and and non-secure URL -- then uses a switch function called getDomain() to determine which to use when making requests.
The reason the JavaScript SDK causes security warnings is due to the way the FB._https property is defined. This is how it's currently defined as of 2011-8-24:
_https: (window.name.indexOf('_fb_https') > -1)
Apparently Facebook thinks that if the window.name property has _fb_https in it, then it must be a secure app. This is obviously incorrect. The real test should be something similar to this:
_https: window.location.protocol == "https:"
Unfortunately, the SDK is not open source or even well documented, so I can't submit a pull request for this change :P. In the short term, setting FB._https to true manually before calling FB.init should do the trick.
So this would give you the same protocol link:
ReplyDeleteFB._https = (window.location.protocol == "https:");
Came across this problem a few days ago; My entire application was using HTTPS and my issue was only profile pictures being loaded over HTTP...
ReplyDeleteMy quick and dirty fix was to manually replace all the profile pictures' domain names..
E.g. :
str_replace('http://profile.ak.fbcdn.net','https://fbcdn-profile-a.akamaihd.net',$user['pic_square']);
You'll have to check and see what url your profile pictures have - I'd assume they are not comming from exactly the same place - view the url of your own profile picture and substitute for what i have https://fbcdn-profile-a.akamaihd.net
After looking harder at the Facebook Documentation:
If you need a picture to be returned over a secure connection, you can set the return_ssl_resources argument to 1: https://graph.facebook.com/rozen.lior/picture?return_ssl_resources=1.
I found an additional parameter called
return_ssl_resources - and when passed with with true returns profile pictures using HTTPS.
$fql = "SELECT uid, name, pic_square FROM user WHERE uid=me()";
$param = array( 'method' => 'fql.query', 'query' => $fql, 'return_ssl_resources'=>1);
$fbuser = $facebook->api($param);
Worked like a charm and I stopped getting the mixed security warnings.
Hope this helps!
I wanted to post this as a comment as it is clearly not an answer but I am not allowed to (see this person's rant [http://goofygrin.wordpress.com/2011/02/01/why-stackoverflow-sucks-and-participating-there-is-impossible/]) so please do not penalize.
ReplyDeleteUPDATE:
It looks like this (at least my scenario) is a known issue and may have ironically been fixed last night after I posted my response: http://bugs.developers.facebook.net/show_bug.cgi?id=15200
I am having a very similar problem. However, in my scenario, this is only occurring when I try to load my app in a tab on my Facebook page.
Here you can view my canvas page with no SSL errors:
https://apps.facebook.com/shc-welcome-page/welcome.aspx
But if you go to the app's tab on my page, just a blank iFrame and a mixed SSL warning:
https://www.facebook.com/synergyhomecare?sk=app_149463898446716
Similar to the original post, the non-secure culprit seems to be: *http://static.ak.facebook.com/platform/page_proxy.php?v=2*
Adding to Ralph Holzmann and Simon Bächler, the following is an even harder-hitting fix for when FB._https alone does not do the trick;
ReplyDeleteFB._https = (window.location.protocol == "https:");
FB.init({
...
});
if (FB._https && window == window.parent) {
if (FB._domain && FB._domain.staticfb && FB._domain.https_staticfb)
FB._domain.staticfb = FB._domain.https_staticfb;
}
See also FB.Arbiter.inform() { ... FB.getDomain((d?'https_':'')+'staticfb',true) ... } where d=window!=window.parent&&... as of 2012-Feb-10.
I would notify Facebook of this issue. It is definitely an issue that they would need to resolve, perhaps by putting in a switch statement to check the protocol.
ReplyDeleteThis seems to be caused by this Facebook bug.
ReplyDeleteAlso see this forum post.
That bug was marked as resolved on 3/16, but I am still observing non-https requests to canvas_proxy.php. Hopefully this will be fixed for real soon...
on a side note, if u have doc-type declarations on your html page like,
ReplyDelete<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
... the reference to "http://www.w3.org" can also bring up the content warning error in IE