Graph API

SDKs & Tools

Introduction

SDKs lets you access Graph API and other JavaScript SDK (Graph API, dialogs) PHP SDK (Graph API, Login) iOS SDK (SSO, Graph API, dialogs) Android SDK (SSO, Graph API, dialogs) other (ex: c#)

Tools guides and tutorials debuggers (ex: Graph API Explorer)

https://developers.facebook.com/docs/sdks/

JavaScript SDK

Access Facebook server API calls from the client Graph API REST API Dialogs

Render XFBML social plugins Supports OAuth 2.0 App ID is needed to initialize the SDK

Initialization <div id="fb-root"></div> <script src="//connect.facebook.net/en_US/all.js"></script> <script> FB.init({ appId : '178747652203562', status : true, cookie : true, xfbml : true, oauth : true }); </script>

Platform dialogs - FB.ui() Integrate Facebook UI flow into the

application Feed Dialog Add a friend Authorize the application Buy credits Send application request Share a link

Feed dialog FB.ui( { method: 'feed', name: 'Developer Community', link: 'https://www.facebook.com/event.php?eid=206539312741159', picture: 'http://blog.mist.sk/wp-content/uploads/2011/10/FacebookDevSK-thumb.jpg', caption: 'Facebook Developer Community', description: 'The first Facebook developer community meeting in Bratislava' }, function(response) { if (response && response.post_id) { alert('Post was published.'); } else { alert('Post was not published.'); } } );

Feed dialog FB.ui( { method: 'feed', name: 'Developer Community', link: 'https://www.facebook.com/event.php?eid=206539312741159', picture: 'http://blog.mist.sk/wp-content/uploads/2011/10/FacebookDevSK-thumb.jpg', caption: 'Facebook Developer Community', description: 'The first Facebook developer community meeting in Bratislava' }, function(response) { if (response && response.post_id) { alert('Post was published.'); } else { alert('Post was not published.'); } } );

Feed dialog FB.ui( { method: 'feed', name: 'Developer Community', link: 'https://www.facebook.com/event.php?eid=206539312741159', picture: 'http://blog.mist.sk/wp-content/uploads/2011/10/FacebookDevSK-thumb.jpg', caption: 'Facebook Developer Community', description: 'The first Facebook developer community meeting in Bratislava' }, function(response) { if (response && response.post_id) { alert('Post was published.'); } else { alert('Post was not published.'); } } );

Application request FB.ui( { method: 'apprequests', message: 'Check the Bratislava Facebook Community meeting demo app' }, function(response) { // handle callback console.log(response); } );

Application request FB.ui( { method: 'apprequests', message: 'Check the Bratislava Facebook Community meeting demo app' }, function(response) { // handle callback console.log(response); } );

Application request FB.ui( { method: 'apprequests', message: 'Check the Bratislava Facebook Community meeting demo app' }, function(response) { // handle callback console.log(response); } );

User Authentication

Register to the website using Facebook or get the permissions for the app FB.login() FB.logout() FB.getLoginStatus() FB.getAuthResponse()

Advantages sharing logged in user state registration flow on the website isn't needed get access to the user's social graph

Login user FB.login( function(response) { if (response.authResponse) { console.log('Welcome! Fetching your information.... '); FB.api('/me', function(response) { console.log('Good to see you, ' + response.name + '.'); }); } else { console.log('User cancelled login or did not fully authorize.'); } }, {scope: 'email'});

Login user FB.login( function(response) { if (response.authResponse) { console.log('Welcome! Fetching your information.... '); FB.api('/me', function(response) { console.log('Good to see you, ' + response.name + '.'); }); } else { console.log('User cancelled login or did not fully authorize.'); } }, {scope: 'email'});

Demo

https://apps.facebook.com/bratislava-developer/

Milan STESKAL

@milansteskal @facebookDevSk facebook.com/groups/188066214578728/