html 简单的“获取我所有的Facebook照片”facebook JS SDK + Graph API示例
Posted
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了html 简单的“获取我所有的Facebook照片”facebook JS SDK + Graph API示例相关的知识,希望对你有一定的参考价值。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Photos with Friends!</title>
<script src="http://code.jquery.com/jquery-1.9.0.min.js"></script>
<script>
/**
* This is the getPhoto library
*/
function makeFacebookPhotoURL( id, accessToken ) {
return 'https://graph.facebook.com/' + id + '/picture?access_token=' + accessToken;
}
function login( callback ) {
FB.login(function(response) {
if (response.authResponse) {
//console.log('Welcome! Fetching your information.... ');
if (callback) {
callback(response);
}
} else {
console.log('User cancelled login or did not fully authorize.');
}
},{scope: 'user_photos'} );
}
function getAlbums( callback ) {
FB.api(
'/me/albums',
{fields: 'id,cover_photo'},
function(albumResponse) {
//console.log( ' got albums ' );
if (callback) {
callback(albumResponse);
}
}
);
}
function getPhotosForAlbumId( albumId, callback ) {
FB.api(
'/'+albumId+'/photos',
{fields: 'id'},
function(albumPhotosResponse) {
//console.log( ' got photos for album ' + albumId );
if (callback) {
callback( albumId, albumPhotosResponse );
}
}
);
}
function getLikesForPhotoId( photoId, callback ) {
FB.api(
'/'+albumId+'/photos/'+photoId+'/likes',
{},
function(photoLikesResponse) {
if (callback) {
callback( photoId, photoLikesResponse );
}
}
);
}
function getPhotos(callback) {
var allPhotos = [];
var accessToken = '';
login(function(loginResponse) {
accessToken = loginResponse.authResponse.accessToken || '';
getAlbums(function(albumResponse) {
var i, album, deferreds = {}, listOfDeferreds = [];
for (i = 0; i < albumResponse.data.length; i++) {
album = albumResponse.data[i];
deferreds[album.id] = $.Deferred();
listOfDeferreds.push( deferreds[album.id] );
getPhotosForAlbumId( album.id, function( albumId, albumPhotosResponse ) {
var i, facebookPhoto;
for (i = 0; i < albumPhotosResponse.data.length; i++) {
facebookPhoto = albumPhotosResponse.data[i];
allPhotos.push({
'id' : facebookPhoto.id,
'added' : facebookPhoto.created_time,
'url' : makeFacebookPhotoURL( facebookPhoto.id, accessToken )
});
}
deferreds[albumId].resolve();
});
}
$.when.apply($, listOfDeferreds ).then( function() {
if (callback) {
callback( allPhotos );
}
}, function( error ) {
if (callback) {
callback( allPhotos, error );
}
});
});
});
}
</script>
<script>
/**
* This is the bootstrap / app script
*/
// wait for DOM and facebook auth
var docReady = $.Deferred();
var facebookReady = $.Deferred();
$(document).ready(docReady.resolve);
window.fbAsyncInit = function() {
FB.init({
appId : '548466918497006',
channelUrl : '//conor.lavos.local/channel.html',
status : true,
cookie : true,
xfbml : true
});
facebookReady.resolve();
};
$.when(docReady, facebookReady).then(function() {
if (typeof getPhotos !== 'undefined') {
getPhotos( function( photos ) {
console.log( photos );
});
}
});
// call facebook script
(function(d){
var js, id = 'facebook-jssdk'; if (d.getElementById(id)) {return;}
js = d.createElement('script'); js.id = id; js.async = true;
js.src = "http://connect.facebook.net/en_US/all.js";
d.getElementsByTagName('head')[0].appendChild(js);
}(document));
</script>
</head>
<body>
<div id="fb-root"></div>
</body>
</html>
以上是关于html 简单的“获取我所有的Facebook照片”facebook JS SDK + Graph API示例的主要内容,如果未能解决你的问题,请参考以下文章