Hướng dẫn tạo app Facebook sử dụng PHP trên host Heroku toàn tập

Hướng dẫn tạo app Facebook sử dụng PHP trên host Heroku toàn tập

Việc tạo và chạy 1 ứng dụng facebook trước kia lằng nhằng và có 2 cách là Dùng FBML (ngôn ngữ do facebook sáng chế ) và iframe.

Bây h facebook đã không hỗ trợ cho FBML, nghe nói cũ rồi ,1 vài ứng dụng facebook viết bằng FBML vì thế cũng chết theo ,1 vài ebook hướng dẫn làm ứng dụng cho facebook cũng không thể làm theo

Để tạo 1 ứng dụng vui trên facebook chia sẻ cùng bạn bè ,bây h không mất quá nhiều thời gian và dễ dàng hơn bao h hết .

  • 1-Host free Heroku – cái này quá tuyệt luôn ( trước kia thì mệt lắm dùng localhost chạy qua chạy lại up lên tải xuống )
  • 2-Heroku giúp ta phần kết nối – tạo sẵn luôn cho bạn 1 class kết nối với facebook (ngon rồi)
  • 3-Đỡ phải config lằng nhằng nào là canvas, iframe, hay fbml ,php sdk hay javascript sdk…..

Bắt tay vào làm 1 app facebook nào:

B1:

Vô đây để đăng ký tên cho 1 app đã https://developers.facebook.com/apps sau đó click Create New App:

Create new app button

Create new app button

- Nếu ai đã từng tạo facebook sẽ có hình:

Create app facebook

Create app facebook

Sau khi click ta thấy hộp thoại sẽ hiện ra:

Creat app form

Creat app form

Chọn tên app ở đây , shi chọn Qrcode ,hay gì đó tùy bạn chọn cho hợp tên ứng dụng của bạn .
** chú ý tick vào web hosting : nhà nghèo nên dùng host heroku (biết dùng thì cực thích luôn) tiện mà free -ở đây ta đang làm trên heroku mà .
ok xong chọn continue

Nhập mã xác nhận

Nhập mã xác nhận

Gõ mã xác nhận tránh spam của facebook nhảy qua bước kế nào

Heroku PHP

Heroku PHP

Chọn ngôn ngữ ở đây là PHP và email đăng ký ở heroku (đăng ký tài khỏan mới trên web heroku) là như trên

Đăng ký Heroku thành công

Đăng ký Heroku thành công

khi nhận được thông báo như trên là xong – chúc mừng bạn đã xong bước 1

B2:

vô ứng dụng vừa tạo để kiểm tra khi các thông số :
ở website -> site URL , canvas URL , secure Canvas URL, Canvas Page … tự heroku sẽ tạo và kết nối đến facebook . khi thấy các thông số trên là đã thành công 1/2 Bước 2

Cài đặt thông tin ứng dụng FB

Cài đặt thông tin ứng dụng FB

kiểm tra host heroku đã config chưa bằng cách
gõ địa chỉ http://blooming-meadow-5451-herokuapp.com

Kiểm tra host hoạt động chưa

Kiểm tra host hoạt động chưa

ra được hình trên là ổn

B3:

down soft heroku tool hỗ trợ cho việc up hay thay đổi file trên server (host) heroku
http://devcenter.heroku.com/articles/quickstart – vô đây để download Heroku Toolbelt
sau khi tải và chạy màn hình dos heroku- đăng nhập bằng email + pass đã tạo
** khi nhập pass nó sẽ không hiện gì kể cả ký tự *** thường thấy , vì vậy cứ nhập cho đúng là ok

$ heroku loginEnter your Heroku credentials.Email: [email protected]: Could not find an existing public key.Would you like to generate one? [Yn] Generating new SSH public key.Uploading ssh public key /Users/adam/.ssh/id_rsa.pub

B4 :

chỉnh sửa tạo ứng dụng trên máy tính của mình
mở màn hình dos của heroku gõ
$ cd trở về mục chính
rồi gõ tiếp

$ git clone [email protected]:blooming-meadow-5451.git -o heroku

Sử dụng Heroku Toolbelt

Sử dụng Heroku Toolbelt

trong đó
blooming-meadow-5451 là url https://blooming-meadow-5451.herokuapp.com
mà ta heroku đã tạo ra

$ git clone [email protected]:blooming-meadow-5451.git -o herokuInitialized empty Git repository in /Users/adam/facebook-template-php/.git/remote: Counting objects: 273, done.remote: Compressing objects: 100% (183/183), done.remote: Total 273 (delta 2), reused 261 (delta 0)Receiving objects: 100% (273/273), 25.55 KiB, done.Resolving deltas: 100% (2/2), done.
nếu hiện ra tình trạng xử lý như trên là đã thành công không thì vàođây xem thêm
mở file trong máy tính tại C:\Documents and Settings\Tên user máy tính của bạn
nếu thấy xuất hiện folder “blooming-meadow-5451″ là thành công

Đồng bộ file về máy tính

Đồng bộ file về máy tính

B5 :

chỉnh sửa code : thử tý xem sao
dùng notepad , DW hay notepad++ để sửa file index.php
tìm dòng chữ

Welcome to your Facebook app, running on heroku!

thay thế thử bằng

This is my app, I can edit it all I want.

save file lại

B6:

upload để thay đổi trên server
Có 2 cách :
A -1 trên màn hình dos heroku bằng 2 lệnh

$ git commit -am “ghi chú” A-2 gửi 1 commit đến server để ghi chú ( mỗi lần gửi 1 commit là 1 ghi chú khác nhau – lần sau khác lần trước )
$git push heroku master
lệnh để đẩy code lên server
B cách 2 dễ hơn nhiều vì dùng chuột click click thôi – cá nhân mình thích cách này trực quan hơn .
chuột phải vào file index.php trong thư mục “blooming-meadow-5451″

Upload file chỉnh sửa lên host

Upload file chỉnh sửa lên host

sẽ ra giao diện quản lý

Git gui

Git gui

làm lần lượt
1- click recan : quét thay đổi
2- click stage changed : thay đổi
3- gõ vào commit message từ gì đó ví dụ ” 1″ (lần thay đổi sau thì gõ từ khác)
4 click commit

Push heroku

Push heroku

5 click push ra giao diện push gui
6- click tiếp push – đợi push xong

Push success heroku

Push success heroku

ra được hình tương tự như trên là bạn đã thành công rồi .
1 vài ứng dụng facebook dùng heroku đã làm

https://apps.facebook.com/ten-tieng-han/

https://apps.facebook.com/thinh-thay/

https://apps.facebook.com/bach-tuoc/

https://apps.facebook.com/maqrcode/

và đây là link download app mẫu facebook thỉnh thầy – Tải file morning-rain-1242
** down về giải nén ,nhưng đừng copy nguyên tất cả file trong thư mục morning-rain-1242 vào thư mục heroku đã tạo ra trên máy bạn , nó sẽ lỗi đó , chỉ copy file những file
1- index.php
2-,java.js.php
3-và thư mục ảnh img
vào thư mục mà host heroku đã tạo ra trên máy bạn nhé
tha hồ mà test nhé

Hướng dẫn tạo app Facebook sử dụng PHP trên host Heroku toàn tập

app facebook

chúc bạn thành công

Bạn thấy bài viết này như thế nào?: 
No votes yet
Ảnh của Khanh Hoang

Khanh Hoang - Kenn

Kenn is a user experience designer and front end developer who enjoys creating beautiful and usable web and mobile experiences.

Advertisement

 

jobsora

Dich vu khu trung tphcm

Dich vu diet chuot tphcm

Dich vu diet con trung

Quảng Cáo Bài Viết

 
Float, Decimal or Integer trong Drupal Fields?

Float, Decimal or Integer trong Drupal Fields?

Drupal comes with 13 fields and several of them deal with numbers.

iPad 3 chính là iPad 2S?

iPad 3 chính là iPad 2S?

Hãng sản xuất phụ kiện Trung Quốc Chinee vừa đăng tải hình ảnh của chiếc vỏ bảo vệ (case) được thiết kế cho thiết bị có tên iPad 2S

Hướng dẫn tạo Calendar không sử dụng Views trong Drupal 7

Hướng dẫn tạo Calendar không sử dụng Views trong Drupal 7

Recently I needed to create a calendar view of nodes that had a date field (with start/end dates). After researching my options, I came to the conclusion that I had the following choices:

Công ty diệt chuột T&C

 

Diet con trung