Loading Facebook profile picture securely

Question

I'm trying to include users profile picture from facebook, which works fine, but the thing is when you want to include it on a SSL-secured page. I can't find a way to get the picture to load from a secure location. Using the following link to the users profile pic:

https://graph.facebook.com/<FB_ID HERE>/picture?type=square

Even though I use https it doesn't get loaded securely (browser says the page is just partially encrypted). And this isn't strange since the link just redirects to the images, for example for my profile picture:

https://graph.facebook.com/Bazze/picture?type=square

This will get the picture from:

http://profile.ak.fbcdn.net/hprofile-ak-snc4/161513_633115680_6792455_q.jpg

Note that that is not a secure location.

Anyone know how to load the profile picture securely through the https protocol?

Thanks!

Cembalo

Answer 1

1. It IS a secure location, it's just not a secure redirect
2. All you can do is making sure you are using secure request when calling the graph api, after that Facebook will take over the communication and nothing can be done.

Granivorous

Answer 2

Add return_ssl_resources=1 to your Graph call:

https://graph.facebook.com/<FB_ID>/picture?type=square&return_ssl_resources=1

This is the proper way to get a SSL-served image; the redirect will be to a https server with a proper SSL certificate.

---

Update: It appears Facebook will now automatically give you a redirect to https-hosted images when you use https://graph.facebook.com, so the return_ssl_resources parameter is no longer necessary.

Using http://graph.facebook.com still gets you a http-hosted image.

Biting

I'm piggybacking on this answer for other people that might end up here. Currently, just changing the link to the image from http to https will work. A simple image_url.sub(/http:/, "https:") will do. – Chandlery

@Ashitaka: It looks like Facebook has recently changed the graph server to automatically handle http/https. I've updated the answer. – Biting

Answer 3

Well, https://graph.facebook.com/Bazze/picture?type=square is a 302 redirect to http://.... But note that https://... still works (example).

So it looks like one solution is to parse the 302 yourself, insert the 's' in the appropriate place, then fetch the image. But on the downside, the linked page above has certificate errors, and there isn't a good way to fix that.

(I'm not saying this is a good answer...)

Forspent

But if I include an image with graph... (secure) the browser still claims the page is only partially encrypted (yes, I'm sure it is the fb profile picture link that's causing it). – Cembalo

I'm saying you have to include an image with profile.ak.fbcdn.net... which also requires determining the correct '...', by parsing the 302 redirect. But while that will eliminate the 'partially encrypted' issue, it will introduce a certificate error issue. – Forspent

Answer 4

The 302 redirect will have your picture URL as stated in the Open Graph API documentation.

The you need to change from: / http profile.ak.fbcdn.net / to: / https fbcdn-profile-a.akamaihd.net /

And from: / http static.ak.fbcdn.net / to: / https s-static.ak.fbcdn.net /

I really think that FB should do that in their API's !!!!

Academicism

Answer 5

You could proxy it through your own server. Set up a script that fetches the image from Facebook then servers it back to you over SSL.

For Example

<?php
    $path=$_GET['path'];
    if (stristr($path, "fbcdn.")==FALSE && stristr($path, "facebook.")==FALSE)
    {
        echo "ERROR";
        exit;
    }
    header("Content-Description: Facebook Proxied File");
    header("Content-Type: image");
    header("Content-Disposition: attachment; filename=".$path);
    @readfile($path);
?>

Taken from

http://www.permadi.com/blog/2010/12/loading-facebook-profile-picture-into-flash-swf-using-open-graph-api/

Accessed via https://yourdomainhere.com/proxy.php?path=URLENCODED-IMG-URI should return the userpic via SSL.

Hansel

This could've been a solution, but Facebook have fixed this "bug" so the images is now served securely - so my issue is solved. Thanks for the answer though. – Cembalo

Answer 6

You can also get secure profile pics in bulk in which case you have to add the return_ssl_resources=1 param as @josh3736 mentioned.

https://graph.facebook.com/?ids=id1,id2,id3,...&fields=picture&return_ssl_resources=1

Grainfield

Answer 7

Use ***http***://graph.facebook.com/Bazze/picture?type=square instead of **https**://graph.facebook.com/Bazze/picture?type=square

Overbold