Facebook JavaScript SDK over HTTPS loading non-sec

2019-01-07 06:07发布

I have a Facebook application that uses the Facebook Connect.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 Chrome's 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?

8条回答
Explosion°爆炸
2楼-- · 2019-01-07 06:26

So this would give you the same protocol link:

FB._https = (window.location.protocol == "https:");
查看更多
爷的心禁止访问
3楼-- · 2019-01-07 06:28

I 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... My quick and dirty fix was to manually replace all the profile pictures' domain names. For example,

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 coming from exactly the same place. View the URL of your own profile picture and substitute for what I have at 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/4/picture?return_ssl_resources=1.

I found an additional parameter called return_ssl_resources, and when passed with true, it 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);

It worked like a charm, and I stopped getting the mixed security warnings. I hope this helps!

查看更多
Bombasti
4楼-- · 2019-01-07 06:28

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;

FB._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.

查看更多
迷人小祖宗
5楼-- · 2019-01-07 06:32

On a sidenote, if you have doc-type declarations on your HTML page like the folllowing, the reference to "http://www.w3.org" can also bring up the content warning error in Internet Explorer.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
查看更多
地球回转人心会变
6楼-- · 2019-01-07 06:33

This seems to be caused by this Facebook bug.

Also 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...

查看更多
ら.Afraid
7楼-- · 2019-01-07 06:38

TL;DR

set 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.

查看更多
登录 后发表回答