微信小程序java(ssm)登录验证和存储用户

最近在实现一个投票小程序,第一次做小程序,请大神多指教,轻喷,投票小程序实现需要登录,像绝大多数的小程序一样,所有结合微信小程序开发文档写出登录过程,此发博客记录一下。

实现思路:

  1. 首先点开小程序进入首页,首页加载时即onload通过code向服务器发送请求,验证用户是否存在,即openid是否存在,如果openid存在,即停在index首页,如果不存在,跳转到登录授权界面
  2. 登录授权界面使用小程序提供的wx.login和wx.getUserInfo这两个API完成登录授权,并将用户信息存储在数据库

下面是代码

前端index页面的js

 onLoad() {
    wx.login({
      success(res) {
        if (res.code) {
          //发起网络请求,通过code查询openid是否存在
          wx.request({
            url: '服务器地址验证openid是否存在地址',
            data: {
              code: res.code
            },
            //服务器将result和sessio_key打包成JSON的result
            success: function (result) {
            //false代表用户不存在,即跳转到登录
              if(result.data.flag==false){
                wx.navigateTo({
                  url: '/pages/login/login'
                })
              }
            }
          })
        } else {
          console.log('登录失败!' + res.errMsg)
        }
      }
    })
  },

前端login页面的wxml(官网的开发文档有这段代码)

<!-- 如果只是展示用户头像昵称,可以使用 <open-data /> 组件 -->
<view class="userinfo">
  <view class="userinfo-avatar">
    <open-data  type="userAvatarUrl"></open-data>
  </view>
    <open-data type="userNickName"></open-data>
</view>
<!-- 需要使用 button 来授权登录 -->
<button wx:if="{{canIUse}}" class="btn" type='primary' open-type="getUserInfo" bindgetuserinfo="bindGetUserInfo">授权登录</button>
<view wx:else>请升级微信版本</view>

前端login页面的js(官网的开发文档有这段代码)

//bindGetUserInfo验证用户并存储用户
  bindGetUserInfo(e) {
    wx.login({
      success(res) {
        if (res.code) {
          //发起网络请求
          wx.request({
            url: '服务器地址验证openid是否存在地址',
            data: {
              code: res.code
            },
            success: function (result) {
              wx.getUserInfo({
                success: function (res) {
                  var info = res.userInfo;
                  wx.request({
                    url: '服务器存储用户的地址,要把上面的result里的openid也带过来一起存储',
                    data: {
                      info: info,
                      result: result.data
                    },
                    success: function (flag) {
                      if (flag.data == true) {
                        wx.switchTab({
                          url: '/pages/index/index'
                        })
                      }
                    }
                  })
                }
              })
            }
          })
        } else {
          console.log("拒绝登录"),
            wx.switchTab({
              url: '/pages/login/login'
            })
        }
      }
    })
  }
})

效果演示:
访问主页时,因为没有登陆过(数据库没有该用户的openid及信息时),自动跳转到登录页面
微信小程序java(ssm)登录验证和存储用户_第1张图片
点击授权登录,必须选确定才可跳转到主页,如果不选择确定,依然停留在登录页面
微信小程序java(ssm)登录验证和存储用户_第2张图片

你可能感兴趣的:(小程序)