微信小程序登录验证和获取授权信息

微信小程序登录验证和获取授权信息

1.在app,js中设置

官方链接

 授权 : 

https://developers.weixin.qq.com/miniprogram/dev/api/authorize.html

获取用户信息 :https://developers.weixin.qq.com/miniprogram/dev/api/open.html#wxgetuserinfoobject

微信小程序登录验证和获取授权信息_第1张图片

App({

    onLaunch() {

        // 登录

        wx.login({

            success: res => {

                console.log(res);

                // 发送 res.code 到后台换取 openId, sessionKey, unionId

            }

        })

        // 获取用户信息

        wx.getSetting({

            success: res => {

                //判断是否授权,如果授权成功

                if (res.authSetting['scope.userInfo']) {

                    //获取用户信息

                    wx.getUserInfo({

                        success: res => {

                            console.log(res);

                            this.globalData.userInfo = res.userInfo

                            //网络延迟,回调函数

                            if (this.userInfoReadyCallback) {

                                this.userInfoReadyCallback(res)

                            }

                        }

                    })

                } else {

                    var that = this;

                    //如果授权不成功,进行授权

                    wx.authorize({

                        scope: 'scope.userInfo',

                        success(res) {

                            //获取用户信息

                            wx.getUserInfo({

                                success: res => {

                                    console.log(res);

                                    that.globalData.userInfo = res.userInfo


                                    if (that.userInfoReadyCallback) {

                                        that.userInfoReadyCallback(res)

                                    }

                                }

                            })

                        }

                    })

                }

            }

        })

    },

    globalData: {

        userInfo: null

    }

})

2.在pages里面的页面。pages.js中设置


微信小程序登录验证和获取授权信息_第2张图片

data: {

  canIUse: wx.canIUse('button.open-type.getUserInfo')

    },

if (app.globalData.userInfo) {

            this.setData({

                updateUserImgUrl: app.globalData.userInfo.avatarUrl,

                updateUserName: app.globalData.userInfo.nickName

            })

        } else if (this.data.canIUse) {

            // 由于 getUserInfo 是网络请求,可能会在 Page.onLoad 之后才返回

            // 所以此处加入 callback 以防止这种情况

            app.userInfoReadyCallback = res => {

                this.setData({

                    updateUserImgUrl: app.globalData.userInfo.avatarUrl,

                    updateUserName: app.globalData.userInfo.nickName

                })

            }

        } else {

            // 在没有 open-type=getUserInfo 版本的兼容处理

            wx.getUserInfo({

                success: res => {

                    app.globalData.userInfo = res.userInfo

                    this.setData({

                        updateUserImgUrl: app.globalData.userInfo.avatarUrl,

                        updateUserName: app.globalData.userInfo.nickName

                    })

                }

            })

        }

3.最后在页面里面渲染就OK了

你可能感兴趣的:(微信小程序登录验证和获取授权信息)