微信小程序登录接口调整修改方案（以typecho小程序为例）

微信小程序官方在四月中旬对小程序登录、用户信息相关接口进行了调整，导致大部分小程序的登录功能都受到了很多影响，当时调整的时候就打算写个教程的，但是一直没有时间去写这个，最近typecho小程序群里的小伙伴一直在问这个，就抽个时间写一下教程吧，以typecho小程序为例，适用于所有小程序修改。注意：因为typecho小程序采用的是uniapp编写的，所以可能回会微信小程序的原框架代码有所不同，但是大同小异。

旧版说明

首先说一下以前版本的时候小程序采用的登录授权方式，一般都说采用点击按钮<button open-type="getUserInfo" @getuserinfo="getuserinfo"/>的形式进行的，通过getUserInfo接口获取用户信息，但是很多开发者在打开小程序时就通过组件方式唤起getUserInfo弹窗，如果用户点击拒绝，无法使用小程序，这种做法打断了用户正常使用小程序的流程，同时也不利于小程序获取新用户。
原来的代码如下：

//wxml
<button open-type="getUserInfo" @getuserinfo="getuserinfo">登录</button>

//js

getuserinfo: function() {
            var that = this;
            // wx登录
            uni.login({
                success(res) {
                    // console.log(res)
                    if (res.code) {
                        //发起网络请求
                        var code = res.code;
                        // 获取微信用户信息
                        uni.getUserInfo({
                            success: function(res) {
                                res.userInfo.code = code;
                                that.userInfo = res.userInfo;
                                uni.request({
                                    // #ifdef MP-WEIXIN
                                    url: API.WXLogin(that.userInfo),
                                    // #endif
                                    // #ifdef MP-QQ
                                    url: API.QQLogin(that.userInfo),
                                    // #endif
                                    success: function(res) {
                                        // console.log(res);
                                        that.userInfo.openid = res.data.data;
                                        uni.setStorageSync('isLogin', true);
                                        uni.setStorageSync('userInfo', that.userInfo);
                                        uni.setStorageSync('openid', that.userInfo.openid);
                                        that.showLogin = false;
                                        // console.log(that.userInfo);
                                    }
                                });
                            },
                            fail: res => {
                                // 获取失败的去引导用户授权
                            }
                        });
                    } else {
                    }
                }
            });
        },

新版更换获取授权接口

新版修改了登录授权接口，可以直接采用点击任意view进行登录，不在局限于button和open-type，可以直接采用@click（注：微信原框架为bindtap），也就是说我们可以将代码登陆的按钮写成下面这样：

//uniapp版
<button @click="getuserinfo">点击登录</button>

//微信版
<button bindtap="getuserinfo">点击登录</button>

然后就是将以前的wx.getuserinfo改成wx.getUserProfile就行了，通过wx.getUserProfile可以直接获取用户的userInfo，修改如下：

getuserinfo: function() {
            uni.showLoading({
                title:"登录中"
            })
            var that = this;
            let code = '';
            uni.login({
                success: (res) => {
                    console.log(res)
                    code = res.code;
                }
            })
            uni.getUserProfile({
                desc: '用于完善会员资料',
                success: res => {
                    console.log(res);
                    res.userInfo.code = code;
                    that.userInfo = res.userInfo;
                    uni.request({
                        url: API.WXLogin(that.userInfo),
                        success: res=> {
                            console.log(res);
                            uni.hideLoading();
                            that.userInfo.openid = res.data.data;
                            uni.setStorageSync('isLogin', true);
                            that.isLogin = true;
                            uni.setStorageSync('userInfo', that.userInfo);
                            uni.setStorageSync('openid', that.userInfo.openid);
                            console.log(that.userInfo);
                        }
                    });
                }
            });
}

这里需要注意的是wx.getUserProfile不能静默调用，所以不能将wx.getUserProfile写在wx.login的回调函数中，这里我直接将他们放在了同级，因为在用户点击按钮的时候wx.login已经调用，获取到了code，然后用户在通过弹窗点击授权时就可以直接使用了。

以上就是大致的修改过程，采用的时uniapp代码方式，但是大致思路就是这样，不过改接口好像只有微信小程序支持,QQ等平台似乎还没有支持getUserProfile接口，所以用户还需要进行对个平台的适配。

更多优质请关注本站或本站微信公众号：阳光艺创站