CS160 Discussion Section David Sun

Facebook Application Architecture Information repository Session management GUI Privacy

Creating a Facebook Application Add “Developer” application on Facebook. Click “Set Up New Application”. Provide: – Application name, e.g. myfirstapp – Support e.g. – Callback URL (this is the URL to your application code) – Canvas page URL (the actual facebook url as seen by the users) You will get: – An API Key : 05a5ef15248bb9a4887e5f – A Secret Key: 09901d83048d959eaad17228c8c7a95b – Identify the application to Facebook

Client/Server Interaction Browser App Canvas Your app server Facebook server 2. App server returns FBML 3. Facebook renders FBML to HTML 1. Browser makes request

Browser Client/Server Interaction App Canvas Your app server Facebook server 2. FB server calls App Server through callback URL 4. App server returns FBML 5. Facebook renders FBML to HTML 1. Browser makes request 3. App calls FB API

appinclude.php <?php require_once 'facebook.php'; $appapikey = '05a5ef15248bb9a4887e5f ' $appsecret = '09901d83048d959eaad17228c8c7a95b' $facebook = new Facebook($appapikey, $appsecret); $user = $facebook->require_login(); //[todo: change the following url to your callback url] $appcallbackurl = ' //catch the exception that gets thrown if the cookie has an invalid session_key in it try { if (!$facebook->api_client->users_isAppAdded()) { $facebook->redirect($facebook->get_add_url()); } } catch (Exception $ex) { //this will clear cookies for your application and redirect them to a login prompt $facebook->set_user(null, null); $facebook->redirect($appcallbackurl); } ?>

Information Management Application generic information: – Information (or a subset of) that users submitted to Facebook: name, birth-date, relationship status, interests, education background etc. – Can be retrieved by SQL queries or Facebook API. Application specific information – Data users submit to or needs to be maintained for your application. – MYSQL database.

Facebook Query Language (FQL) FQL = subset of SQL – Only select-statements, no updates/deletes Exposed Facebook data/tables: – User, Friend, Group, Group_member, Event, Event_member, Photo, AlbumPhoto_tag SELECT name, affiliations FROM user WHERE uid IN (SELECT uid2 FROM friend WHERE uid1=211031)

User Table user uid*, first_name, last_name, name*, pic_small, pic_big, pic_square, pic, affiliations, profile_update_time, timezone, religion, birthday, sex, hometown_location, meeting_sex, meeting_for, relationship_status, significant_other_id, political, current_location, activities, interests, is_app_user, music, tv, movies, books, quotes, about_me, hs_info, education_history, work_history, notes_count, wall_count, status, has_added_app

Application Specific Information Repository We will be support MYSQL in this class project You will be able to run individual MYSQL servers on your instructional accounts. Design a database schemata that matches the needs of your application. – will need to be “interoperable” with Facebook databases. – should be sound, i.e. correct keys, normalized etc.

Example: Free Gifts

PHP “Object oriented” server-side scripting language. Becoming increasingly popular in recent years. Mixture of C/Pearl syntax. HTML-compliant Supports external resource: e.g. mysql

PHP/MySQL <?php // Connecting, selecting database $link = mysql_connect('mysql_host', 'mysql_user', 'mysql_password') or die('Could not connect: '. mysql_error()); echo 'Connected successfully'; mysql_select_db('my_database') or die('Could not select database'); ?>

Facebook API Wrappers for FQL queries. Implemented in a variety of scripting languages: PHP, Python, Ruby,.NET Getting session specific information: – createToken – getSession – getLoggedInUser Getting Facebook data: – Users.getInfo – Photos.get

FBML – Facebook Markup Language Subset of HTML + Facebook elements Functionalities: – Enforce uniform/standard look and feel for shared components: navigation, wall, dashbord, friend- selector, buttons, time-dates, dialog, notification. – Implementing privacy designs: e.g., restrict the content to be only visible to the current viewer. Syntax just like well-formed HTML/XML.

FBML have read am reading want to read

FBML Success message This is the success message text.

FBML Privacy control is a key design issue in your project. You can enclose GUI elements with privacy tags to control what other people can see on your profile. Welcome back to your profile! User , you are in the Berkeley network!

Other technology JavaScript (beta) Mock-AJAX Flash/Action-Script Ruby/ColdFusion/.NET

Instructional Computing We’ll be supporting – MYSQL – PHP – Apache If you want to use any other technology then you will need to run your own server on the public domain.

Getting Started Set up MYSQL. Create the first application : hp hp Create a project webpage under your instructional: – Say a little about who you guys are. – The title/goal of the project – You will be uploading documents and code to this space in the future. – Send the URL

Resources FBML: BMLhttp://wiki.developers.facebook.com/index.php/F BML API: FQL: Code Testing: MySQL: (manual) shtml (quick reference) shtml PHP: Project WIKI – (instructions on setting up MySQL)