微信小程序登录

前期配置

1.登录微信公众平台,在[开发设置]页面获取AppID和AppSecret

2.在客户端新建项目,选择[小程序云开发],填写AppID(不能用测试号)

设置登录界面

1.wxml登录按钮

<button type="primary" open-type='getUserInfo' bindgetuserinfo='getuserinfo'>登录</button>

2.js

第一步:注册事件,弹出授权信息,并获取

getuserinfo(res){
  console.log(res);
}

第二步:判断是否成功获取到用户信息

getuserinfo(res){
  console.log(res);
  
  wx.getSetting({
    success(result){
        console.log(result);
     }
  })
}

第三步:用户点击授权后,请求登录接口并将token值存在Storage中

if(result.authSetting["scope.userInfo"]&&!wx.getStorageSync("token")){
          //加载提示
          wx.showLoading({
            title:'登录中',
            mark:true
          })
          // 请求登录接口
          wx.request({
            url:'http://nideshop2.bluej.cn/api/auth/loginByWeixin',
            method:"post",
            data:{
              appId:'wx835b3923232adf2833014b6',
              secret:'8eee1d03df5431231230c7bdba840e675433f9a09',//在公众平台中获取
              code:app.globalData.code,
              userInfo:res.detail
            },
            success(resu){
              wx.hideLoading();
              //typeof可以判断不存在的值
              if(typeof(resu.data.data)!="undefined"){
                wx.setStorageSync('token',resu.data.data.token);
                wx.showToast({
                  title:"登录成功",
                  icon:"success"
                })
              }else{
                wx.showModal({
                  title:"登录失败",
                  content:"请重新登录"
                })
              }
              console.log(resu);
            }
          })
        } 

完整代码

  // 第一步
  getuserinfo(res){ //弹出授权信息,并获取
    console.log(res);
    // 第二步
    wx.getSetting({ //判断是否成功获取到用户信息
      success(result){
        console.log(result);
        //第三步:用户点接受后
        if(result.authSetting["scope.userInfo"]&&!wx.getStorageSync("token")){
          //加载提示
          wx.showLoading({
            title:'登录中',
            mark:true
          })
          // 请求登录接口
          wx.request({
            url:'http://nideshop2.bluej.cn/api/auth/loginByWeixin',
            method:"post",
            data:{
              appId:'wx8d35b39adf28as01asdfasda4b6',
              secret:'8eee1d03df540ca2sdead7bdba840e6754f9a09',
              code:app.globalData.code,
              userInfo:res.detail
            },
            success(resu){
              wx.hideLoading();
              //typeof可以判断不存在的值
              if(typeof(resu.data.data)!="undefined"){
                wx.setStorageSync('token',resu.data.data.token);
                wx.showToast({
                  title:"登录成功",
                  icon:"success"
                })
              }else{
                wx.showModal({
                  title:"登录失败",
                  content:"请重新登录"
                })
              }
              console.log(resu);
            }
          })
        } 
      }
    })
  },