Get user profile picture by Id - facebook

I'm now working on a web application which is mostly based of facebook graph api.
I hold some data about users - actually , the possible public data available - such as name and id.
I also know that a profile picture is a part of the public data, and I wondered how I'll be able to get a direct link to a profile picture of a user only by using their id?

http://graph.facebook.com/" + facebookId + "/picture?type=square
For instance:
http://graph.facebook.com/67563683055/picture?type=square
There are also more sizes besides "square". See the docs.
Update September 2020
As Facebook have updated their docs this method is not working anymore without a token. You need to append some kind of access_token. You can find further information and how to do it correctly in the fb docs to the graph api of user picture
Requirements Change
This endpoint supports App-Scoped User IDs (ASID), User IDs (UID), and Page-Scoped User IDs (PSID). Currently you can query ASIDs and UIDs with no requirements. However, beginning October 24, 2020, an access token will be required for all UID-based queries. If you query a UID and thus must include a token:
use a User access token for Facebook Login authenticated requests
use a Page access token for page-scoped requests
use an App access token for server-side requests
use a Client access token for mobile or web client-side requests
Quote of fb docs

You can use following urls to obtain different sizes of profile images.
Please make sure to add Facebook id to url.
Large size photo
https://graph.facebook.com/{facebookId}/picture?type=large
Medium size photo
https://graph.facebook.com/{facebookId}/picture?type=normal
Small size photo
https://graph.facebook.com/{facebookId}/picture?type=small
Square photo
https://graph.facebook.com/{facebookId}/picture?type=square

To get largest size of the image
https://graph.facebook.com/{userID}?fields=picture.width(720).height(720)
or anything else you need as size. Based on experience, type=large is not the largest result you can obtain.

From the Graph API documentation.
/OBJECT_ID/picture returns a redirect to the object's picture (in this case the users)
/OBJECT_ID/?fields=picture returns the picture's URL
Examples:
<img src="https://graph.facebook.com/4/picture"/> uses a HTTP 301 redirect to Zuck's profile picture
https://graph.facebook.com/4?fields=picture returns the URL itself

This will be helpful link:
http://graph.facebook.com/893914824028397/picture?type=large&redirect=true&width=500&height=500
You can set height and width as you needed
893914824028397 is facebookid

UPDATE September 2020
Facebook has new requirements change: an access token will be required for all UID-based queries
So you have to add your app access token to the url:
https://graph.facebook.com/{profile_id}/picture?type=large&access_token={app_access_token}
To get your app_access_token use the following url:
https://graph.facebook.com/oauth/access_token?client_id={your-app-id}&client_secret={your-app-secret}&grant_type=client_credentials
You find your-app-id and your-app-secret in the Basic Settings of your Facebook app in Facebook developers

https://www.avatars.io/
It's an API that returns the profile image when given a username for a variety of social networks including Twitter, Facebook, Instagram, and gravatar. It has libraries for iOS, Android, Ruby, Node, PHP, Python, and JavaScript.

you can get it with using this url : you will get the picture HD (max size)
https://graph.facebook.com/{userID}?fields=picture.width(720).height(720)&redirect=false
don't forget redirect=false or it will return an error

Use url as:https://graph.facebook.com/user_id/picture?type=square in src of img tag.
type may be small,large.

You can use AngularJs for this, Its two -way data binding feature will get solution with minimum effort and less code.
<div>
<input type="text" name="" ng-model="fbid"><br/>
<img src="https://graph.facebook.com/{{fbid}}/picture?type=normal">
</div>
I hope this answers your query.Note: You can use other library as well.

Through the Javascript SDK (v2.12 - April, 2017) you can get the details of the picture request this way:
FB.api("/" + uid + "/picture?redirect=0", function (response) {
console.log(response);
// prints the following:
//data: {
// height: 50
// is_silhouette: false
// url: "https://lookaside.facebook.com/platform/profilepic/?asid=…&height=50&width=50&ext=…&hash…"
// width: 50
//}
if (response && !response.error) {
// change the src attribute of img elements
[...document.getElementsByClassName('fb-user-img')].forEach(
i => i.src = response.data.url
);
// OR redirect to the URL above
location.assign(response.data.url);
}
});
For getting the JSON response the parameter redirect with 0 (zero) as value is important since the request redirects to the image by default. You may still add other parameters in the same URL. Examples:
"/" + uid + "/picture?redirect=0&width=100&height=100": a 100x100 image will be returned;
"/" + uid + "/picture?redirect=0&type=large": a 200x200 image is returned. Other possible type values include: small, normal, album, and square.

As per the current latest Facebook API version 3.2, For users you can use this generic method for getting profile picture is https://graph.facebook.com/v3.2/{user-id}/picture?type=square you can visit documentation for user picture here.
The possible values for type parameter in URL can be small, normal, album, large, square
For Groups and Pages, the profile picture is not available directly. You have to get them using access token. For Groups you have to use User Access Token and for Pages you can use both User Access Token and Page Access Token.
You can get Group's or Page's Profile Picture using the generic URL: https://graph.facebook.com/v3.2/{user-id}/picture?access_token={access-token}&type=square
I hope this is helpful for people who are looking for Page or Group Profile picture.

Simply Follow as below URL
https://graph.facebook.com/facebook_user_id/picture?type=square
type may be normal,small,medium,large. Or square (f you want to get square picture, the square size is limited to 50x50).

today I found a problem, the profile images was returning the default profile picture because a new requirement from Facebook to all the UID based queries, so just add &access_token=[apptoken] to the url, you can obtain your app token from here

You can use the following endpoint to get the image.jfif instead of jpg:
https://graph.facebook.com/v3.2/{user-id}/picture
Note that you won't be able to see the image, only download it.

Update July 2021
On top of answer by #EddyG, turned out that if you still not able to fetch the profile picture with app access token, the FB account must "allow" the FB app first then you should be able to fetch the profile picture with FB app access token.

Related

Change in image urls from Facebook Graph API response [duplicate]

I use the url https://graph.facebook.com/{app_user_id}/picture?width=120&height=120 to show the user picture on my app, but since this morning, it has stopped working on mobile devices.
Now, the same url redirects to https://lookaside.facebook.com/platform/profilepic/?asid={app_user_id}&height=120&width=120. This url works on desktop web, but on mobile it redirects again to https://m.facebook.com/platform/profilepic/?asid={app_user_id}&height=120&width=120 and the mobile web refuses to output the image. If I try to load it in the address bar, it is downloaded instead of showed.
I have searched for any change on the Facebook graph api about this but didn't find anything. Any hint to solve this? Thanks.
This seems to be a bug. Started happening to my app earlier on this morning. Still no fix as of yet.
A few bug reports that have been submitted on Facebook for Developers:
Profile Pictures Can't Load
Graph API Profile picture doesn`t work on mobile
Cross site policy error while accessing graph pictures
I faced the same issue today and I'v found a solution for that and it worked for me.
After login we get below Profile pic URL
http://graph.facebook.com/11111111111/picture?type=large&height=320&width=420
11111111111 is your social id/facebook id
now we need to change this URL in order to display image,
here is the code.
try {
profile_pic = new URL("https://graph.facebook.com/" + id + "/picture?type=large");
Log.i("profile_pic", profile_pic + "");
Picasso.with(getContext()).
load(profile_pic.toString())
.placeholder(R.drawable.img)
.into(imageviewId);
}
catch (MalformedURLException e) {
e.printStackTrace();
}
id is your socialid/facebook id
in short we just need to remove &height=320&width=420 from url.
you can compare both the url:
http://graph.facebook.com/11111111111/picture?type=large&height=320&width=420
https://graph.facebook.com/11111111111/picture?type=large
and yes you need to change http to https as well
Though I didn't find any official announcements, Facebook during last few days changed their api's, now when you request user's public profile the picture url has extra parameters, ext and hash
Calling the url without these params returns 404 error.
Not sure if the change is affecting Page Scope ID's only.
Currently, when you request user's public profile data the url looks like this
https://lookaside.facebook.com/platform/profilepic/?psid=PAGE_SCOPED_ID&height=1024&ext=1522585606&hash=AeThc8c7EQDFgShs
before it was just
https://lookaside.facebook.com/platform/profilepic/?psid=PAGE_SCOPED_ID&height=1024
It seems to me the only known solution currently would be requesting new public profile data and updating your database.
Hope that helps.

Can you retrieve facebook photos in Unity?

Is there anyway to retrieve photos that are not the profile picture on Unity through the facebook api? or any other way?
1. Easiest
Use www class to fetch the image texture.
string link = https://graph.facebook.com/v2.1/" + friendID + "/picture?width=50&height=50&redirect=true;
WWW pic = new WWW (link);
yield return pic;
if (pic.error == null)
{
go.renderer.material.mainTexture = pic.texture;
}
where friendID is your facebook id. Here you can pass the id for any of your friends.
width and height to specify what dimension do you want the image to be.
2. A bit complex but useful in long run
link to pass to www class
string link = https://graph.facebook.com/v2.1/" + friendID + "/picture?width=50&height=50&redirect=false;
the difference in this method is that you are now not redirecting to the cdn permanent link.
this will give you a json file. Now you can parse the json file to get the actual link.
use this link again with www class to get the actual image
benefits of using this method.
You can save the image once and next time just ping for permanent link only.. if they match then don't fetch image again.
You're in luck. Facebook themselves have made a tutorial for Unity, which is a small game using Facebook's profile pictures. Here is a link to it.
Yes you can. Not sure what platform are you using.
You can use Facebook official SDK from here
https://developers.facebook.com/docs/unity
Authorise your platform, facebook will give you a token.
Then you can call graph API to get whatever you need.
For Example:
https://developers.facebook.com/tools/explorer/145634995501895/?method=GET&path=me%3Ffields%3Did%2Cname%2Cphotos&version=v2.2&

In terms of privacy, is it acceptable to extract the user id from a Facebook share response to make use of that user's details?

Using the Facebook API, you can get back the post ID of a Facebook share, even if the user has not authorized your app.
The post ID is prefixed by your user ID, and separated by an underscore.
FB.ui({
method: 'feed',
name: 'People Argue Just to Win',
link: 'http://www.nytimes.com/2011/...',
}, function( response ){
// Response gives you :
// { post_id: "[fbUserId]_346759642059572" }
});
To me it looks like Facebook is using this programmatically, rather than with the idea of providing us the userId out of the kindness of their hearts. But it's extremely tempting to use.
I'm a little rusty on permissions - if there is a way to get back all the users that have liked/shared a specific URL, and not just a count, then this should be okay.
But the question remains, is it acceptable to use?
EDIT:
Now that I think about it, you can access the user ID by making an anonymous call to https://graph.facebook.com/[postId] but ONLY if the post was made public.
If you get a response from FB, it means that you have already ask the user for the required permissions,
so yes you can use the data returned from Facebook as you like, but you always have to inform the users how you use those data.
You can only cache user data if you have permission or it is necessary for the function of your app. Using the like button you can subscribe to edge.create and cache the response from the like.
refer to: http://developers.facebook.com/docs/reference/javascript/FB.Event.subscribe/
II. Storing and Using Data You Receive From Us
You will only request the data you need to operate your application.
You may cache data you receive through use of the Facebook API in
order to improve your application’s user experience, but you should
try to keep the data up to date. This permission does not give you any
rights to such data.
in my app i store the id of every page or user that is viewed to speed up page load times and count page views. Seems with in the scope of Policy as long as i am not sharing the info with 3rd parties or making public what a user has set to non public.

Can we get a facebook access token by providing email and password in the code?

I would like to get the photo urls from the from this album:
https://graph.facebook.com/175758929145317/photos
If you access it without providing an access token, then you will get empty data:
{
"data": [
]
}
But if you first generate an access token here:
http://developers.facebook.com/tools/explorer?method=GET&path=175758929145317%2Fphotos
And then you append it to the url like this, you can get the data:
https://graph.facebook.com/175758929145317/photos?access_token=your_access_token
However, this access token cannot be used forever, it will expire.
I would like to dynamically take the photo urls from https://graph.facebook.com/175758929145317/photos and display the images on a webpage, the person who views this webpage does not need to have a facebook account.
So every time the webpage is viewed, I am thinking about if it's possible to simply use my facebook account to login (by hardcoding the email and password) and then obtain a new access token so that I can get the photo urls.
Is this possible? Or is there a better solution to my problem? (I cannot ask the album owner to change his album to public)
it's not possible, you cannot authenticate in FB using hardcoded (or stored) login/password - as per Facebook policy:
I. Features and Functionality
...
3 - You must not include functionality that proxies, requests or
collects Facebook usernames or passwords.
what you can do instead:
Get (and then extend) token for yourself (see scenario 4 in this document: https://developers.facebook.com/roadmap/offline-access-removal/). That extended token should be good for 60 days - and then you might be able to extend it again.
Try to get those photos using APPLICATION token - and if it works, then the token is good forever: https://developers.facebook.com/docs/authentication/applications/

cannot get image info using https://graph.facebook.com/<photo_id>

The API always return false, without any detailed information.
Then same even when using the photo IDs of my own photos.
However, the photo ID listed in the API document (the Coca Cola one) works without problems...
Your call to FB is correct i.e.
https://graph.facebook.com/PHOTO_ID + accesstoken
will return a JSON response with info about your image and urls to download the image in different sizes.
Most likely reason for your problem is you haven't requested the "user_photos" permission from the app user.