久久精品视频18|18xxxx视频|欧美18xxxx|18xxxx中国|俄罗斯18xxxx|成人18禁|黄瓜视频18|污污污视频在线观看

小程序模板網

小程序登錄的最優流程

發布時間:2020-05-22 10:20 所屬欄目:小程序開發教程

18年中(zhong)旬(xun)做過(guo)一個(ge)小程序,當(dang)時(shi)是通(tong)過(guo)轉(zhuan)跳到一個(ge)登錄頁(ye),然(ran)后(hou)(hou)點擊調(diao)用(yong)(yong)(yong) wx.getUserInfo ,然(ran)后(hou)(hou)發現這個(ge)api被禁用(yong)(yong)(yong)了(雖然(ran)依然(ran)可以用(yong)(yong)(yong)),然(ran)后(hou)(hou)用(yong)(yong)(yong)

<!-- 需要使用 button 來授權登錄 -->
<button wx:if="{{canIUse}}" open-type="getUserInfo" bindgetuserinfo="bindGetUserInfo">授權登錄</button>
<view wx:else>請升級微信版本</view>
復制代碼

因(yin)為當(dang)時剛(gang)好需要用戶信(xin)息(xi),然后這個api有(you)一個 encryptedData 屬(shu)性可(ke)以獲取信(xin)息(xi)。

這樣的流(liu)程本就可以了(le),但是意(yi)外出現了(le)。

思維的禁錮

當第(di)二(er)次(2020年)需要開(kai)發一個(ge)新的(de)(de)小程序,于(yu)是也用了老(lao)代(dai)碼, 但是出現了個(ge)奇怪(guai)的(de)(de)問(wen)題(ti)。 有(you)興趣的(de)(de)可以看下面的(de)(de)[奇怪(guai)的(de)(de)問(wen)題(ti)]

奇怪的問題:

因(yin)為微信限(xian)制無法轉跳(tiao)到(dao)登錄頁,所以(yi)想(xiang)是否應(ying)該在(zai)首(shou)頁設置一個彈窗,點(dian)擊的時候授權(quan)。

但(dan)是(shi)因為考慮到可能會被微信(xin)拒(ju)絕,故(gu)在小程序開發(fa)者論壇開了一篇文(wen)章

app無(wu)法(fa)轉跳到(dao)登(deng)錄(lu)頁面(mian) and 小(xiao)程序(xu)登(deng)錄(lu)的哲學思考

隨(sui)后發(fa)現,登(deng)錄(lu)其實并(bing)不(bu)需要授權彈窗or頁(ye)面。(如果服務器不(bu)需要保存(cun)用(yong)戶信息)

流程

下面(mian)這個圖是小程(cheng)序官方圖 點(dian)我轉跳

代碼

app.js(小(xiao)程序的入口文(wen)件)的完整代碼

const loginDataKey = 'loginData'

//app.js
App({
  onLaunch: function () {

    const loginData = wx.getStorageSync(loginDataKey)
    console.log('--loginData--')
    console.log(loginData)
    let toLogin = () => {
      console.log('未登錄,去登錄..')
      wx.showLoading({title: '登錄中', icon: 'loading', mask: true})
      wx.login({
        success(res){
          console.log('wx.login res')
          console.log(res)
          let success = () => {
            console.log('登錄成功')
            let loginResponse = {"openid":"ooZAbwpdDdaZV_xiamianshi_mashaike"}
            wx.setStorageSync(loginDataKey, loginResponse)
            wx.hideLoading()
          }
          let fail = () => {
            wx.hideLoading()
            wx.showToast({
              title: '登錄失敗,請重新打開小程序試試',
              icon: 'none',
              duration: 1e8
            })
          }
          // TODO 發起網絡請求
          // 延時模擬請求登錄成功
          setTimeout(success, 500)
        },
        fail(err){
          console.log(err)
          wx.hideLoading()
          wx.showToast({
            title: '登錄失敗,請重新打開小程序試試',
            icon: 'none',
            duration: 1e8
          })
        }
      })
    }
    // 未登錄,去登錄
    if(!loginData){
      toLogin()
    // 已登錄,但是微信session_key過期
    }else{
      wx.checkSession({
        success () {
          //session_key 未過期,并且在本生命周期一直有效
          console.log('session_key 未過期')
        },
        fail () {
          // session_key 已經失效,需要重新執行登錄流程
          console.log('session_key 已經失效,需要重新執行登錄流程, 重新登錄中')
          toLogin()
        }
      })
    }

  },
  globalData: {
    userInfo: null
  }
})
復制代碼

流程如下

  • 根據本地儲存判斷是否登錄
  • 已登錄判斷是否失效
  • 失效或者未登錄去登錄
  • 登錄展示toast
  • 拿到信息存儲 關閉toast

核心

  • wx.login拿到code
  • 然后把code通過 auth.code2Session 獲取openid和unionid等。

這是我(wo)通過(guo) auth.code2Session 拿到openid的截圖(因為這個(ge)是測(ce)試號,所(suo)以沒有(you)unionid)

【unionid】是拿來和其他平臺打通賬號的關(guan)鍵,如果只(zhi)有一個(ge)小程序,都可以不需要這個(ge)。

效果

 

 

其他

純展示用戶頭像昵稱等

<open-data type="userAvatarUrl"></open-data>
<open-data type="userNickName"></open-data>
復制代碼

查看open-data文檔

--完--



易優(you)小程序(企業版)+靈活api+前后代碼開源 碼云(yun)倉庫:
本文地址://www.zhutiquan.com/wxmini/doc/course/25267.html 復制鏈接 如需(xu)定制請聯系易(yi)優(you)客服咨詢:

工作日 8:30-12:00 14:30-18:00
周六及部分節假日提(ti)供(gong)值班(ban)服務

易小(xiao)優
轉人工 ×