很多的时候我们在做小程序应用的时候，希望用户在使用小程序前进行登录授权，之前登录后通过wx.getUserInfo直接弹出授权的登录方式官方的意思是将不再支持，而是让用户通过下面的方式授权用户信息
<button open-type="getUserInfo" bindgetuserinfo="getUserInfoAction">授权用户信息</button>
这样的话当小程序在使用前一定需要用户登录，或者已经进行到需要用户登录的操作时；这样的话就需要一个button授权页面。这种改变，感觉个人还是喜欢默认弹层的的授权方式，这个方式可能一时不适应吧，有种排斥。
下面是通过button授权的方式做的一个登录：这里我只是展示了login.js 与 index.js 过程，有不对或者不好的地方欢迎加群交流指正。
login.js
const ajax = require("../../common/ajax.js")
const tips = require("../../common/tips.js")
Page({
/**
* 页面的初始数据
*/
data: {
},
/**
* 生命周期函数--监听页面加载
*/
onLoad: function (options) {
let that = this;
},
getUserInfoAction(res){
let that = this;
const encryptedData = res.detail.encryptedData;
const iv = res.detail.iv;
if (encryptedData && iv){
// console.log("允许")
that.login().then((login)=>{
const params = {
"code": login.code,
"encryptedData": encryptedData,
"iv": iv,
"type": "small_wechat"
}
ajax.posts(params, "api/passport/thirdSign").then((res) => {
let userinfo = {
avatar: res.data.data.avatar,
nickname: res.data.data.nickname,
token: res.data.data.token,
user_id: res.data.data.user_id
}
wx.setStorageSync("userinfo", userinfo);
// console.log(wx.getStorageSync("userinfo"));
if (wx.getStorageSync("userinfo")){
wx.redirectTo({
url: '/page/index/index'
})
}
}).catch((errMsg) => {
tips.showToast("网络连接失败", "none")
console.log(errMsg)
})
}).catch((errMsg) => {
console.log("登录:" + errMsg)
})
}else{
// console.log("拒绝")
tips.showToast("请授权公开信息,登录小程序", "none")
}
},
login(){
// 登录
let promise = new Promise((resolve, reject) => {
wx.login({
success: function (res) {
if (res.code) {
resolve(res)
} else {
tips.showToast("登录失败", "none")
}
},
fail: function (err) {
reject(err)
}
})
})
return promise;
}
})
index.js
const tips = require("../../common/tips.js")
Page({
/**
* 页面的初始数据
*/
data: {
},
/**
* 生命周期函数--监听页面加载
*/
onLoad: function (options) {
let that = this;
if (!wx.getStorageSync("userinfo")) {
//是否登录
that.isloginindex()
}
},
isloginindex() {
//是否进入首页
if (wx.getStorageSync("userinfo")) {
console.log("登录")
} else {
//无信息
console.log("否登录")
wx.redirectTo({
url: '/page/login/login'
})
}
}
})
通过button open-type="getUserInfo"的方式授权登录小程序流程，还没有想到一个更好的办法，目前是这么干的；如果有不对或者更好方式的欢迎指正或者一起交流