This is the second day of my participation in Gwen Challenge

Small programs in the user authorization when the user access to the phone number, the front end after access to the back-end decryption can be stored in the database.

1. GetPhoneNumber this component is implemented via button (no other labels). Open -type= “getPhoneNumber” in button and bind bindGetPhonenumber event to get callback.

<button open-type="getPhoneNumber" bindGetPhonenumber ="getPhoneNumber"Copy the code

2. The login interface must be invoked before using this component. If login is not invoked, the button will prompt you to invoke login first

App({ onLaunch: function () { wx.login({ success: Function (res) {if (res.code) {console.log(res.code)} else {console.log(' Failed to get user login state! ' + res.errMsg) } } }); }})Copy the code

Note: Invoking the wx.login login in the callback may refresh the login state. In this case, the sessionKey exchanged by code is not the sessionKey used for encryption, causing decryption failure. Developers are advised to login in advance; Alternatively, use checkSession first in the callback to check the login state and avoid login refreshing the login state.

3. Use the bindGetPhonenumber binding event to get the callback. The callback takes three parameters,

ErrMsg: The user clicks to cancel or authorize the message callback.

Iv: the initial vector of the encryption algorithm (undefined if the user has not agreed authorization).

EncryptedData: the encryptedData of the user’s information (undefined if the user does not agree to the authorization)

getPhoneNumber(e) { let CONST = app.$.CONST let appid = CONST.APPID let secret = CONST.APPSECRET let grant_type = 'authorization_code' let encryptedData = e.detail.encryptedData let iv= e.detail.iv wx.login({ success(res){ wx.request({ url: 'https://api.weixin.qq.com/sns/jscode2session?appid=wx8493c38c2f678a82&secret=57bfc41d2101a3a517b2bd7dec399803&js_code='  + res.code +'&grant_type=authorization_code', success(r) { let session_key = r.data.session_key request({ url: Data :{id:app.$.info.id,// This is the current user id, Session_key, encryptedData, iv, appId: appId}, success:res=>{console.log(res)}})}})})},Copy the code

4. Back-end decryption API (JS), according to the official document

const crypto = require('crypto') module.exports = async(ctx, next) => { let { iv, encryptedData, session_key, appId, id } = ctx.request.body function WXBizDataCrypt(appId, session_key) { this.appId = appId this.session_key = session_key } WXBizDataCrypt.prototype.decryptData = function(encryptedData, iv) { // base64 decode var session_key = new Buffer(this.session_key, 'base64') encryptedData = new Buffer(encryptedData, 'base64') iv = new Buffer(iv, Var decipher = crypto.createDecipheriv(' AES-128-cbc ', session_key, iv) // Set automatic padding to true, SetAutoPadding (true) var decoded = decipher.update(encryptedData, 'binary', 'utf8') decoded += decipher.final('utf8') decoded = JSON.parse(decoded) } catch (err) { throw new Error('Illegal Buffer') } if (decoded.watermark.appid ! == this.appId) { throw new Error('Illegal Buffer') } return decoded } let pc = new WXBizDataCrypt(appId, session_key) let data = pc.decryptData(encryptedData, iv) return ctx.db('User') .update({ phoneNum: data.phoneNumber }).where({ id }).then(r =>{ console.log(r) ctx.body = data }) .catch(err=>{ console.error(err) }) }Copy the code

5. So far the returned data is the user’s mobile phone number, the middle of the business logic or to look at the official document, here is not good, only the general logic is like this.