在heroku的app中整合FB或google帳號

首先要先了解heroku新增app的整個流程

再來要了解FB新建app認證的流程，強烈建議參考以下教學：

建置一個支援google、Facebook帳號可登錄的MVC5應用程式

有一步"Valid OAuth redirect URIs"是最重要的，這最後我們再談，詳細說明在官方網頁：

Lock Down Your Facebook App Settings

以現成的登入套件為例：

https://github.com/jaredhanson/passport-facebook

把它的登入範例抓下來，之後有三個檔案要新增/修改：

(參考 Hosting a Node app on Heroku , How to Deploy a Node.js App to Heroku )

1. 新增檔案Procfile，告訴 heroku 如何啟動，內容就一行：web: node web.js
2. 本地端環境設定，新增檔案.env，告訴 heroku 要開那個port，內容就一行：PORT=80。遠端環境設定，命令列下執行 heroku config:set PORT=80
3. 改 app.js 中的對應內容，callbackURL 中的主機要改成app的網址，FACEBOOK_APP_ID / FACEBOOK_APP_SECRET 要改成FB給你的值；最重要的是，app.listen 那行要改成 app.listen(process.env.PORT); 沒改的話 APP 啟動都會逾時

這樣就成功了嗎?不，登入鍵按下後會出現以下錯誤訊息：

應用程式的設定不接受這個網址。: 應用程式的設定不接受所提供之一或多個網址。網址必須符合網站網址或畫布（Canvas）應用程式網址；或者，網域必須是應用程式網域的子網域之一

這就是魔鬼中的細節啦，請把 app.js 中的 callbackURL 回填到FB的"Valid OAuth redirect URIs" 並儲存，之後就OK了