tìm hiểu và xây dựng ứng dụng facebook

một số actionscript khác để xây dựng một ứng dụng hoàn chỉnh.Kết quả đạt được : xây dựng được một ứng dụng hoàn chỉnh, nắm được các bước tạo một ứng dụng Facebook, cách kết nối và các AP

TRƯỜNG ĐẠI HỌC GIAO THÔNG VẬN TẢI TP HCM

KHOA CÔNG NGHỆ THÔNG TIN

BỘ MÔN MẠNG MÁY TÍNH VÀ TRUYỀN THÔNG

NGUYỄN BÁ THÀNH CHƯƠNG - 0851120009

LÝ XUÂN TRƯỜNG - 0851120061

TÌM HIỂU VÀ XÂY DỰNG ỨNG DỤNG TRÊN

FACEBOOK

KHÓA LUẬN TỐT NGHIỆP KỸ SƯ CNTT

GIÁO VIÊN HƯỚNG DẪN

NIÊN KHÓA 2008 - 2012

NHẬN XÉT CỦA GIÁO VIÊN HƯỚNG DẪN

Ngày …… tháng …… năm 2012 Giáo viên hướng dẫn ThS Đặng Nhân Cách NHẬN XÉT CỦA GIÁO VIÊN PHẢN BIỆN

Ngày …… tháng …… năm 2012Giáo viên phản biện

Thầy:

LỜI CÁM ƠN

Sau gần ba tháng cố gắng thực hiện đề tài “TÌM HIỂU VÀ XÂY DỰNG ỨNG DỤNG TRÊN FACEBOOK” Ngoài sự cố gắng hết mình của chúng tôi, chúng tôi còn nhận được sự khích lệ, động viên rất nhiều từ phía nhà trường, thầy

cô, bạn bè và gia đình

Trước hết chúng tôi xin cám ơn quý thầy cô Trường Đại Học Giao Thông Vận Tải Thành Phố Hồ Chí Minh đã truyền đạt những kiến thức quý báu trong suốt quá trình học tập phục vụ cho việc nghiên cứu đề tài Đặc biệt, chúng tôi xin bày tỏ lòng biết ơn chân thành sâu sắc nhất đến Thầy Đặng Nhân Cách, người đã tận tình hướng dẫn và giúp đỡ chúng tôi trong suốt thời gian thực hiện đề tài này

Xin cảm ơn tất cả các bạn bè đã và đang giúp đỡ động viên chúng tôi trong quá trình học tập và hoàn thành đề tài này Những lời cám ơn sau cùng xin dành cho

ba mẹ và các anh em trong gia đình đã hết lòng quan tâm và tạo điều kiện tốt nhất

để chúng tôi hoàn thành tốt được khóa luận tốt nghiêp này

Mặc dù đã cố gắng hết sức để hoàn thành đề tài này nhưng chắc chắn sẽ không tránh khỏi những sai sót Chúng tôi rất mong nhận được sự thông cảm và đóng góp, chỉ bảo tận tình của quý thầy cô và bạn bè

TP Hồ Chí Minh - 2012

Sinh viên thực hiệnNguyễn Bá Thành Chương – Lý Xuân Trường

Khoa Công Nghệ Thông Tin

Bộ Môn Mạng Máy Tính và Truyền Thông

Đề Cương Chi Tiết

Tên đề tài: TÌM HIỂU VÀ XÂY DỰNG ỨNG DỤNG FACEBOOK

Giáo Viên Hướng Dẫn: Thầy Đặng Nhân Cách

Thời gian thực hiện: 24/09/2012 đến 20/12/2012

Sinh viên thực hiện: Nguyễn Bá Thành Chương - 0851120009

Lý Xuân Trường - 0851120061

Loại đề tài: Xây dựng ứng dụng ( có demo minh họa)

Nội Dung Đề Tài:

Chương 1:

- Giới thiệu bối cảnh, phạm vi, mục tiêu và cấu trúc của đề tài

Chương 2:

- Nghiên cứu tổng quan về Facebook, cách đăng ký và tạo một ứng dụng

- Tìm hiểu các API của Facebook: Graph API, Open Graph, Access token, json, FQL …

- Tìm hiểu các Dialog

Chương 3:

- Chương này sẽ trình bày chi tiết cách thiết kế và xây dựng ứng dụng: tổng quan về ứng dụng, phân tích và thiết kế layout, tạo cơ sở dữ liệu, viết code ứng dụng

một số actionscript khác để xây dựng một ứng dụng hoàn chỉnh.

Kết quả đạt được : xây dựng được một ứng dụng hoàn chỉnh, nắm được các bước tạo một ứng dụng Facebook, cách kết nối và các API, dialog của Facebook…

Kế hoạch Thực hiện: Đề tài được hoàn thành trong 12 tuần

1 Lập kế hoạch thực hiện đề tài, tìm tài

liệu

Thành Chương, Xuân Trường

2 Lập kế hoạch thực hiện đề tài, tìm tài

liệu

Thành Chương, Xuân Trường

3 Xem tài liệu Thành Chương, Xuân Trường

4 Thiết kế giao diện và chức năng ứng

dụng demo

Thành Chương, Xuân Trường

5 Xây dựng ứng dụng Xuân Trường

6 Chỉnh sửa ứng dụng Xuân Trường

7 Viết báo cáo luận văn chương 1 Thành Chương

8 Viết báo cáo luận văn chương 2 Xuân Trường

9 Viết báo cáo luận văn chương 3 Thành Chương

10 Viết báo cáo luận văn chương 4,5 Thành Chương

11 Chỉnh sửa báo cáo Thành Chương, Xuân Trường

12 Chỉnh sửa báo cáo Thành Chương, Xuân Trường

TRƯỜNG ĐẠI H C GIAO THÔNG V N T I TP HCMỌ Ậ Ả i

NH N XÉT C A GIÁO VIÊN HẬ Ủ ƯỚNG D NẪ i

NH N XÉT C A GIÁO VIÊN PH N BI N

TÓM T T KHÓA LU NẮ Ậ xiv

CHƯƠNG 1: T NG QUANỔ 1

CHƯƠNG 2: C S LÝ THUY TƠ Ở Ế 3

Hình 2.1: FBML 5

Hình 2.2: Iframes 5

Hình 2.3 : Create new app 6

Hình 2.4: Đặt tên app 7

Hình 2.5: i n mã xác nh nĐ ề ậ 7

Hình 2.9: getLoginUrl () 8

Hình 2.10: Cú pháp c p quy nấ ề 9

Hình 2.11: L y thông tin ngày sinhấ 9

Hình 2.12: D li u ki u JSONữ ệ ể 15

Hình 2.13: Đố ượi t ng trong JSON 15

Hình 2.14: M ng trong JSONả 16

Hình 2.15: JSON s d ng cú pháp Javascriptử ụ 16

Hình 2.16: Truy xu t đ i t ng đ u tiênấ ố ượ ầ 16

Hình 2.17: T o m ng d li u $sarrayPhpạ ả ữ ệ 17

Hình 2.18: K t qu encodeế ả 17

Hình 2.19: Ví d Decodeụ 17

Hình 2.20: K t qu Decodeế ả 17

Hình 2.21: Access token 18

Hình 2.24: K t qu tr vế ả ả ề 19

Hình 2.25: Cú pháp file_get_content 19

Hình 2.26: Ví d dùng file_get_contentụ 19

Hình 2.27: Chuy n đ i JSON v ARRAYể ổ ề 20

Hình 2.28: Ví d dùng Graph APIụ 20

Hình 2.29: K t qu dùng Graph APIế ả 20

Hình 2.30: Cú pháp truy xu t đ i t ng không là photoấ ố ượ 20

Hình 2.31: Truy xu t hình nh dùng tham s typeấ ả ố 21

Hình 2.32: S d ng typeử ụ 21

Hình 2.33: Hàm l y nh vấ ả ề 21

Hình 2.34: Hàm l u nh l y vư ả ấ ề 21

Hình 2.35: Ví d l u nh l y vụ ư ả ấ ề 21

Hình 2.36: Cú pháp truy xu t đ i t ng là photoấ ố ượ 22

Hình 2.37: Ví d truy xu t hình nhụ ấ ả 22

Hình 2.38: K t qu truy xu t hình nhế ả ấ ả 22

Hình 2.39: Cú pháp access_token 23

Hình 2.40: Ví d access_tokenụ 23

Hình 2.41: K t qu truy xu t access_tokenế ả ấ 23

Hình 2.42: Truy xu t m r ngấ ở ộ 24

Hình 2.43: Truy xu t danh sách friend userấ 25

Hình 2.44: L i truy xu t danh sách friend userỗ ấ 25

Hình 2.45: Cú pháp Profile feed 25

Hình 2.46: K t qu tr v Profile Feedế ả ả ề 26

Hình 2.47: Cú pháp gi i h n Fieldớ ạ 26

Hình 2.48: Ví d gi i h n Fieldụ ớ ạ 26

Hình 2.49: K t qu gi i h n Fieldsế ả ớ ạ 27

Hình 2.50: Cú pháp gi i h n recordớ ạ 27

Hình 2.51: Ví d gi i h n recordụ ớ ạ 27

Hình 2.52: K t qu gi i h n recordsế ả ớ ạ 27

Hình 2.53: Cú pháp gi i h n record dùng offsetớ ạ 28

Hình 2.54: Ví d gi i h n record dùng offsetụ ớ ạ 28

Hình 2.55: K t qu gi i h n records dùng offsetế ả ớ ạ 28

Hình 2.56: Cú pháp l y thông tin nhi u đ i t ngấ ề ố ượ 28

Hình 2.57: Ví d l y thông tin nhi u đ i t ngụ ấ ề ố ượ 28

Hình 2.58: K t qu l y thông tin nhi u đ i t ngế ả ấ ề ố ượ 29

Hình 2.59: K t qu l y thông tin dùng URLế ả ấ 29

Hình 2.60: URL CocaCola 29

Hình 2.61: Cú pháp truy v n FQLấ 32

Hình 2.62: Cú pháp truy v n FQL có đi u ki nấ ề ệ 32

Hình 2.67: L y thông tin cá nhân friend ng i dùngấ ườ 34

Hình 2.68: K t qu ví d 3ế ả ụ 34

Hình 2.69: L y k t qu limit và randomấ ế ả 35

Hình 2.70: K t qu ví d 4 l n 1ế ả ụ ầ 35

Hình 2.71: K t qu ví d 4 l n 2ế ả ụ ầ 36

Hình 2.72: Feed dialog 38

Hình 2.73: Đường d n đ n file Jsẫ ế 38

Hình 2.74: Khai báo th vi n SDKư ệ 39

Hình 2.75: Khai báo g i các APIọ 39

Hình 2.76: Liên k t đính kèmế 39

Hình 2.77: Ph ng th c Dialog Feedươ ứ 39

Hình 2.78: K t qu Feed Dialogế ả 40

Hình 2.79: K t qu Oauth Dialogế ả 41

Hình 2.80: ADD Page Tab Dialog 43

Hình 2.81: Friends Dialog 44

Hình 2.82: Request Dialog 46

Hình 2.83: Sendrequest via recipients 47

Hình 2.84: Send Dialog 49

Hình 2.85: Thông báo Send Dialog 50

CHƯƠNG 3: XÂY D NG NG D NGỰ Ứ Ụ 50

Hình 3.1: table sanpham 53

Hình 3.2: Table user 54

Hình 3.3: Giao di n trang ch - topệ ủ 54

Hình 3.4: Giao di n trang ch - footerệ ủ 55

Hình 3.5: Giao di n trang chi ti t s n ph mệ ế ả ẩ 56

Hình 3.6: Giao di n trang đ ng s n ph mệ ă ả ẩ 57

Hình 3.7: Trang liên hệ 58

Hình 3.8: Trang qu n trả ị 58

Hình 3.9: Qu n lý ng i dùngả ườ 59

Hình 3.10: SDK Facebook 59

Hình 3.11: Liên k t ng d ng v i Facebookế ứ ụ ớ 60

Hình 3.12: getUser() 60

Hình 3.13: Chuy n h ng ng i dùngể ướ ườ 61

Hình 3.14: Các quy n c a tham s $paramsề ủ ố 61

Hình 3.15: G i hàm apiọ 61

Hình 3.16: G i hàm api trong ng d ngọ ứ ụ 62

Hình 3.17: api(‘/me’) 62

Hình 3.18: Code truy xu t và l u tr thông tin ng i dùngấ ư ữ ườ 62

Hình 3.19: K t n i c s d li uế ố ơ ở ữ ệ 62

Hình 3.20: Ki m tra like fanpageể 63

Hình 3.21: Chèn plugin và Dialog 63

Hình 3.22: Plugin Like box 63

Hình 3.23: Code chèn plugin Likebox 64

Hình 3.24: Plugin Like 64

Hình 3.25: Code chèn plugin like 64

Hình 3.26: Plugin comment 65

Hình 3.27: Chèn plugin comment 65

Hình 3.28: Dialog share 65

Hình 3.29: Code dialog share 65

CHƯƠNG 4: KI M TRA VÀ ÁNH GIÁỂ Đ 66

CHƯƠNG 5: K T LU NẾ Ậ 68

TÀI LI U THAM KH OỆ Ả 72

MỤC LỤC HÌNH ẢNH TRƯỜNG ĐẠI H C GIAO THÔNG V N T I TP HCMỌ Ậ Ả i

NH N XÉT C A GIÁO VIÊN HẬ Ủ ƯỚNG D NẪ i

NH N XÉT C A GIÁO VIÊN PH N BI NẬ Ủ Ả Ệ ii

L I CÁM NỜ Ơ iii

M C L C

CHƯƠNG 2: C S LÝ THUY TƠ Ở Ế 3

Hình 2.1: FBML 5

Hình 2.2: Iframes 5

Hình 2.3 : Create new app 6

Hình 2.4: Đặt tên app 7

Hình 2.5: i n mã xác nh nĐ ề ậ 7

Hình 2.9: getLoginUrl () 8

Hình 2.10: Cú pháp c p quy nấ ề 9

Hình 2.11: L y thông tin ngày sinhấ 9

Hình 2.12: D li u ki u JSONữ ệ ể 15

Hình 2.13: Đố ượi t ng trong JSON 15

Hình 2.14: M ng trong JSONả 16

Hình 2.15: JSON s d ng cú pháp Javascriptử ụ 16

Hình 2.16: Truy xu t đ i t ng đ u tiênấ ố ượ ầ 16

Hình 2.17: T o m ng d li u $sarrayPhpạ ả ữ ệ 17

Hình 2.18: K t qu encodeế ả 17

Hình 2.19: Ví d Decodeụ 17

Hình 2.20: K t qu Decodeế ả 17

Hình 2.21: Access token 18

Hình 2.24: K t qu tr vế ả ả ề 19

Hình 2.25: Cú pháp file_get_content 19

Hình 2.26: Ví d dùng file_get_contentụ 19

Hình 2.27: Chuy n đ i JSON v ARRAYể ổ ề 20

Hình 2.28: Ví d dùng Graph APIụ 20

Hình 2.29: K t qu dùng Graph APIế ả 20

Hình 2.30: Cú pháp truy xu t đ i t ng không là photoấ ố ượ 20

Hình 2.31: Truy xu t hình nh dùng tham s typeấ ả ố 21

Hình 2.32: S d ng typeử ụ 21

Hình 2.33: Hàm l y nh vấ ả ề 21

Hình 2.34: Hàm l u nh l y vư ả ấ ề 21

Hình 2.35: Ví d l u nh l y vụ ư ả ấ ề 21

Hình 2.36: Cú pháp truy xu t đ i t ng là photoấ ố ượ 22

Hình 2.37: Ví d truy xu t hình nhụ ấ ả 22

Hình 2.38: K t qu truy xu t hình nhế ả ấ ả 22

Hình 2.39: Cú pháp access_token 23

Hình 2.40: Ví d access_tokenụ 23

Hình 2.41: K t qu truy xu t access_tokenế ả ấ 23

Hình 2.42: Truy xu t m r ngấ ở ộ 24

Hình 2.43: Truy xu t danh sách friend userấ 25

Hình 2.44: L i truy xu t danh sách friend userỗ ấ 25

Hình 2.45: Cú pháp Profile feed 25

Hình 2.46: K t qu tr v Profile Feedế ả ả ề 26

Hình 2.47: Cú pháp gi i h n Fieldớ ạ 26

Hình 2.48: Ví d gi i h n Fieldụ ớ ạ 26

Hình 2.49: K t qu gi i h n Fieldsế ả ớ ạ 27

Hình 2.50: Cú pháp gi i h n recordớ ạ 27

Hình 2.51: Ví d gi i h n recordụ ớ ạ 27

Hình 2.52: K t qu gi i h n recordsế ả ớ ạ 27

Hình 2.53: Cú pháp gi i h n record dùng offsetớ ạ 28

Hình 2.54: Ví d gi i h n record dùng offsetụ ớ ạ 28

Hình 2.55: K t qu gi i h n records dùng offsetế ả ớ ạ 28

Hình 2.56: Cú pháp l y thông tin nhi u đ i t ngấ ề ố ượ 28

Hình 2.57: Ví d l y thông tin nhi u đ i t ngụ ấ ề ố ượ 28

Hình 2.58: K t qu l y thông tin nhi u đ i t ngế ả ấ ề ố ượ 29

Hình 2.59: K t qu l y thông tin dùng URLế ả ấ 29

Hình 2.60: URL CocaCola 29

Hình 2.61: Cú pháp truy v n FQLấ 32

Hình 2.62: Cú pháp truy v n FQL có đi u ki nấ ề ệ 32

Hình 2.63: L y thông tin ng i dùngấ ườ 33

Hình 2.64: K t qu ví d 1ế ả ụ 33

Hình 2.69: L y k t qu limit và randomấ ế ả 35

Hình 2.70: K t qu ví d 4 l n 1ế ả ụ ầ 35

Hình 2.71: K t qu ví d 4 l n 2ế ả ụ ầ 36

Hình 2.72: Feed dialog 38

Hình 2.73: Đường d n đ n file Jsẫ ế 38

Hình 2.74: Khai báo th vi n SDKư ệ 39

Hình 2.75: Khai báo g i các APIọ 39

Hình 2.76: Liên k t đính kèmế 39

Hình 2.77: Ph ng th c Dialog Feedươ ứ 39

Hình 2.78: K t qu Feed Dialogế ả 40

Hình 2.79: K t qu Oauth Dialogế ả 41

Hình 2.80: ADD Page Tab Dialog 43

Hình 2.81: Friends Dialog 44

Hình 2.82: Request Dialog 46

Hình 2.83: Sendrequest via recipients 47

Hình 2.84: Send Dialog 49

Hình 2.85: Thông báo Send Dialog 50

CHƯƠNG 3: XÂY D NG NG D NGỰ Ứ Ụ 50

Hình 3.1: table sanpham 53

Hình 3.2: Table user 54

Hình 3.3: Giao di n trang ch - topệ ủ 54

Hình 3.4: Giao di n trang ch - footerệ ủ 55

Hình 3.5: Giao di n trang chi ti t s n ph mệ ế ả ẩ 56

Hình 3.6: Giao di n trang đ ng s n ph mệ ă ả ẩ 57

Hình 3.7: Trang liên hệ 58

Hình 3.8: Trang qu n trả ị 58

Hình 3.9: Qu n lý ng i dùngả ườ 59

Hình 3.10: SDK Facebook 59

Hình 3.11: Liên k t ng d ng v i Facebookế ứ ụ ớ 60

Hình 3.12: getUser() 60

Hình 3.13: Chuy n h ng ng i dùngể ướ ườ 61

Hình 3.14: Các quy n c a tham s $paramsề ủ ố 61

Hình 3.15: G i hàm apiọ 61

Hình 3.16: G i hàm api trong ng d ngọ ứ ụ 62

Hình 3.17: api(‘/me’) 62

Hình 3.18: Code truy xu t và l u tr thông tin ng i dùngấ ư ữ ườ 62

Hình 3.19: K t n i c s d li uế ố ơ ở ữ ệ 62

Hình 3.20: Ki m tra like fanpageể 63

Hình 3.21: Chèn plugin và Dialog 63

Hình 3.22: Plugin Like box 63

Hình 3.23: Code chèn plugin Likebox 64

Hình 3.24: Plugin Like 64

Hình 3.25: Code chèn plugin like 64

Hình 3.26: Plugin comment 65

Hình 3.27: Chèn plugin comment 65

Hình 3.28: Dialog share 65

Hình 3.29: Code dialog share 65

CHƯƠNG 4: KI M TRA VÀ ÁNH GIÁỂ Đ 66

CHƯƠNG 5: K T LU NẾ Ậ 68

TÀI LI U THAM KH OỆ Ả 72

Mạng xã hội Facebook cũng là một cách để các doanh nghiệp sử dụng để tăng hiệu quả quảng bá thương hiệu Facebook hiện đang được sử dụng rộng rãi trên toàn thế giới với số lượng người dùng đông đảo nên việc tận dụng các tài nguyên sẵn có của Facebook sẽ mang đến một số thuận lợi nhất định Do đó chúng tôi chọn

đề tài này để nghiên cứu cho việc quảng bá một thương hiệu hay cá nhân nào đó.Trên thực tế việc gì cũng có mặt tốt mặt xấu Và sử dụng Facebook cũng không ngoại lệ Vì vậy, trong luận văn này chúng tôi sẽ trình bày về cách thức xây dựng một ứng dụng trên Facebook cho mục đích thương mại, tập trung vào việc nghiên cứu cách thức hoạt động của một ứng dụng Facebook, cách nó tận dụng tài nguyên

từ người dùng, xây dựng một ứng dụng hoàn chỉnh phù hợp, dễ sử dụng với mọi người

Đề tài tìm hiểu về cách xây dựng một ứng dụng trên Facebook, cách thức cấu tạo và cấu hình ứng dụng, cách liên kết giữa ứng dụng và Facebook dựa trên các API của Facebook Để việc xây dựng đạt được hiệu quả, đề tài đã sử dụng một số tài nguyên như:

 Hiểu được cách liên kết của một ứng dụng với Facebook.

 Xây dựng được một ứng dụng hoàn chỉnh cho phép người dùng truy cập và sử dụng

 Ứng dụng có cấu trúc như một trang web cho phép người dùng đăng sản phẩm mình muốn bán (gồm thông tin sản phẩm, giá cả và cách thức giao hàng) Người đăng phải đăng nhập vào Facebook mới có thể đăng được bài do đó ứng dụng tận dụng được thông tin người dùng có sẵn trên Facebook

 Biết được cách một ứng dụng lấy được thông tin người dùng thông qua các hàm có sẵn của Facebook

CHƯƠNG 1: TỔNG QUAN

1.1 Giới thiệu

Nền công nghệ thông tin trên thế giới đang phát triển với tốc độ nhanh chóng Ngày càng nhiều sản phẩm và nhiều tiện ích được phát triển và đưa đến tay người dùng Các công nghệ cũ dần dần đã thể hiện nhiều mặt hạn chế và không phù hợp với nhu cầu thực tiễn nữa, đặc biệt trong thời buổi kinh tế phát triển không ổn định như lúc này, các doanh nghiệp phải đối mặt với nhiều rủi ro Do đó yêu cầu nhất thiết được đặt ra là tìm mọi cách để giảm thiểu các chi phí có thể mà vẫn có thề quảng bá được thương hiệu và sản phẩm đến người dùng Trong lĩnh vực công nghệ thông tin thì mạng xã hội Facebook là một giải pháp lý tưởng cho các doanh nghiệp

có thể giải quyết bài toán về việc quảng bá thương hiệu với khả năng lan truyền nhanh chóng qua internet

Facebook tận dụng tối đa tài nguyên mạng internet, cứ một người biết thì sẽ giới thiệu đến bạn của mình và cứ thế, số lượng người sẽ gia tăng nhanh chóng Vấn

đề khó khăn của việc dùng Facebook này chính khi nhà mạng chặn thì sẽ không thể truy cập được vào Facebook, tốc độ truy cập có thể bị chậm vì đường truyền

Tại Việt Nam, các ứng dụng Facebook đã xuất hiện rất nhiều nhưng phần lớn mang tính chất giải trí, chưa có nhiều doanh nghiệp thấy được nhu cầu cần thiết và nắm được lợi thế của mạng xã hội

1.2 Mục tiêu

Việc ra đời của mạng xã hội đã dẫn đến những động lực phát triển và các mục tiêu mới cho các nhà phát triển ứng dụng cho phù hợp với nhu cầu thực tiễn hiện nay

Mục tiêu của luận văn là nghiên cứu về mạng xã hội Facebook nhằm xây dựng một ứng dụng chạy trên nền Facebook Từ đó có thể cho thấy lợi ích của việc tận dụng tài nguyên sẵn có của một mạng xã hội để quảng bá một thương hiệu nào đó

1.3 Phạm vi đồ án

- Nghiên cứu tìm hiểu những vấn đề về xây dựng ứng dụng trên facebook

- Tìm hiểu các phương pháp xây dựng ứng dụng

- Triển khai demo thực tế một ứng dụng facebook

Chương 2: CƠ SỞ LÝ THUYẾT

- Nghiên cứu tổng quan về Facebook, cách đăng ký và tạo một ứng dụng

- Tìm hiểu các API của Facebook: Graph API, Open Graph, Access token, json, FQL …

Đánh giá rút ra kết luận những mặt đạt được, những mặt chưa đạt được sau đó

đề xuất ra phương án phát triển cho đề tài

CHƯƠNG 2: CƠ SỞ LÝ THUYẾT2.1 Giới thiệu

2.1.1 Tổng quan về Facebook

Facebooklà một websitemạng xã hộitruy cập miễn phí do công ty Facebook, điều hành Người dùng có thể tham gia các mạng lưới được tổ chức theo thành phố, nơi làm việc, trường học và khu vực để liên kết và giao tiếp với người khác Mọi người cũng có thể kết bạn và gửi tin nhắn cho họ, và cập nhật trang hồ sơ cá nhân của mình để thông báo cho bạn bè biết về chúng Tên của website nhắc tới những cuốn sổ lưu niệm dùng để ghi tên những thành viên của cộng đồng campus mà một

số trườngđại họcvàcao đẳngtại Mỹ đưa cho các sinh viên mới vào trường, phòng ban, và nhân viên để có thể làm quen với nhau tại khuôn viên trường

Mark Zuckerbergthành lập Facebook cùng với bạn bè là sinh viên khoakhoa học máy tínhvà bạn cùng phòngEduardo Saverin,Dustin MoskovitzvàChris Hugheskhi Mark còn là sinh viên tạiĐại học Harvard

Việc đăng ký thành viên website ban đầu chỉ giới hạn cho những sinh viên Harvard, nhưng đã được mở rộng sang các trường đại học khác tại khu vựcBoston,Ivy Leaguage vàĐại học Stanford Sau đó nó được mở rộng hơn nữa cho sinh viên thuộc bất kỳ trường đại học nào, rồi đến học sinh phổ thông và cuối cùng là bất cứ ai trên 13 tuổi Website hiện có hơn 500 triệu thành viên tích cực trên khắp thế giới Với con số ấy, Facebook là mạng xã hội phổ biến nhất, tiếp theo sau

làMyspace vàTwitter

Facebook đã gặp phải một số tranh cãi trong những năm qua.Nó đã bị cấm một thời gian tại một số quốc gia, trong đó có Syria, Trung Quốc, Việt Nam và Iran Nó cũng đã bị cấm tại nhiều công sở để hạn chế nhân viên tốn thời gian sử dụng dịch

vụ Quyền riêng tưtrên Facebook cũng là một vấn đề gây nhiều tranh cãi Trang này cũng đang đối mặt với một sốvụ kiệntừ một số bạn cùng lớp của Zuckerberg, những người cho rằng Facebook đã ăn cắp mã nguồn và các tài sản trí tuệ khác của

họ

2.1.2 Các thành phần cơ bản quan trọng của App Facebook

• API: gọi hàm, lấy dữ liệu trả về từ Facebook.

• FBML: Facebook Markup Language, ngôn ngữ mô tả của Facebook, khi

ứng dụng trả về FBML, đi qua Proxy của Facebook, các thẻ fbml sẽ được render để trả về HTML thực cho User

• XFBML: một mở rộng của FBML, sử dụng javascript để render FBML trên

trình duyệt của User, không đi qua proxy

• FQL: Facebook Query Language, lấy dữ liệu sử dụng dạng ngôn ngữ tựa

như SQL query, không cần dùng API Giảm tải lời gọi API, chỉ lấy những gì cần, tránh dùng nhiều round trip (nhiều lần gọi API) để lấy thông tin (cách

dùng tương tự như gọi API vì nó là một hàm API mà, bạn gọi API fql.query

với tham số là query của bạn)

• FBJS: Facebook javascript.

• Canvas Page: là nơi hiển thị chính của ứng dụng, là nơi cho user tương tác

với App của bạn

• Profile Box: ứng dụng của bạn có thể được hiển thị trên trang Profile của

2.1.3.1 Dùng FBML (Facebook Markup Language)

- Dựng trang nhanh, dễ, dùng thẻ của facebook Thể hiện các thành phần cơ bản của Facebook rất đơn giản (chỉ cần ghi thẻ tương ứng là xong)

- URL và kiểm tra xác thực đơn giản

Hình 2.1: FBML 2.1.3.2 Dùng Iframes

Hình 2.2: Iframes

- Linh hoạt vì bản chất là User tương tác với trực tiếp với trang nằm trên hosting của mình

- Chuyển các ứng dụng có sẵn sang dạng Facebook dễ dàng

- Nhanh hơn khi sử dụng, User xem trang không cần qua Proxy của FB để render các thẻ

2.1.3.3 Kết luận

- Nên xài iframe do không phải tái nạp các thành phần topbar, appbar và chatbar của Facebook nhưng vẫn tận dụng được tốt FBML nếu dùng XFBML

- JS của facebook sẽ scan DOM và render lại các thẻ fb trên chính trình duyệt, bớt được các vòng roundtrip trên app server của mình

- Trích xuất được URL trong iframe của chính mình ra trang facebook container (dùng js của facebook trong iframe của mình)

- Nếu đang dùng iframe, có thể chuyển trang thành dạng FBML, sử dụng fb_force_mode

- Có thể dùng HTML đánh dấu và dùng javascript lib của Facebook để có khả năng hiển thị tương tự FBML

2.2 Đăng ký ứng dụng trên Facebook

- Bước 1: Tạo tài trang index.php với nội dung bất kỳ “abc 123”.

- Bước 2: Upload trang vừa tạo lên host và chỉ domain tới host

- Bước 3: Truy cập http://www.facebook.com/ login tài khoản

- Bước 4: Truy cập https://developers.facebook.com/apps chọn Create New

App.

Hình 2.3 : Create new app

- Bước 5: Đặt tên và Namespace cho ứng dụng (Namespace mặc định sẽ là số

Id của App) → Tiếp Tục.

Hình 2.4: Đặt tên app

- Bước 6: Điền mã xác nhận → Gửi.

Hình 2.5: Điền mã xác nhận

- Bước 7: Cấu hình cho ứng dụng vừa tạo:

 Thay đổi icon ứng dụng

 App Domain: Tên domain.

Hình 2.6: App Domain

 Site URL: Đường dẫn tới thư mục chứa ứng dụng

Hình 2.7: Site Url

 Canvas URL: Đường dẫn tới thư mục chứa ứng dụng.

 Secure Canvas URL: đường dẫn tới thư mục chứa ứng dụng hỗ trợ SSL.

Hình 2.8: Canvas và Secure Canvas Url

Nếu host không hổ trợ https thì Secure Canvas URL để trống.

→ Lưu Thay đổi.

Ghi chú: Các URL phải kết thúc bằng ký tự “/”.

2.3 Các API của Facebook

Cú pháp để cấp quyền cho ứng dụng như sau:

• redirect_uri : đường link sẽ kết nối đến sau khi cấp quyền hoàn tất

Kết quả của hàm $facebook→ getLoginUrl($params) sẽ là một liên kết dùng

để đăng nhập và cấp quyền cho ứng dụng

Ví dụ:

Đăng nhập và cấp quyền cho ứng dụng lấy thông tin về ngày sinh của người dùng:

Hình 2.11: Lấy thông tin ngày sinh

Trong đó user_birthday là quyền để truy xuất ngày sinh của người dùng http://test.com/index.php là đường dẫn sẽ trả về sau khi cấp quyền

2.3.2 Các quyền của người dùng

Facebook phân chia các quyền của người dùng thành 5 nhóm chính:

Khi người dùng đăng nhập vào ứng dụng mà ứng dụng không yêu cầu cung cấp

thêm quyền hạn gì thì mặc định ứng dụng sẽ có được quyền Basic Information.

Với quyền này ứng dụng chỉ có thể truy xuất đến những thông tin cơ bản như:

id,name,picture,gender

Ngoài ra cũng có thể truy xuất đến 1 số đối tượng khác như: bạn bè nếu như họ cấu hình public thông tin của họ

2.3.2.2 User and Friend Permissions

Nếu ứng dụng yêu cầu các quyền này như một phần của quá trình xác thực thì người dùng phải cấp các quyền sử dụng để tiếp tục sử dụng ứng dụng

user_about_me friends_about_me

Cung cấp quyền truy cập thông tin About Me

user_activities friends_activities

Cung cấp quyền truy cập vào danh sách các hoat đông

user_birthday friends_birthday

Cung cấp quyền truy cập ngày tháng năm sinh

user_education_history friends_education_history

Cung cấp quyền truy cập danh sách lịch sử học tập

user_events friends_events

Cung cấp quyền truy cập danh sách các sự kiện dang tham dựuser_groups friends_groups

Cung cấp quyền truy cập vào các nhóm mà người dùng đang là thành viên

user_hometown friends_hometown Cung cấp quyền truy cập thông tin quê

hương

user_interests friends_interests Cung cấp quyền truy cập vào danh sách sở

thích của người dùnguser_likes friends_likes

Cung cấp quyền truy cập danh sách các trang mà người dùng

đã likeuser_location friends_location Cung cấp quyền truy cập vị trí của người

dùng

user_photos friends_photos

Cung cấp quyền truy cập vào photo mà người dùng upload hoặc được tags vào

user_questions friends_questions Cung cấp quyền truy cập vào những câu

hỏi của người dùng

user_relationships friends_relationships

Cung cấp quyền truy cập thông tin về gia đình và các mối quan

hệ cá nhân và tình trạng quan hệ của người dùng

user_relationship_details friends_relationship_details

Cung cấp quyền truy cập vào chi tiết thông tin về các mối quan

hệ của người dùnguser_religion_politics friends_religion_politics

Cung cấp quyền truy cập vào thông tin về tôn giáo của người dùng

user_status friends_status

Cung cấp quyền truy cập vào thông tin về trạng thái của người dùng

user_videos friends_videos

Cung cấp quyền truy cập vào video mà người dùng upload hoặc được tags vào

user_website friends_website Cung cấp quyền truy cập vào đường dẫn

website

user_work_history friends_work_history Cung cấp quyền truy cập vào lịch sử làm

việcemail N/A Cung cấp quyền truy cập vào thông tin

email của người dùng

2.3.2.3 Extended Permissions

Nếu sử dụng Extended Permissions Khi được yêu cầu cấp quyền thì quyền

Extended Permissions sẽ được trình bài trên trang thứ hai của hộp thoại yêu cầu

cấp quyền Nếu ứng dụng yêu cầu các quyền này thì người dùng có thể chọn chấp nhận hoặc từ chối một hoặc nhiều trong các quyền được yêu cầu đó

read_friendlists

Cung cấp quyền truy cập vào bất kỳ danh sách bạn

bè của người dùng Tất cả bạn bè của người dùng được cung cấp 1 phần dữ liệu cơ bản Chỉ sử dụng quyền này nếu ứng dụng cần truy cập danh sach bạn bè

read_insights

Cung cấp quyền đọc dữ liệu Insights cho các trang web, các ứng dụng, các domain mà người dùng sở hữu

read_mailbox Cung cấp khả năng đọc hộp thư đến của người dùngread_requests Cung cấp quyền đọc yêu cầu kết bạn của người dùng

read_stream Cung cấp quyền truy cập đến tất cả các News Feed của người sử dụng và cho phép ứng dụng thực hiện

tìm kiếm trong News Feedxmpp_login Cung cấp các ứng dụng tích hợp với Facebook Chat khả năng để đăng nhập người dùngads_management Cung cấp khả năng quảng lý quảng cáo

create_event Cho phép ứng dụng của bạn để tạo và sửa đổi các sự kiện trên danh nghĩa của người dùngmanage_friendlists Cho phép ứng dụng của bạn tạo và chỉnh sửa danh sách bạn bè của người dùngmanage_notifications Cho phép ứng dụng đọc các thông báo của người dùng và dánh dấu là chúng đã được đọc

Cho phép truy cập đến sự hiện diện online/offline

publish_checkins Cho phép ứng dụng của bạn thực hiện checkins nhân danh của người sử dụng

publish_stream

Cho phép ứng dụng đăng nội dung, bình luận, like một kênh của người dùng và của bạn bè của người dùng

Đây là sự cho phép của quyền public bao gồm cả quyền publish_actions

2.3.2.4 Open Graph Permissions

Open Graph permission cho phép ứng dụng của bạn đăng những hoạt động đến Open Graph và cũng để lấy các hành động được xuất bản bởi các ứng dụng khác

Để yêu cầu các điều khoản, phải kích hoạt Enhanced Auth Dialog

Tất cả các quyền Open Graph permissions xuất hiện trên trang đầu tiên của hộp

thoại chứng thực

Tương tự như User and Friend permissions, nếu ứng dụng yêu cầu quyền này,

người dùng cần chấp nhận trước khi sử dụng ứng dụng

User Permission Friends Permission Mô tả

publish_actions N/A

Cung cấp các quyền sau:

• post to the user's feed

• upload photo and videos - including creating an album

• tag photos and videos

• add likes/comments

to storiesuser_actions.music friends_actions.music

Cho phép nhận những hành động được published bởi tất

cả các ứng dụng sử dụng built-in music,listens actionuser_actions.news friends_actions.news

Cho phép nhận những hành động được published bởi tất

cả các ứng dụng sử dụng built-in news.reads action

user_actions.video friends_actions.video

Cho phép nhận những hành động được published bởi tất

cả các ứng dụng sử dụng built-in video,watches action

user_actions:APP_N

AMESPACE friends_actions:APP_NAMESPACE

Cho phép nhận những hành động được published bởi ứng dụng khác theo APP_NAMESPACE

user_games_activity friends_games_activity Cho phép gửi và nhận thành tích của trò chơi

2.3.2.5 Page Permissions

manage_pages Cho phép ứng dụng của bạn lấy access_tokens

cho các trang và ứng dụng mà người dùng quản trị Access_tokens có thể được truy vấn bằng cách gọi / <user_id> / tài khoản thông qua các Graph API Sự cho phép này chỉ tương thích với các Graph API, không bị phản đối từ API REST

2.3.3 JSON

2.3.3.1 Cơ bản về JSON

JSON hay còn gọi là JavaScript Object Notation, là một chuẩn dùng để truyền tải dữ liệu JSON là một dạng văn bản thuần, mô tả về một loại thông tin nào đó mà

"con người" có thể đọc được (human-readability)

JSON cũng như XML, nó chỉ mô tả dữ liệu, không có khả năng trình bày, không có khả năng "chạy", nói chung là thụ động Ta chỉ có thể nhận JSON rồi làm

gì đó, hoặc ta có gì đó rồi chuyển thành JSON để gửi đi, chứ ta không thể "chạy" JSON

2.3.3.2 Cú pháp JSON

• Dấu ngoặc vuông giữ mảng ‘[]’

2.3.3.3 Cặp Tên/Giá trị của JSON

Dữ liệu JSON được viết trong cặp Tên/Giá trị

Một cặp Tên/Giá trị chứa tên một trường (trong dấu nháy đôi “”), theo sau là dấu phẩy, cuối cùng là giá trị

Ví du:

Hình 2.12: Dữ liệu kiểu JSON 2.3.3.4 Các giá trị của JSON

Giá trị (value) JSON có thể là:

- Một số (nguyên (integer) hay số thực (floating point))

- Một chuỗi (nằm trong dấu nháy đôi “”)

- Một số luận lý (true or false)

- Một mảng (nằm trong dấu ngoặc vuông [])

- Một đối tượng (nằm trong dấu ngoặc nhọn {})

- Kiểu null

2.3.3.5 Các đối tượng JSON

Các đối tượng được đặt trong dấu ngoặc nhọn {}

Đối tượng có thể chứa nhiều cặp Tên/Giá trị (Name/Values)

Ví dụ:

Hình 2.13: Đối tượng trong JSON

2.3.3.6 Mảng của JSON

Mảng JSON nằm trong dấu ngoặc vuông []

Một mảng có thể chứa nhiều đối tượng:

Ví dụ:

Dòng đầu tiên trong mảng đối tượng JavaScript có thể được truy cập như sau:

Hình 2.16: Truy xuất đối tượng đầu tiên 2.3.3.8.Ưu điểm

- "Con người" có thể đọc được

- Có liên quan với Javascript nên không xa lạ, dễ học, dễ hiểu

- Dữ liệu truyền tải ngắn gọn (có thể là tiết kiệm nhất) so với những định dạng

- json_decode($arrayPhp) : để chuyển đổi từ dạng JSON sang object.

Ví dụ 1:

Tạo mảng dữ liệu $arrayPhp.Chuyển đổi mảng này thành dạng JSON

Hình 2.17: Tạo mảng dữ liệu $sarrayPhp

Access_token có thể được hiểu như một giấy phép mà facebook cung cấp dùng

để truy xuất đến thông tin của người dùng thông qua Graph API Một Access_token

không có hiệu lực mãi mãi mà chỉ giới hạn trong một khoảng thời gian nhất định do facebook quy định Thời gian cho mỗi access_token phụ thuộc vào các quyền hạn của access_token đó.

Khi hết thời hạn của một access_token thì access_token đó không còn hiệu lực Khi đó nều muốn tiếp tục truy xuất dữ liệu ta phải yêu cầu facebook cấp một access_token mới

Một access_token có thể không còn hiệu lực trong khi vẫn chưa hết thời gian tồn tại cho access_token đó trong trường hợp xảy ra các sự kiện như: thay đổi mật khẩu, chứng thực ứng dụng, thay đổi app_secret

Để lấy được access_token của người dùng hiện hành ta sử dụng cú pháp:

Hình 2.21: Access token

2.3.5 Graph API

2.3.5.1 Truy xuất thông tin cơ bản

Với những thông tin cơ bản facebook cho phép ta truy cập mà không cần đến access_token

- Photo albums: https://graph.facebook.com/ID_ALBUM

- Profile pictures: http://graph.facebook.com/ID/picture

- Videos: https://graph.facebook.com/ID_VIDEO

- Notes: https://graph.facebook.com/ID_NOTES

- Checkins: https://graph.facebook.com/ID_CHECKINS

Ví dụ:

Với biến $json dùng để chứa chuỗi JSON trả về từ hàm file_get_contents

- Bước 2: Chuyển chuổi JSON về ARRAY

Sử dụng hàm json_decode

Hình 2.27: Chuyển đổi JSON về ARRAY

Ví dụ: Lấy thông tin cơ bản của btaylor sử dụng Graph API và xuất thông tin này ra màn hình

Hình 2.28: Ví dụ dùng Graph API

Kết quả

Hình 2.29: Kết quả dùng Graph API

2.3.5.2 Truy xuất Hình ảnh

- Ảnh của một đối tượng không là photo:

Nếu ta sử dụng ID là ID user hay ID page hoặc một đối tượng không phải photo thì kết quả sẽ trả về là ảnh đại diện của đối tượng đó

Ví dụ ta lấy ảnh của đối tượng page có id: 40796308305 (fanpage: Coca-cola)

Hình 2.30: Cú pháp truy xuất đối tượng không là photo

Theo mặc định kết quả trả về sẽ là ảnh có kích thước nhỏ nhất: 50px * 50px

Ta có thể qui định kích thước trả về cho ảnh bằng cách sử dụng tham số type.

Hình 2.31: Truy xuất hình ảnh dùng tham số type

Facebook cho ta 4 loại kích thước sau:

Square: ảnh có kích thước 50px * 50px.

Small: ảnh có kích thước rộng 50px, chiều cao thay đổi theo tỷ lệ ảnh.

Normal: ảnh có kích thước rộng 100px, chiều cao thay đổi theo tỷ lệ ảnh Large: ảnh có kích thước rộng 200px, chiều cao thay đổi theo tỷ lệ ảnh.

Ví dụ: Ta lấy ảnh có kích thước loại large

Ví dụ ta lấy và lưu ảnh có id: 40796308305 và lưu vào thư mục images nằm

trong thư mục hiện hành

Hình 2.35: Ví dụ lưu ảnh lấy về

- Ảnh của một đối tượng photo

Ta có thể lấy được ảnh của 1 đối tượng photo bất kỳ bằng cách thêm vào hậu tố

/picture

Cú pháp: