小程式獲取個人資訊、和群資訊，後臺解密返回資訊
阿新 • • 發佈：2018-11-27
場景描述：
1.微信目前是需要點選按鈕獲取許可權，然後個人資訊（頭像、暱稱）
2.獲取使用者的openId更多資訊
3.分享到群的時候，可以獲得群的openGId，然後顯示群的暱稱
注意問題：app.js中通過後臺獲取使用者更多的資訊時，因為非同步，很多時候將後臺使用者資訊通過this.setDate()，this拿不到報錯，解決方法：
1.回撥函式callback（獲取群openGid時，會用到）
2.下面的例子在，index中獲取值然後設定值
1.個人資訊獲取的程式碼：
index.wxml <view class="container"> <view class="userinfo"> <button wx:if="{{!hasUserInfo && canIUse}}" open-type="getUserInfo" bindgetuserinfo="getUserInfo"> 獲取頭像暱稱 </button> <block wx:else> <image bindtap="bindViewTap" class="userinfo-avatar" src="{{userInfo.avatarUrl}}" mode="cover"></image> <text class="userinfo-nickname">{{userInfo.nickName}}</text> </block> </view> </view>
index.wxss
.userinfo {
display: flex;
flex-direction: column;
align-items: center;
}
.userinfo-avatar {
width: 128rpx;
height: 128rpx;
margin: 20rpx;
border-radius: 50%;
}
.userinfo-nickname {
color: #aaa;
}
index.js //index.js //獲取應用例項 const app = getApp() Page({ data: { motto: 'Hello World', userInfo: {}, hasUserInfo: false, canIUse: wx.canIUse('button.open-type.getUserInfo') }, onLoad: function () { if (app.globalData.userInfo) { this.setData({ userInfo: app.globalData.userInfo, hasUserInfo: true }) } else if (this.data.canIUse){ // 由於 getUserInfo 是網路請求，可能會在 Page.onLoad 之後才返回 // 所以此處加入 callback 以防止這種情況 app.userInfoReadyCallback = res => { this.setData({ userInfo: res.userInfo, hasUserInfo: true }) } } else { // 在沒有 open-type=getUserInfo 版本的相容處理 wx.getUserInfo({ success: res => { app.globalData.userInfo = res.userInfo this.setData({ userInfo: res.userInfo, hasUserInfo: true }) } }) } }, getUserInfo: function(e) { console.log(e) if (e.detail.userInfo) { app.globalData.userInfo = e.detail.userInfo this.setData({ userInfo: e.detail.userInfo, hasUserInfo: true }) app.globalData.isRefresh = true; console.log("getUserInfo()==>>是否成功:" + app.globalData.isRefresh); //微信授權後呼叫請求後臺使用者資訊 this.AllUserInfo(); } else { wx.showModal({ title: '授權提示', content: '您點選了拒絕授權，將無法正常使用本小程式的功能體驗。如想使用本小程式，請再次點選。', success: function (res) { if (res.confirm) { console.log('使用者點選確定') } } }) } }, AllUserInfo: function () { var that = this; // 獲取後臺的使用者資訊 wx.login({ success: function (res) { console.log("AllUserInfo()==>>res.code:" + res.code); //五分鐘的code，傳送 res.code 到後臺換取 openId, sessionKey, unionId wx.getUserInfo({ withCredentials: true, success: function (res_user) { wx.request({ url: 'http://xxx',//自己的後臺域名 method: "GET", data: { code: res.code, //上面wx.login()成功獲取到的code encryptedData: res_user.encryptedData, iv: res_user.iv }, header: { 'content-type': 'application/json' //預設值 }, success: function (res) { console.log("index.js>>AllUserInfo()返回資訊"); console.log(res); if (res.data.status == 1) { var userInfo_ = res.data.userInfo; app.globalData.userInfo = res.data.userInfo; //這裡將使用者的資訊儲存在本地中，方便其他頁面呼叫 that.setData({ userInfo: userInfo_, }) console.log('解密成功'); } else { console.log('解密失敗'); } } }) } }) } }) }, })
app.js App({ onLaunch: function () { // 展示本地儲存能力 var logs = wx.getStorageSync('logs') || [] logs.unshift(Date.now()) wx.setStorageSync('logs', logs) // 獲取使用者資訊 wx.getSetting({ success: res => { if (res.authSetting['scope.userInfo']) { // 已經授權，可以直接呼叫 getUserInfo 獲取頭像暱稱，不會彈框 wx.getUserInfo({ success: res => { // 可以將 res 傳送給後臺解碼出 unionId this.globalData.userInfo = res.userInfo // 由於 getUserInfo 是網路請求，可能會在 Page.onLoad 之後才返回 // 所以此處加入 callback 以防止這種情況 if (this.userInfoReadyCallback) { this.userInfoReadyCallback(res) } } }) } } }) }, globalData: { userInfo: null } })
授權之後，後臺解密資訊返回
java+ssm後臺解密：https://blog.csdn.net/abgglive/article/details/80666807
php：https://www.cnblogs.com/haifengliang/p/7998868.html
2.openGId獲取群資訊程式碼：
因為寫了篇分享的文章：這裡就不累贅了：先看分享文章：https://blog.csdn.net/qq_40670946/article/details/82843061
也可以自己去找AES解密包
新增1：
app.js中“分享成功”處插入程式碼：
//呼叫獲取群id方法
wx.login({
success: function(result) {
var s = vm;
wx.request({
url: 'http://xxx',//自己的後臺域名
method: "GET",
data: {
code: result.code,
encryptedData: res.encryptedData,
iv: res.iv
},
header: {
'content-type': 'application/json' //預設值
},
success: function(res) {
console.log("後臺介面返回資訊：");
console.log(res);
if (res.data.status == 1) {
console.log('解密成功');
if (app.openGIdCallback) {
app.openGIdCallback(res);
}
} else {
console.log('解密失敗');
}
}
})
}
})
java後臺介面修改為：
@ResponseBody
@RequestMapping(value = "/getOpenGid", method = RequestMethod.GET)
public Map getOpenGid(String encryptedData, String iv, String code) {
Map map = new HashMap();
//登入憑證不能為空
if (code == null || code.length() == 0) {
map.put("status", 0);
map.put("msg", "code 不能為空");
return map;
}
//小程式唯一標識 (在微信小程式管理後臺獲取)
String wxspAppid = "xxx";
//小程式的 app secret (在微信小程式管理後臺獲取)
String wxspSecret = "xxx";
//授權（必填）
String grant_type = "authorization_code";
//////////////// 1、向微信伺服器 使用登入憑證 code 獲取 session_key 和 openid ////////////////
//請求引數
String params = "appid=" + wxspAppid + "&secret=" + wxspSecret + "&js_code=" + code + "&grant_type=" + grant_type;
//傳送請求
String sr = HttpRequest.sendGet("https://api.weixin.qq.com/sns/jscode2session", params);
//解析相應內容（轉換成json物件）
JSONObject json = JSONObject.fromObject(sr);
//獲取會話金鑰（session_key）
String session_key = json.get("session_key").toString();
//使用者的唯一標識（openid）
String openid = (String) json.get("openid");
//////////////// 2、對encryptedData加密資料進行AES解密 ////////////////
try {
String result = AesCbcUtil.decrypt(encryptedData, session_key, iv, "UTF-8");
if (null != result && result.length() > 0) {
map.put("status", 1);
map.put("msg", "解密成功");
JSONObject resultInfo = JSONObject.fromObject(result);
map.put("resData",resultInfo);
return map;
}
} catch (Exception e) {
e.printStackTrace();
}
map.put("status", 0);
map.put("msg", "解密失敗");
return map;
}
注意：wxspAppid 和建立微信小程式的appid相同解密成功，如果要其他小夥伴測試解密的話，
1.需要將小夥伴新增為“體驗者”，
2.小夥伴下拉專案時建立的專案appid為你的appid即可
新增2：
app.js中setInfo方法獲得app例項(因為在wx.login下app.openGIdCallback換成this.openGIdCallback),會找不到this,導致報錯
新增3：
index.wxml中增加程式碼：
<open-data id="groupName" type="groupName" open-gid="{{openGId}}"></open-data>
新增4：
index.js中：
1.data資料增加程式碼：
openGId: 0, //群id
2.onLoad方法增加：
//分享群資訊回撥函式
app.openGIdCallback = res => {
console.log("群資訊出來了嗎？");
console.log(res);
this.setData({
openGId: res.data.resData.openGId,
});
}
群的暱稱資訊會顯示在open-data元件中;並不會和openGid一起返回！！
到這裡就結束了，希望對你有用，能力有限，不對的地方請小夥伴們指正！