|
Lập tŕnh viết ứng dụng Facebook
1 Attachment(s)
Cảm giác của bạn thế nào khi nh́n thấy được “thành phẩm” của ḿnh trên Facebook? Bài viết sẽ gợi ư cho bạn cách tạo một ứng dụng nhỏ trên Facebook. Hiện tại, theo thống kê danh mục ứng dụng của Facebook có chứa khoảng hơn 550.000 ứng dụng. Bạn muốn “nhúng” những bài tŕnh bày trong hồ sơ Facebook của ḿnh hay muốn chia sẻ những quyển sách và bộ phim yêu thích với bạn bè, hay chỉ muốn chơi một số tṛ chơi với những thành viên "không quen" khác trên Facebook. Tất cả điều nói trên sẽ được các ứng dụng hiện có trên Facebook đáp ứng cho bạn. Tuy nhiên, nếu bạn không thích dùng những ứng dụng được “dọn sẵn” và không muốn nh́n thấy những thương hiệu của hăng thứ 3 hay các mẫu quảng cáo, th́ bạn có thể tự phát triển ứng dụng Facebook theo cách riêng.
Dưới đây sẽ là một số bước để giúp bạn tạo ra ứng dụng nhỏ trên Facebook theo ư muốn; đây chỉ là những ví dụ đơn giản về viết ứng dụng Facebook dùng code HTML và ASP.Net. Để viết ứng dụng Facebook, bạn cần một số kiến thức về các ngôn ngữ lập tŕnh web và cần biết một số máy chủ (web server) cho phép bạn có thể đặt ứng dụng Facebook lên đó. 1. Ứng dụng Facebook dùng code HTML <table align="left" border="0" cellpadding="0" cellspacing="1" width="190"><tbody>< tr><td>  </td></tr></tbody></table>Bước 1: Giả sử bạn đă có tài khoản trên Facebook, thêm ứng dụng Developer (https://www.facebook.com/developers/) vào hồ sơ Facebook của bạn, sau đó nhấn “Set Up New App”.<table align="right" border="0" cellpadding="0" cellspacing="1" width="190"><tbody>< tr><td align="right">  </td></tr></tbody></table>Bước 2: Bạn đặt tên cho ứng dụng Facebook, đồng ư với những điều khoản trên Facebook. Tiếp tục nhập mă bảo vệ, sau đó bạn có thể tải lên một số h́nh ảnh để chọn làm biểu tượng (logo) cho ứng dụng của bạn. <table align="left" border="0" cellpadding="0" cellspacing="1" width="190"><tbody>< tr><td>  </td></tr></tbody></table>Bước 3: Bạn có thể dùng công cụ tŕnh biên tập WYSIWYG HTML hay notepad, để ghi nội dung bạn muốn hiển thị bên trong ứng dụng Facebook. Trong ví dụ này sẽ thiết lập ứng dụng máy tính điện tử (calculator).<html> <head> <title>PC World VN Calculator by JavaScript</title> <script type="text/javascript" src="calculate.js"></script> </head> <body> <table align="right" border="0" cellpadding="0" cellspacing="1" width="190"><tbody>< tr><td align="right">  </td></tr></tbody></table><h1>PC World VN Calculator by JavaScript</h1><form name="calculator"><table border="0" cellpadding="2" cellspacing="0" background="/images/background.jpg" width="233" height="259"> <tr><td align="center" style="padding-bottom:0px;padding-top:15px"><input type="text" name="win" value="0" style="height:30px;w idth:190px;text-align:right;font-size:20px;font-weight:bold;border:1 px solid #666666;padding-right:2px;" maxlength='15'></td></tr> <tr><td> <table border="0" cellpadding="5" cellspacing="1" align="center"> <tr><td style="padding-top:0px"><input type="button" value="CE" style="width:40px" onClick="calc('CE')" ></td> <td style="padding-top:0px"><input type="button" value="C" style="width:40px" onClick="calc('C')"> </td> <td style="padding-top:0px"><input type="button" value="+/-" style="width:40px" onClick="calc('+/-')"></td> <td style="padding-top:0px"><input type="button" value="%" style="width:40px" onClick="calc('%')"> </td></tr> <tr><td><input type="button" value="7" style="width:40px" onClick="calc('7')"> </td> <td><input type="button" value="8" style="width:40px" onClick="calc('8')"> </td> <td><input type="button" value="9" style="width:40px" onClick="calc('9')"> </td> <td><input type="button" value="/" style="width:40px" onClick="calc('/')"></td></tr> <tr><td><input type="button" value="4" style="width:40px" onClick="calc('4')"> </td> <td><input type="button" value="5" style="width:40px" onClick="calc('5')"> </td> <td><input type="button" value="6" style="width:40px" onClick="calc('6')"> </td> <td><input type="button" value="x" style="width:40px" onClick="calc('*')"> </td></tr> <tr><td><input type="button" value="1" style="width:40px" onClick="calc('1')"> </td> <td><input type="button" value="2" style="width:40px" onClick="calc('2')"> </td> <td><input type="button" value="3" style="width:40px" onClick="calc('3')"> </td> <td><input type="button" value="-" style="width:40px" onClick="calc('-')"></td></tr> <table align="left" border="0" cellpadding="0" cellspacing="1" width="190"><tbody>< tr><td>  </td></tr></tbody></table><tr><td><input type="button" value="0" style="width:40px" onClick="calc('0')"> </td><td><input type="button" value="." style="width:40px" onClick="calc('.')"> </td> <td><input type="button" value="=" style="width:40px" onClick="calc('=')"> </td> <td><input type="button" value="+" style="width:40px" onClick="calc('+')"> </td></tr> </table> </td></tr> </table> </form></body> </html> <table align="right" border="0" cellpadding="0" cellspacing="1" width="190"><tbody>< tr><td align="right">  </td></tr></tbody></table>Bước 4: Truy cập máy chủ web của bạn, tạo một thư mục con gọi là “facebook” và tải lên file code (index.php hay index.html) mà bạn đă tạo ở trên. Trong trường hợp này, ứng dụng được đặt trên máy chủ web www.thegioigame.vn.< table align="left" border="0" cellpadding="0" cellspacing="1" width="190"><tbody>< tr><td> </td></tr></tbody></table>Cavas Page: là đường dẫn URL cho ứng dụng (http://apps.facebook.com/tgvt_fb_app/).Canvas URL: là nơi đặt dịch vụ web (web service) để lưu trữ ứng dụng sẽ được liên kết với Facebook (http://www.thegioigame.vn/facebook).Hoàn tất xong bạn nhớ lưu lại các thao tác vừa làm. Bạn hăy quan tâm đến 2 khóa: API Key và App Secret, 2 khóa này cần khai báo trong ứng dụng khi có truy cập thư viện (API) của Facebook. <table align="right" border="0" cellpadding="0" cellspacing="1" width="190"><tbody>< tr><td align="right">  </td></tr></tbody></table>Bước 5: Thành quả cuối cùng của bạn. Đó chính là ứng dụng của riêng bạn hiện đă có mặt trên Facebook.<table align="left" border="0" cellpadding="0" cellspacing="1" width="190"><tbody>< tr><td> </td></tr></tbody></table>Qua 5 bước này sẽ giúp bạn phần nào h́nh dung ra cách thức tạo một ứng dụng đơn giản trên Facebook. Các bạn cũng có thể tự tạo những ứng dụng khác theo sở thích và nhu cầu của riêng ḿnh.Từ ứng dụng đơn giản này, bạn cũng có thể xây dựng các ứng dụng có mức độ phức tạp hơn, chẳng hạn có kèm thêm RSS để cập nhật tin tức, chèn thêm các đoạn video clip… Hy vọng các bạn sẽ tạo được nhiều ứng dụng bổ ích và hữu dụng để chia sẻ cùng với bạn bè.<table align="right" border="0" cellpadding="0" cellspacing="1" width="190"><tbody>< tr><td align="right">  </td></tr></tbody></table>2. Ứng dụng Facebook với ASP.NetBước 1:<table align="left" border="0" cellpadding="0" cellspacing="1" width="190"><tbody>< tr><td>  </td></tr></tbody></table>Đăng nhập vào facebook: https://www.facebook.com/ Vào phần phát triển ứng dụng: https://www.facebook.com/developers/ , nhấn nút “Set Up New App” để tạo ứng dụng mới.Bước 2: Điền tên ứng dụng và chọn đồng ư, nhấn nút khởi tạo. Nhập mă xác nhận rồi submit. <table align="right" border="0" cellpadding="0" cellspacing="1" width="190"><tbody>< tr><td align="right">  </td></tr></tbody></table>Bước 3: Tab About: Có thể mô tả ứng dụng trong phần Description, chọn icon, logo cho ứng dụng… <table align="left" border="0" cellpadding="0" cellspacing="1" width="190"><tbody>< tr><td>  </td></tr></tbody></table>Tab Facebook IntegrationApplicati on ID và Application Secret là 2 key của ứng dụng cho phép ta viết code truy xuất thông tin.Canvas Page là trang ứng dụng facebook. Canvas URL sẽ là trang ASP.Net mà ta viết code truy xuất thông tin. <table align="right" border="0" cellpadding="0" cellspacing="1" width="190"><tbody>< tr><td align="right">  </td></tr></tbody></table>Trong ví dụ này, mă lệnh (code) sẽ được đưa lên 1 host free http://phuonglam.somee.com. Các bạn có thể vào trang http://somee.com/ để đăng kư 1 host free để sử dụng, trang này hỗ trợ khá tốt ASP.Net tất cả framework, tuy nhiên trang hiển thị sẽ bị phần quảng cáo ở phía trên và dưới (chịu thôi, đồ “chùa” mà).Hoàn tất, nhấn Save Changes <table align="left" border="0" cellpadding="0" cellspacing="1" width="190"><tbody>< tr><td>  </td></tr></tbody></table>Đường dẫn của ứng dụng sẽ là: http://apps.facebook.com/pcwsample/Bước 4: Download Starter Kit tích hợp vào Visual Studio. Cài đặt Starter kit: <table align="right" border="0" cellpadding="0" cellspacing="1" width="190"><tbody>< tr><td align="right">  </td></tr></tbody></table>Bước 5:Khởi chạy Visual Studio tạo website. Chọn Facebook Starter Kit v2.1 Bước 6: <table align="left" border="0" cellpadding="0" cellspacing="1" width="190"><tbody>< tr><td>  </td></tr></tbody></table>Code; chỉnh tập tin web.config các “key” cho đúng với ứng dụng Facebook đă tạo ban đầu.Starter Kit sẽ tự tạo cho chúng ta trang Default.aspx có nội dung như h́nh vẽ: Ghi chú <table align="right" border="0" cellpadding="0" cellspacing="1" width="190"><tbody>< tr><td align="right">  </td></tr></tbody></table>Image1 hiện thị h́nh ảnh của người tạo ứng dụng.Control FriendList1 sẽ liệt kê h́nh bạn bè của người tạo ứng dụng.DropDownList1 thay đổi sẽ làm thay đổi Image2 hiển thị h́nh ảnh bạn trong danh sách bạn bè friend list. Bước 7: Đưa website lên host free đă tạo. <table align="left" border="0" cellpadding="0" cellspacing="1" width="190"><tbody>< tr><td>  </td></tr></tbody></table>Bước 8:Chạy ứng dụng facebook: http://apps.facebook.com/pcwsample/ Hộp thoại Request for Permission hiện ra, chọn Allow. Kết quả cuối cùng: Chúc các bạn thành công! cnet |
| All times are GMT. The time now is 03:57. |
VietBF - Vietnamese Best Forum Copyright ©2005 - 2025
User Alert System provided by
Advanced User Tagging (Pro) -
vBulletin Mods & Addons Copyright © 2025 DragonByte Technologies Ltd.