用wx.login獲取登錄憑證code
<!--pages/user/index.wxml-->
<view hidden='{{boolean}}'>
<view wx:if="{{isLogin == 1}}">
<!-- 個人信息 -->
<view class='infomation'>
<!-- 基本信息 -->
<view class="gameTitle">
<navigator hover-class="none" href=""><image src="{{dataList.head_photo}}"></image></navigator>
<view>
<view class="gameName"><navigator hover-class="none" href="">{{dataList.username}}</navigator></view>
<view class="gameSummary" wx:if="{{dataList.title == ''}}"><navigator hover-class="none" href="">這個玩家很懶，什么也沒留下</navigator></view>
<view class="gameSummary" wx:if="{{dataList.title != ''}}"><navigator hover-class="none" href="">{{dataList.title}}</navigator></view>
</view>
</view>
</view>
<!-- “我的”列表 -->
<view class='myList'>
<view class='list'>
</view>
</view>
</view>
<view wx:if="{{isLogin == 2}}">
<view class='bgBox'>
</view>
<view class="unLogin">
</view>
</view>
</view>
wx.checkSession
-
小程序 wx.checkSession 校驗登陸態
-
success ：接口調用成功，session_key未過期；
-
fail ：接口調用失敗，session_key已過期；
-
- 小程序端 wx.login 獲取code 並 wx.request 提交 code 給己方服務器
- 服務器 提交Appid + appSecret + code 到微信方服務器 獲取 session_key & openid
- 服務器 根據 session_key & openid 生成 3rd_session（微信方提出的基於安全性的考慮，建議開發者不要將openid等關鍵性信息進行數據傳輸） 並返回 3rd_session 到小程序端
- 小程序端 wx.setStorage 存儲 3rd_session 在后續用戶操作需要憑證時 附帶該參數
- 小程序端 wx.getUserInfo 獲取用戶信息 + wx.getStorage 獲取 3rd_session 數據后，一並 wx.request 提交給己方服務器
- 服務器 SQL 用戶數據信息更新
//用戶登陸
function userLogin() {
wx.checkSession({
success: function () {
//存在登陸態
},
fail: function () {
//不存在登陸態
onLogin()
}
})
}
function onLogin() {
wx.login({
success: function (res) {
if (res.code) {
//發起網絡請求
wx.request({
url: 'Our Server ApiUrl',
data: {
code: res.code
},
success: function (res) {
const self = this
if (邏輯成功) {
//獲取到用戶憑證 存儲 3rd_session
var json = JSON.parse(res.data.Data)
wx.setStorage({
key: "third_Session",
data: json.third_Session
})
getUserInfo()
}
else {
}
},
fail: function (res) {
}
})
}
},
fail: function (res) {
}
})
}
function getUserInfo() {
wx.getUserInfo({
success: function (res) {
var userInfo = res.userInfo
userInfoSetInSQL(userInfo)
},
fail: function () {
userAccess()
}
})
}
function userInfoSetInSQL(userInfo) {
wx.getStorage({
key: 'third_Session',
success: function (res) {
wx.request({
url: 'Our Server ApiUrl',
data: {
third_Session: res.data,
nickName: userInfo.nickName,
avatarUrl: userInfo.avatarUrl,
gender: userInfo.gender,
province: userInfo.province,
city: userInfo.city,
country: userInfo.country
},
success: function (res) {
if (邏輯成功) {
//SQL更新用戶數據成功
}
else {
//SQL更新用戶數據失敗
}
}
})
}
})
}
第三方服務器和微信服務器:
注意:session_key是微信服務器生成的針對用戶數據進行加密簽名的密鑰,不應該進行傳輸到客戶端.
生成3rd_session
用於第三方服務器和小程序之間做登錄態校驗.為了保證安全性,3rd_session應該長度夠長,一定有效時間, session_key + openid, key, 為 value, 寫入到session存儲.
3rd_session寫入storage:
后續用戶進入小程序,先從storage讀取3rd_session
根據請求,在session存儲中查找合法的session_key和openid
App({
onLaunch: function() {
wx.login({
success: function(res) {
var code = res.code;
if (code) {
console.log('獲取用戶登錄憑證：' + code);
} else {
console.log('獲取用戶登錄態失敗：' + res.errMsg);
}
}
});
}
})
唯一標識(openid)和會話密鑰(session_key)
wx.checkSession
檢測當前用戶登錄態是否有效
wx.checkSession({
success: function(){
//session 未過期，並且在本生命周期一直有效
},
fail: function(){
//登錄態過期
wx.login() //重新登錄
....
}
})
服務端處理邏輯
wx.checkSession({
success:function(res){
//session_key未過期
},
fail:(res=>{
// session_key已過期
// 進行登錄操作
wx.login({
success: function(res) {
const url = '接口地址' //本次項目中是從后台獲取session_key的接口，可能流程不同，會有相應的變化
const data = {
//你要傳的數據
}
wepy.request({
url: url,
method: 'POST',
data: data,
}).then(res=>{
if(res.data.code == 0){
//拿到的openid和session_key存到緩存中
//調用換取用戶id接口[需求不同，可能接口會有相應的變化]
const url = '獲取用戶id的接口'
const data = {'要傳的數據'}
wepy.request({
url: url,
method: 'POST',
data: data,
}).then((res)=>{
//該接口設計返回的參數包括換取的用戶ID和返回的用戶的微信中信息，也就是通過button獲取的那個userInfo[我們為了后續的處理，所以后台這塊返回用戶信息，如果用戶還未登錄，用戶信息，返回是空，反之則有值]
//存儲用戶ID
wx.setStorage({
key:'userId',
data:'獲取到的用戶ID'
})
//存儲用戶信息[userInfo]
wx.setStorage({
key:'userInfo',
data:'獲取到的用戶信息'
})
})
}
})
}
});
})
})
onShow(){
//從緩存中獲取session_key
let skey = wx.getStorageSync('session_key');
if (!skey) {
//如果session_key不存在，再次執行登錄
wx.login({
//該處登錄同app.wpy[流程一樣]
});
}else{
// session_key存在
}
}
//我們假設這個頁面需要獲取用戶的信息，首先給一個button[open-type設置為getUserInfo],使用這個拿到用戶的信息，
getUserInfo(e){
this.userInfo = e.detail.userInfo; //e.detail.userInfo攜帶的就是用戶的個人信息[包括頭像、昵稱等]
if(e.detail.userInfo){
wx.showToast({
title: '授權成功',
icon: 'success',
duration: 1500
})
//這里做這樣的處理，是因為需求需要點擊購物車按鈕跳轉訂單待支付頁，在沒有獲取到用戶信息之前，跳轉購物車的按鈕隱藏，獲取用戶信息按鈕顯示，反之則返
this.button = 'none'; //獲取用戶信息button
this.myMenu = 'block'; //跳轉待支付訂單頁
//更新緩存中的用戶信息
wx.setStorage({
key:'userInfo',
data:this.userInfo
})
}else if(e.detail.errMsg == 'getUserInfo:fail auth deny'){
wx.showModal({
title: '提示',
content: '若不授權微信登錄，則無法使用小程序。點擊"授權"按鈕並允許使用"用戶信息"方可正常使用。',
showCancel:false,
confirmText:'授權',
success:(res=>{
wx.openSetting({
success: (res) => {
}
})
})
})
}
}
https://api.weixin.qq.com/sns/jscode2session?appid=APPID&secret=SECRET&js_code=JSCODE&grant_type=authorization_code
對稱解密的目標密文為 Base64_Decode(encryptedData)。
對稱解密算法初始向量 為Base64_Decode(iv)，其中iv由數據接口返回。
signature = sha1( rawData + session_key )
//最終供外面調用的方法
function login(){
console.log('logining..........');
//調用登錄接口
wx.login({
success: function (e) {
console.log('wxlogin successd........');
var code = e.code;
wx.getUserInfo({
success: function (res) {
console.log('wxgetUserInfo successd........');
var encryptedData = encodeURIComponent(res.encryptedData);
thirdLogin(code,encryptedData,res.iv);//調用服務器api
}
})
}
});
}
function thirdLogin(code,encryptedData,iv){
var url = "eeee/xxx/login/ttttt";
var params = new Object();
params.code = code;
params.encryptedData = encryptedData;
params.iv =iv;
buildRequest(new Object(),url,params,{
onPre: function(page){},
onSuccess:function (data){
console.log('my login successd........');
console.log(data);
getApp().globalData.session_id = data.session_id;
getApp().globalData.uid = data.uid;
getApp().globalData.isLogin = true;
},
onError : function(msgCanShow,code,hiddenMsg){
}
}).send();
}