Phone gap Facebook plugin一直要求重新登入，怎麼辦？
| category 行動開發 | 尚無留言
PhoneGap是一個讓你可以在行動裝置上能夠以HTML/CSS/JS開發的框架。支援了包括iOS，Android，Windows Mobile，甚至是BlackBerry等。但是如果你真的天真的相信它真的能夠達到跨平台的話，我大概只能祝你好運。首先Native Code的部分勢必是需要重寫的。再來每個平台的瀏覽器支援JS/CSS的程度也不同，所以光是跨iOS與Android就會有很大的問題了。更別說還要考慮Android上各種螢幕尺寸的問題。
我之所以用了PhoneGap的唯一原因是因為可以快速的實作出想要的App樣子。在有限的時間內要在單一平台上開發出一個完整App，這還是一個值得考慮的Solution。
但這裡沒有要寫教學文，網路上應該已經很多了，不過要小心的是大部分都是舊版的。PhoneGap從1.3之後有很大的改變，因此要特別小心你看的Tutorial文章用的是哪一個版本。
這裡其實是要抱怨Dave Johnson, Nitobi CTO釋放的Facebook Plugin有一個很基本但是卻很重大的問題。那就是登入過後的session cache處理有問題啊，這會導致每次app開起來都必須重新做一次facebook登入認證，然後導致很差的使用者經驗。
在罵之前還是要先說一下好話，Dave Johnson包裝的版本已經可以幫很多人省下很多的功了，只是還是不太應該埋下這個bug啊。
以下是pg-plugin-fb-connect.js中完整的source code：
PG = ( typeof PG == "undefined" ? {} : PG );
PG.FB = {
init: function(apiKey, fail) {
// create the fb-root element if it doesn"t exist
if (!document.getElementById("fb-root")) {
var elem = document.createElement("div");
elem.id = "fb-root";
document.body.appendChild(elem);
}
PhoneGap.exec(function() {
var session = JSON.parse(localStorage.getItem("pg_fb_session") || "{"expires":0}");
if (session && session.expires > new Date().valueOf()) {
FB.Auth.setSession(session, "connected");
}
console.log("PhoneGap Facebook Connect plugin initialized successfully.");
}, (fail?fail:null), "com.phonegap.facebook.Connect", "init", [apiKey]);
},
login: function(params, cb, fail) {
params = params || { perms: "" };
PhoneGap.exec(function(e) { // login
localStorage.setItem("pg_fb_session", JSON.stringify(e.session));
FB.Auth.setSession(e.session, "connected");
if (cb) cb(e);
}, (fail?fail:null), "com.phonegap.facebook.Connect", "login", params.perms.split(",") );
},
logout: function(cb, fail) {
PhoneGap.exec(function(e) {
localStorage.removeItem("pg_fb_session");
FB.Auth.setSession(null, "notConnected");
if (cb) cb(e);
}, (fail?fail:null), "com.phonegap.facebook.Connect", "logout", []);
},
getLoginStatus: function(cb, fail) {
PhoneGap.exec(function(e) {
if (cb) cb(e);
}, (fail?fail:null), "com.phonegap.facebook.Connect", "getLoginStatus", []);
}
};
主要的問題就在標紅字的session.expires > new Date().valueof()那裡。
這邊的流程是每次App開起來會call init，然後如果call login去做Facebook OAuth，之後會把Facebook傳回的session存到瀏覽器的local storage。所以下一次App打開的時候在init的地方就會嘗試用之前存下的session去做初始化的動作。而問題就在這，每次在紅字這一行的condition check都是false啊。原因就在session.expires是日期字串，而new Date().valueof()是數值啊。剛剛又到GitHub上看了一下，還是沒人改掉。看來晚一點要來Push一個版本上去。
修掉這個問題的方法很簡單，只要用Date Object去parse session.expires轉成timestamp之後再做condition checking就可以了。
如下修正：
var eventStamp = Date.parse(session.expires);
if (eventStamp = new Date().valueOf())
—
Kenny Lee
我是 K，以前幻想著可以做些偉大的事。但發現把一件簡單的事情做到很好就是一件很難又很厲害的事。所以現在正處於一個把簡單的事情做好的狀態。
