微信小程序微信登陸

image.png

開發接口
登陸
wx.login
wx.checkSession
簽名加密小程序

小程序登陸
小程序能夠經過微信官方提供的登陸能力方便地獲取微信提供的用戶身份標識,快速創建小程序內的用戶體系。服務器

登陸流程時序微信

小程序,開發者服務器,微信接口服務網絡

wx.login()獲取code
wx.request()發送codesession

登陸憑證校驗接口
appid+appsecret+code
session_key+openid等app

自定義登陸
與openid,session_key關聯ide

image.png

image.png

image.png

微信登陸受權:加密

wx.authorize
提早向用戶發起受權請求,調用後會馬上彈窗詢問用戶是否贊成受權小程序使用某項目功能或獲取用戶的某些數據,但不會實際調用對應的接口,若是用戶以前就已經贊成受權,則不會出現彈窗。url

image.png

image.png

image.png

<button open-type="getUserInfo"></button>

userInfo參數說明:
nickName
avatarUrl
gender
city
province
country
language3d

image.png

image.png

wx.login({
  success (res) {
    if (res.code) {
      //發起網絡請求
      wx.request({
        url: 'https://test.com/onLogin',
        data: {
          code: res.code
        }
      })
    } else {
      console.log('登陸失敗!' + res.errMsg)
    }
  }
})

wx.checkSession(Object object)
檢查登陸態是否過時。

wx.checkSession({
  success () {
    //session_key 未過時,而且在本生命週期一直有效
  },
  fail () {
    // session_key 已經失效,須要從新執行登陸流程
    wx.login() //從新登陸
  }
})

wx.getUserInfo(Object object)
獲取用戶信息。

// 必須是在用戶已經受權的狀況下調用
wx.getUserInfo({
  success: function(res) {
    var userInfo = res.userInfo
    var nickName = userInfo.nickName
    var avatarUrl = userInfo.avatarUrl
    var gender = userInfo.gender //性別 0:未知、1:男、2:女
    var province = userInfo.province
    var city = userInfo.city
    var country = userInfo.country
  }
})
<!-- 若是隻是展現用戶頭像暱稱,能夠使用 <open-data /> 組件 -->
<open-data type="userAvatarUrl"></open-data>
<open-data type="userNickName"></open-data>
<!-- 須要使用 button 來受權登陸 -->
<button wx:if="{{canIUse}}" open-type="getUserInfo" bindgetuserinfo="bindGetUserInfo">受權登陸</button>
<view wx:else>請升級微信版本</view>

Page({
  data: {
    canIUse: wx.canIUse('button.open-type.getUserInfo')
  },
  onLoad: function() {
    // 查看是否受權
    wx.getSetting({
      success (res){
        if (res.authSetting['scope.userInfo']) {
          // 已經受權,能夠直接調用 getUserInfo 獲取頭像暱稱
          wx.getUserInfo({
            success: function(res) {
              console.log(res.userInfo)
            }
          })
        }
      }
    })
  },
  bindGetUserInfo (e) {
    console.log(e.detail.userInfo)
  }
})

image.png

image.png

小程序登陸

const app = getApp()

Page({
 data: {
 },
 onLoad: function(params) {
 
 },
 // 登陸
 doLogin: function(e) {
   console.log(e.detail.errMsg)
   console.log(e.detail.userInfo)
   console.log(e.detail.rawData)
   
   wx.login({
  success (res) {
    if (res.code) {
      //發起網絡請求
      wx.request({
        url: 'https://test.com/onLogin',
        data: {
          code: res.code
        }
      })
    } else {
      console.log('登陸失敗!' + res.errMsg)
    }
  }
})
   
 }
})
<view>
 <button class="goRegistBtn" type="warn" open-type='getUserInfo' bindgetusrinfo="doLogin">微信登陸</button>
</view>

wx.getUserInfo(Object object)
image.png

image.png

image.png

App({
 serverUrl: "",
 userInfo: null,
 
 setGlobalUserInfo: function(user) {
  wx.setStorageSync("userInfo", user);
 },

 getGlobalUserInfo: function() {
  return wx.getStorageSync("userInfo");
 },

})

獲取微信session_key和secret

image.png

image.png

image.png

image.png


 

官方微信公衆號

相關文章
相關標籤/搜索