最近團隊在開發一款小程式，都是新手，一邊看文件，一邊開發。在開發中會遇到各種問題，今天把小程式登入這塊的流程整理下，做個記錄。
小程式的登入跟平時自己APP這種登入驗證還不太一樣，多了一個角色，那就是微信伺服器。
根據微信官方提供的登入流程時序圖可以清楚的瞭解小程式登入需要多少個步驟，下面我們來總結下：
- 小程式啟動，通過wx.login()獲取code
- 開發者伺服器需要提供一個登入的介面，引數就是小程式獲取的code
- 登入介面收到code後，呼叫微信提供的介面進行code的驗證
- 得到驗證結果，成功後能得到一個session_key和openid
- 生成一個自定義的key, 將session_key和openid跟自定義的key關聯起來
- 將自定義的key返回給小程式
- 每次請求都帶上key, 後端根據key獲取openid識別當前使用者身份
首先code是微信給的，如果你隨意生成code去驗證肯定是無效的，只有微信給的code才有效。code傳到開發者自己的服務後，再去問微信：
Hi 哥們，我這個code是有效的還是無效的啊？
微信會告訴你是有效還是無效，有效的情況下還會給你一個使用者的標識，也就是openid，同時還會有一個session_key，也就是會話的key。session_key的有效期預設是2小時，當使用者一直在使用小程式的話會自動重新整理，這個是由微信這邊來維護的。
注意：
- 會話金鑰
session_key是對使用者資料進行 加密簽名 的金鑰。為了應用自身的資料安全，開發者伺服器不應該把會話金鑰下發到小程式，也不應該對外提供這個金鑰。 - 臨時登入憑證 code 只能使用一次
所以我們要為session_key建立別名，這個別名關聯的哪個使用者只有我們自己知道，唯一需要做的工作就在這塊。
我推薦2種方式來做關聯：
第一種： 隨機生成key, 關聯openid，存入redis中，當請求帶入key，直接從redis中獲取openid得到當前使用者資訊，這個其實也就是我們自己去維護了會話資訊
第二種： 採用JWT生成token，將openid繫結到token中，將token返回給小程式，請求的時候帶上token，通過解析token得到使用者資訊。
下面我們以第二種方式來進行講解，會貼上部分程式碼：
小程式中在app.js中的onLaunch方法中增加獲取code方法，並且呼叫後端的登入介面獲取token:
wx.login({
success: function (res) {
var code = res.code;
if (code) {
console.log('app啟動獲取使用者登入憑證：' + code);
let params = { "code": code };
let result = config.requestHttp(config.url.userLogin, 'POST', params)
result.then(res => {
let data = res.data
if (data.code == 200) {
wx.setStorageSync("login_token", data.data.token);
}
}).catch(err => {
console.log(err)
});
} else {
console.log('獲取使用者登入態失敗：' + res.errMsg);
}
}
})
複製程式碼userLogin介面則根據小程式的code去呼叫微信介面驗證：
// 小程式獲取SessionKey介面地址
String loginUrl = "https://api.weixin.qq.com/sns/jscode2session";
String url = loginUrl + "?appid=%s&secret=%s&grant_type=%s&js_code=%s";
url = String.format(url, appid, appSecret, grantType, param.getCode());
String result = restTemplate.getForObject(url, String.class);
Map<String, Object> map = JsonUtils.toBean(Map.class, result);
// 請求成功
if (map.containsKey("session_key")) {
String openid = map.get("openid").toString();
// 第一次儲存到使用者表，生成JWT TOKEN返回
}
複製程式碼小程式端需要將 wx.request()封裝成一個通用的方法，所有跟後臺互動都用這個方法來呼叫介面，我們可以在這個方法中設定登入之後獲取的Token。這樣每次請求都會將Token塞到請求頭中，我們在閘道器中就可以獲取這個Token進行解析驗證。
//請求封裝
function requestHttp(url, method, data) {
//請求頭設定
var header = {
Authorization: wx.getStorageSync("login_token")
}
return new Promise((resolve, reject) => {
wx.request({
url: config.home_config + url,
data: data,
header: header,
method: method,
success: (res => {
if (res.data.code === 200) {
resolve(res)
} else {
reject(res)
}
}),
fail: (res => {
reject(res)
})
})
})
}
複製程式碼Zuul中進行驗證：
RequestContext ctx = RequestContext.getCurrentContext();
HttpServletRequest request = ctx.getRequest();
String token = request.getHeader("Authorization");
if (StringUtils.isBlank(token)) {
ctx.setSendZuulResponse(false);
ctx.set("isSuccess", false);
ctx.setResponseBody(JsonUtils.toJson(Response.fail("非法請求【缺少Authorization】", ResponseCode.NO_AUTH_CODE)));
ctx.getResponse().setContentType("application/json; charset=utf-8");
return null;
}
// 驗證Token是否有效
JWTResult jwResult = JWTUtils.checkToken(token);
if (!jwResult.isStatus()) {
ctx.setSendZuulResponse(false);
ctx.set("isSuccess", false);
ctx.setResponseBody(JsonUtils.toJson(Response.fail(jwResult.getMsg(), jwResult.getCode())));
ctx.getResponse().setContentType("application/json; charset=utf-8");
return null;
}
ctx.addZuulRequestHeader("loginUserId", jwResult.getUid());
return null;
複製程式碼驗證成功後將使用者ID設定到請求頭中，傳遞給後端服務使用。
使用JWT必然有一個問題是Token的失效問題，我這邊失效時間設定的為2個小時，正常的話使用者開啟小程式，使用不可能連續超過2個小時，登入的邏輯是在app.js中做的，只要下次進去token就會重新申請。不過這個也可以調整，比如稍微長一點。
核心就是使用者的認證交給了微信，只要微信告訴我們認證成功了，我們就可以自己接管會話資訊了。