Home » Facebook應用程式

【Facebook應用程式開發教學2】用Ruby on Rails輕鬆開發第一支App,傻瓜入門術!

Sting Tao 28 November 2009 1,620 次閱讀 View Comments

照目前官方支援的情況來看,用php來寫facebook的應用應該是首選,但如果想用ruby on rails寫,也不是不行。這篇文章就拿ruby on rails來介紹fb ap的寫法,並整合正ㄏㄤ的Heroku hosting,如何在四個小時內,無成本的建立出你的facebook ap。

在本篇文章中,一般性的facebook ap注意事項請參考前一篇,本篇只針對ruby on rails特定的部分做介紹。一樣,拿已經寫過的"朋友點點名"為例,來介紹怎麼入手。

ask_friends

0.  首先,還是玩一下"朋友點點名"這個應用!瞭解一下他做了甚麼事情。

1.  介紹一下"朋友點點名"的流程:

首先確認是否授權"朋友點點名"存取你的facebook資料。

授權後,facebook會問你,想取得"自動發佈wall”的權限。

接下來,系統自動選一個你的朋友,顯示他的圖片,並且自動問你一個問題,你需要輸入你的答案。

回答後,你的回答就自動發佈到該朋友的wall上面了。

這裡牽涉到的部分比php寫的那支較多,底下開始快速的介紹:

3. 安裝facebooker plugin

開一個rails專案

rails testproject

在你的rails專案裡,安裝facebooker plugin

cd testproject
script/plugin install git://github.com/mmangino/facebooker.git

4. 建立heroku帳號與環境

首先,先到 http://www.heroku.com 申請一個帳號

確定申請好了之後,在你的linux環境中,用root執行

gem install heroku  //這樣就可以使用heroku相關指令,遠端管理操作

heroku create testproject //建立heroku上的一個ror執行專案,會問你Heroku credentials,輸入你剛建立的heroku帳號的email跟密碼,這樣就可以建立完成。本例子中, testproject是專案名稱。

上述步驟如果成功完成,畫面上會吐出一串字,類似:

        Created http://testproject.heroku.com/ | git@heroku.com:testproject.git

其中,http://testproject.heroku.com/就是你的網站網址!對於小程式來說,你連domain name都不用申請就可以把ap放到facebook上了。而git@heroku.com:testproject.git這行就是 heroku上幫你開的source code存放的地方了。

接下來,我們把剛剛產生的rails 專案都放上去吧!

前提是,你得會用git,而且有安裝了git。本篇就不描述相關安裝方法。

在testproject rails專案的目錄中

git init
git add .
git commit -m "the first time"
git push git@heroku.com:testproject.git master

至此,你會看到類似這樣的訊息:

Counting objects: 62, done.
Compressing objects: 100% (55/55), done.
Writing objects: 100% (62/62), 79.37 KiB, done.
Total 62 (delta 10), reused 0 (delta 0)

-----> Heroku receiving push
-----> Rails app detected
Compiled slug size is 80K
-----> Launching....... done
http://testproject.heroku.com deployed to Heroku

To git@heroku.com:testproject.git
* [new branch]      master -> master

那麼,看一下http://testproject.heroku.com,就看到了最基本的ruby on rails  server已經跑起來了!你有了一個server可以用了!

當然,這樣的使用只能作為實驗等級,大規模運用還須對heroku有進一步的瞭解,並且需要$$。但是我們現在可以用這個免費的資源來做點有趣的事情吧。

5. 到facebook上面建立一個新程式,拿到api key等資料,修改config/facebooker.yml

當裝了facebooker plugin後,專案的config目錄會多一個facebooker.yml的檔案,修改其中 production:的段落

最重要的只有三行

api_key: 填入吧
secret_key: 填入吧!
canvas_page_name: /

這樣,準備工作差不多完成了,底下開始寫facebook相關的程式碼了!

6.  讓使用者授權testproject可以存取facebook上他的資料

在controller裡面加上這兩行

ensure_application_is_installed_by_facebook_user
filter_parameter_logging :fb_sig_friends

7. 隨機挑選朋友

在controller裡面,寫這行。那麼@friends這個 array就是你所有朋友打亂排序的結果。

@friends= (facebook_session.user.friends.sort_by {rand})

8. 顯示朋友圖片

在view裡面,這樣寫:

<fb:profile-pic uid="<%=@friends[0].uid%>" size="normal" />

9. 要求同意自動publish到wall的權限

在view裡面,加上

<script>
Facebook.showPermissionDialog('publish_stream');
</script>

至於跳出一個視窗說要 publish 感想到朋友的 wall上的寫法,請參閱php那篇

10. 重新上傳code到heroku去

專案根目錄下,執行

git add .
git commit -m "the first time"
git push git@heroku.com:testproject.git master

看到server重新啟動之後,連到你的facebook app試試看囉! http://apps.facebook.com/ask_friend/

11. 遇到問題!

執行的時候難免遇到問題,想查 log的話,打

heroku logs --app testproject  //把testproject 換成你的heroku project名稱

以上,快樂的開始寫facebook ap吧~如果有問題,也歡迎留言討論,教學相長。

Related Posts with Thumbnails
Line Break

關於作者: Sting Tao (90 篇文章)

陶韻智,待過IBM與NHN。 關注數位趨勢、網路發展與攀岩。一半的時間在台北,一半的時間在矽谷。 歡迎來信 stingtao@gmail.com

  • jeff
    請問有沒有興趣共同開發FaceBook的遊戲?
    目前我有個新型態的遊戲構想,希望能實現。
  • Sting
    Hi,
    很高興您有這個新型態的構想,若想的很完整,我們可以喝個咖啡聊一下先。請mail給 stingtao at gmail.com私底下約一下。謝謝~~
blog comments powered by Disqus