Top Banner
Tích hợp trao đổi dữ liệu với Tích hợp trao đổi dữ liệu với Facebook Facebook By: Nguyễn Mạnh Tiến Tầm tay
25

Interactive with-facebook

Sep 01, 2014

Download

Technology

tien nguyen

trao doi du lieu voi facebook. presented at hanoi phpday 2011
Welcome message from author
This document is posted to help you gain knowledge. Please leave a comment to let me know what you think about it! Share it to your friends and learn new things together.
Transcript
Page 1: Interactive with-facebook

Tích hợp trao đổi dữ liệu với Tích hợp trao đổi dữ liệu với FacebookFacebook

By: Nguyễn Mạnh Tiến

Tầm tay

Page 2: Interactive with-facebook

Agenda

• FB connection• FB graph API • How work?• Technical steps• FB and Open Social

Page 3: Interactive with-facebook

Facebook overview

More than 800 million active users

More than 60 million Connect users monthly

About 83% people trust their friends over any other source.

Facebook users engaged with

facebook on 2.5M websites every

month

About 36 TB/day

Page 4: Interactive with-facebook

Facebook connection?

λ The next evolution of Facebook Platform

λ It enables the integration of the Facebook Platform into your own site, allowing your users to:

– Seamlessly "connect" their Facebook account and

information with your site

– Connect and find their friends who also use your site

– Share information and actions on your site with their

friends on Facebook through their profile pages &

newsfeeds

Page 5: Interactive with-facebook

Facebook to my site?

• Identity: Seamlessly connect the user's Facebook account and

information with your site.

• Friends: Bring a user's Facebook friends into your site. You can

even link friends that have existing accounts.

• Discovery: Publish information back into their friends' News

Feeds on Facebook.

• Privacy: Bring dynamic privacy to your site.

• Reliability: The full power and flexibility of Facebook

Platform.

Page 6: Interactive with-facebook

Should Use Facebook Connect?

• One-click Login: Allow users to log in with their Facebook identity and

allow your site to access their Facebook profile information.

• Increased engagement: Leverage users' personal interests to show more

relevant information and surface personalized content from friends such

as reviews or comments.

• New forms of distribution: Users can share content and actions taken on

your site with friends back on Facebook through feed, invites, and other

social communication channels on Facebook.

Page 7: Interactive with-facebook

Facebook core

Page 8: Interactive with-facebook

Facebook Graph API?

– Facebook's core

– Presents a simple, consistent view of the Facebook social graph

– Every object in the social graph has a unique ID. You can access the properties of an object by requesting https://graph.facebook.com/ID

– People and pages with usernames can be accessed using their username as an ID

– All responses are JSON objects

– Relationships

– Reading, Searching, Publishing, Deleting, Analytics

Page 9: Interactive with-facebook

Object

https://graph.facebook.com/platform

Page 10: Interactive with-facebook

Relationships

https://graph.facebook.com/ID/CONNECTION_TYPE

Page 11: Interactive with-facebook

How does it work? How does it work?

Page 12: Interactive with-facebook

Connect

Page 13: Interactive with-facebook

Interactive with Facebook

Page 14: Interactive with-facebook

Technical stepsTechnical steps

Page 15: Interactive with-facebook

First step

• Yêu cầu chung: YOUR_APP_ID

• đăng ký với FB để lấy mã ID tương tác với ứng dụng của FB (FaceBook API)

• http://developers.facebook.com/setup/

Page 16: Interactive with-facebook

Next step : Authentication Authenticate on your site (out of FB). Method of authentication :

in code - server side : The server-side flow is used whenever you need to call the Graph API from your web server

in html - client side : The client-side flow is used when you need to make calls to the Graph API from a client, such as JavaScript running in a Web browser or from a native mobile or desktop app

Iusse request :

https://www.facebook.com/dialog/oauth?

client_id=YOUR_APP_ID&redirect_uri=YOUR_URL&scope=email,read_stream Return code to get access token key:

Kết thúc Authentication thì FB sẽ trả về code để lấy token code và access vào graph protocol của FB để lấy các loại dữ liệu khác

nguồn tham khảo : http://developers.facebook.com/docs/authentication

Page 17: Interactive with-facebook

Reading

Using access token key, issuing HTTP GET requests , return data in json

ví dụ truy cập feed :

https://graph.facebook.com/id/feed?access_token=2227470867|2.AQA_W4-fDdlG-erj.3600.1306126800.0-1090002606|Ktp_XdsULJo0j-CAaUratCxJKqM

Php code:

<?php

$readfeed_url = sprintf('https://graph.facebook.com/%d/feed?access_token=%s',$fbdata['fbid'], $fbdata['access_token'] ) ;

$feed = json_decode(file_get_contents($readfeed_url));

?>

Page 18: Interactive with-facebook

Publishing

Using access token key: issuing HTTP POST requests

Php code tương ứng :

<?php

$token = 3523452345.....

$message = "Hello, Arjun. I like this new API";

$uid = arjun

$url = https://graph.facebook.com/$uid/feed?access_token=$token&message=$message&method=post

$result = file_get_contents($url);

?>

Page 19: Interactive with-facebook

Alternatively, OpenSocial

Page 20: Interactive with-facebook

Market Size and Competition

• Ideally speaking, OpenSocial has a market potential for 250 million users as opposed to 64 million active users on Facebook

• 15,000 Applications on Facebook. Difficult to rapidly grow user base due to a saturated market

• Most existing Google Widgets can run on OpenSocial. Results? Difficult to rapidly grow user base due to existing competition

Page 21: Interactive with-facebook

Technical Differences

• Facebook requires proprietary languages (FBML, FQL, FBJS). Google requires XML and JavaScript

• Google provides an IDE (aka Google Gadget Editor)

• Google hosts applications for free. Facebook doesn’t

Page 22: Interactive with-facebook

Language Support

Facebook API• FBML• FQL

• FBJS

• Partial support for AJAX• Backend languages like

PHP, Java, .NET on Canvas

OpenSocial API• XHTML/XML• JavaScript

• Full Support for AJAX

• Backend languages like PHP, Java, .NET on Canvas

Page 23: Interactive with-facebook

FB and Open social

• The choice of your platform should depend on demographic

• OpenSocial is modeled after Facebook. So if you’ve built a Facebook application before, it is relatively easy to learn OpenSocial

• “Write Once, Run Anywhere” is not exactly true. An Orkut specific OpenSocial app. Might not necessairly run on Hi5

Page 24: Interactive with-facebook

Resources

• Getting Started Guide: http://wiki.developers.facebook.com/index.php/Trying_Out_Facebook_Connect

• Facebook Connect Policies: http://wiki.developers.facebook.com/index.php/Facebook_Connect_Policies

• Facebook Connect: Developers Central

http://developers.facebook.com/docs/

• Graph API

http://graph.facebook.com/

• Websites using Facebook Connect sorted by active monthly users

http://www.allfacebook.com

•Opensocial

http://code.google.com/apis/opensocial/

Page 25: Interactive with-facebook

Thank youThank you

Nguyễn Mạnh Tiến

[email protected]

www.tamtay.vn