PHP8.1.21版本已发布
vue8.1.21版本已发布
jquery8.1.21版本已发布

博客列表 > 小程序云开发用户登录

小程序云开发用户登录

程先生的博客
程先生的博客 原创
2019年08月17日 01:17:53 3865浏览

2019-8-13  小程序云开发笔记一

利用云开发***鉴权特性,通过云函数可以非常方便获取用户信息,包括openid,Appid等,建议保存到云数据库,核心源码如下:

小程序前端:

实例

<view class="userinfo">
    <button 
      open-type="getUserInfo" 
      bindgetuserinfo="onGetUserInfo"
      class="userinfo-avatar"
      style="background-image: url({{avatarUrl}})"
    ></button>
    <view>
      <button class="userinfo-nickname" bindtap="onGetOpenid">点击获取 openid</button>
    </view>
  </view>


设置初始化数据:

实例

data: {
    avatarUrl: './user-unlogin.png',
    userInfo: {},
    logged: false,
    takeSession: false,
    requestResult: ''
  },
页面加载时,检测用户授权情况,如已经授权,静默获取用户头像,昵称等,自动加载;如没有授权,通过点击授权加载
onLoad: function() {
    if (!wx.cloud) {
      wx.redirectTo({
        url: '../chooseLib/chooseLib',
      })
      return
    }

    // 获取用户信息
    wx.getSetting({
      success: res => {
        if (res.authSetting['scope.userInfo']) {
          // 已经授权,可以直接调用 getUserInfo 获取头像昵称,不会弹框
          wx.getUserInfo({
            success: res => {
              this.setData({
                avatarUrl: res.userInfo.avatarUrl,
                userInfo: res.userInfo
              })
            }
          })
        }
      }
    })
  },

  onGetUserInfo: function(e) {
    if (!this.logged && e.detail.userInfo) {
      this.setData({
        logged: true,
        avatarUrl: e.detail.userInfo.avatarUrl,
        userInfo: e.detail.userInfo
      })
    }
  },

  onGetOpenid: function() {
    // 调用云函数获取Openid
    wx.cloud.callFunction({
      name: 'login',
      data: {},
      success: res => {
        console.log('[云函数] [login] user openid: ', res.result.openid)
        app.globalData.openid = res.result.openid
        wx.navigateTo({
          url: '../userConsole/userConsole',
        })
      },
      fail: err => {
        console.error('[云函数] [login] 调用失败', err)
        wx.navigateTo({
          url: '../deployFunctions/deployFunctions',
        })
      }
    })
  },

获取用户信息,并保存到用户数据库的完整过程:

getUserInfo: function (result) // 此函数是单独完整示例,和上面的代码无关,绑定到获取用户信息button,可以获取用户昵称,头像等信息 {  
    // console.log(result.detail.userInfo);
  //利用云开发***鉴权的特性,调用云函数getUserOpenid,获取用户的openid,同时还可以获取Appid等信息
    wx.cloud.callFunction({
      name: "getUserOpenid",
      complete: res => {
        // console.log("callFunction test result:", res)
        //获取条件查询的所有数据总数,通过res.total == 0判断,防止同一用户多次添加,需注意userIonf.count()返回promise回调函数,加then返回最终结果;async异步函数中可以考虑用await直接返回结果
        var countNum = userInfo.where({
          _openid:res.result.openId
        }).count().then(res =>{
          console.log(res.total)
    if (res.total == 0){
      userInfo.add({
        data: result.detail.userInfo
      }).then(res => {
        console.log('数据库无此用户,新增成功')
      }).catch(err => {
        console.log(err)
      })
    }else{
      console.log('数据库已有此用户')
    }
        });  
      }
    })
    
  }
声明:本文内容转载自脚本之家,由网友自发贡献,版权归原作者所有,如您发现涉嫌抄袭侵权,请联系admin@php.cn 核实处理。
全部评论
文明上网理性发言,请遵守新闻评论服务协议