微信小程序session管理
最近微信小程序開發很火。我們的移動端項目也開始使用小程序來實現，在這之前我們已經基于Html5實現了類似于小程序的應用。了解了小程序開發后覺得有很多相似之處，還是要用到js和css這些技術。但也有許多不同，jquery等這些js庫不能直接使用了、http session也不支持、頁面發起http請求小程序有自己的api。
對于我們項目來說就不只是簡單的將H5頁面翻譯成小程序的頁面這么簡單了。首先要解決的問題就是http session。在H5項目中，使用http session來關聯微信openid這樣每次http請求都能確定是哪個用戶發起的請求。如果熟悉http session的原理，session問題就好解決了。常見的session保持方式是，當瀏覽器向服務端發起http請求時，服務端檢查在http 頭部cookie參數里是否包含sessionid，如果有sessionid就根據sessionid去查看存儲在服務器端的session，session里保存的當前會話的一些信息。如果sessionid沒有服務端就會分配一個，寫到cookie字段里，瀏覽器下次發起其它請求的時候帶上。而在小程序里所有的請求都通過wx.request API來發起的。如果對wx.request API包裝一下，使其每次向服務端發起請求時也添加一個名稱為Cookie的http header，這樣也不用對服務端作改動。服務端分配的sessionid使用wx.setStorageSync API存儲在微信客戶端。
1、客戶端實現
客戶端代碼目錄smallapp-session/views，客戶端主要實現對wx.request的封裝，在wafer-client-demo項目的基礎上作了一些修改。
wx.request封裝
-
最近微信小程序開發很火。我們的移動端項目也開始使用小程序來實現，在這之前我們已經基于Html5實現了類似于小程序的應用。了解了小程序開發后覺得有很多相似之處，還是要用到js和css這些技術。但也有許多不同，jquery等這些js庫不能直接使用了、http session也不支持、頁面發起http請求小程序有自己的api。 對于我們項目來說就不只是簡單的將H5頁面翻譯成小程序的頁面這么簡單了。首先要解決的問題就是http session。在H5項目中，使用http session來關聯微信openid這樣每次http請求都能確定是哪個用戶發起的請求。如果熟悉http session的原理，session問題就好解決了。常見的session保持方式是，當瀏覽器向服務端發起http請求時，服務端檢查在http 頭部cookie參數里是否包含sessionid，如果有sessionid就根據sessionid去查看存儲在服務器端的session，session里保存的當前會話的一些信息。如果sessionid沒有服務端就會分配一個，寫到cookie字段里，瀏覽器下次發起其它請求的時候帶上。而在小程序里所有的請求都通過wx.request API來發起的。如果對wx.request API包裝一下，使其每次向服務端發起請求時也添加一個名稱為Cookie的http header，這樣也不用對服務端作改動。服務端分配的sessionid使用wx.setStorageSync API存儲在微信客戶端。 項目源碼地址：https://github.com/it-man-cn/smallapp-session 1、客戶端實現 客戶端代碼目錄smallapp-session/views，客戶端主要實現對wx.request的封裝，在wafer-client-demo項目的基礎上作了一些修改。 wx.request封裝 var constants = require('./constants'); var utils = require('./utils'); var Session = require('./session'); var loginLib = require('./login'); var noop = function noop() {}; var buildAuthHeader = function buildAuthHeader(session) { var header = {}; if (session && session.id) { header['Cookie'] =constants.WX_HEADER_ID+'='+session.id; } return header; }; function request(options) { if (typeof options !== 'object') { var message = '請求傳參應為 object 類型，但實際傳了 ' + (typeof options) + ' 類型'; throw new RequestError(constants.ERR_INVALID_PARAMS, message); } var requireLogin = options.login; var success = options.success || noop; var fail = options.fail || noop; var complete = options.complete || noop; var originHeader = options.header || {}; // 成功回調 var callSuccess = function () { success.apply(null, arguments); complete.apply(null, arguments); }; // 失敗回調 var callFail = function (error) { fail.call(null, error); complete.call(null, error); }; // 是否已經進行過重試 var hasRetried = false; if (requireLogin) { doRequestWithLogin(); } else { doRequest(); } // 登錄后再請求 function doRequestWithLogin() { loginLib.login({ success: doRequest, fail: callFail }); } // 實際進行請求的方法 function doRequest() { var authHeader = buildAuthHeader(Session.get()); console.log(authHeader) wx.request(utils.extend({}, options, { header: utils.extend({}, originHeader, authHeader), success: function (response) { var data = response.data; console.log("err:",data) console.log("errid:",data[constants.WX_SESSION_MAGIC_ID]) // 如果響應的數據里面包含 SDK Magic ID，表示被服務端 SDK 處理過，此時一定包含登錄態失敗的信息 if (data && data[constants.WX_SESSION_MAGIC_ID]) { console.log("clear session") // 清除登錄態 Session.clear(); var error, message; if (data.error === constants.ERR_INVALID_SESSION) { // 如果是登錄態無效，并且還沒重試過，會嘗試登錄后刷新憑據重新請求 if (!hasRetried) { hasRetried = true; doRequestWithLogin(); return; } message = '登錄態已過期'; error = new RequestError(data.error, message); } else { message = '鑒權服務器檢查登錄態發生錯誤(' + (data.error || 'OTHER') + ')：' + (data.message || '未知錯誤'); error = new RequestError(constants.ERR_CHECK_LOGIN_FAILED, message); } callFail(error); return; } callSuccess.apply(null, arguments); }, fail: callFail,
