首頁 > 微信小程式 > 小程式開發 > 微信小程式授權登入流程時序 - 圖文詳解

微信小程式授權登入流程時序 - 圖文詳解

php是最好的语言
發布: 2018-07-25 11:37:14
原創
4455 人瀏覽過

最近在做一個微信小程式開發的專案。場景佈置:同一微信開放平台下擁有相同主體的APP和微信小程式來完成同樣的業務,使用者進入app或微信小程式時必須取得使用者的unionid來確認目前的使用者身份,完成登入。小程式「取得使用者資訊」api(getUserInfo)的呼叫方式和之前相比有了較大更新,優雅的實現使用者授權和登入非常重要,以下是我在微信小程式授權登入相關流程在開發時候的實現思路和總結,分享如下。

一、微信小程式登入流程時序

微信小程式授權登入流程時序 - 圖文詳解

#說明:

  1. 小程式呼叫wx.login( ) 取得臨時登入憑證code ,並回傳到開發者伺服器

  2. 開發者伺服器以code換取使用者唯一標識openid 和會話密鑰session_key。

  3. 暫時登入憑證code只能使用一次

#什麼是openid?

在追蹤者與公眾號產生訊息互動後,公眾號可獲得追蹤者的OpenID(加密後的微訊號,每位使用者對每個公眾號的OpenID是唯一的。對於不同公眾號,同一使用者的openid不同)。 ——微信公眾平台開發者文件
  • 普通用戶的標識,對目前公眾號唯一

  • 不同的公眾號,同一個用戶,openid不同

你可以簡單的理解為

openid = hash(uid + app_id)
登入後複製

什麼是unionid?

如果開發者擁有多個行動應用程式、網站應用程式、和公眾帳號(包括小程式),可透過unionid來區分使用者的唯一性,因為只要是同一個微信開放平台帳號下的行動應用、網站應用程式和公眾帳號(包括小程式),使用者的unionid是唯一的。換句話說,同一用戶,對同一個微信開放平台下的不同應用,unionid是相同的。 UnionID機制說明

如果開發者在多個行動應用程式、網站應用程式和公眾帳號之間有統一使用者帳號的需求,需要前往微信開放平台(open.weixin.qq.com)綁定公眾號後,便可利用UnionID機制來滿足上述需求。

  • 一個微信開放平台帳號下方可以有多個行動應用,網站應用,公眾帳號與小程式

  • 只要是同一個微信開放平台帳號下的行動應用程式、網站應用程式和公眾帳號(包括小程式),使用者的unionid是唯一的。

使用者在開放平台的唯一識別碼

你可以簡單的理解為:

unionid = hash(uid + 开放平台id)
登入後複製

總結下
微信針對不同的用戶在不同的應用下都有唯一的一個openId, 但是要想確定用戶是不是同一個用戶,就需要靠unionid來區分。一般自己的後台都會有自己的一個使用者表,每個使用者有不同的userid。也就是說同一個使用者在同一個微信開放平台下的相同主體的應用對應著相同的userid,unionid以及不同的openid。所以當用戶登入進來的時候,我們只能靠微信回傳給我們的unionid去判斷是不是同一個用戶,在去關聯我們的用戶表,拿到對應的userid。

二、微信小程式如何取得unionid?

綁定了開發者帳號的小程序,可以透過下面3種途徑取得UnionID。

  1. 呼叫介面wx.getUserInfo,從解密資料中取得UnionID。注意本介面需要使用者授權,請開發者妥善處理使用者拒絕授權後的情況。

  2. 如果開發者帳號下存在同主體的公眾號,並且該使用者已經關注了該公眾號。開發者可以直接透過wx.login取得到該用戶UnionID,無須用戶再次授權。

  3. 如果開發者帳號下存在同主體的公眾號碼或行動應用,且該使用者已授權登入該公眾號碼或行動應用程式。開發者也可以直接透過wx.login取得到該用戶UnionID,無須用戶再次授權。

微信小程式授權登入流程時序 - 圖文詳解

當使用者滿足條件2和3時,開發者可以直接透過wx.login取得到該使用者的unionid, 否則必須呼叫介面wx.getUserInfo,額外需要注意的事就是妥善處理使用者拒絕授權的情況。

三、登入最佳實踐

  1. 呼叫 wx.login 取得 code。

  2. 使用wx.getSetting 取得使用者的授權狀況

  • 如果使用者已經授權,直接呼叫API wx.getUserInfo 取得使用者最新的資訊;

  • 使用者未授權,在介面中顯示一個按鈕提示使用者登錄,當使用者點擊並授權後就取得到使用者的最新資訊。

  • 將取得到的使用者資料連同wx.login傳回的code一同傳給後端

  • 微信小程式授權登入流程時序 - 圖文詳解

    封裝ajax()

    在真實的業務場景中,我們希望,用戶進入小程式時,未登入情況下可以正常瀏覽商品,對小程式有個基本的認知,不要直接彈出框要求用戶授權,否則會幹擾用戶,導致新用戶的流失,當用戶需要使用一些高級功能和場景,這個時候再去要求用戶授權,這樣用戶授權的幾率會大大提高。
    將登入的邏輯封裝ajax
    流程:
    微信小程式授權登入流程時序 - 圖文詳解

    #封裝的意義
    #不再關注目前介面是否需要登錄,使用者是否已授權,所有請求直接呼叫ajax(),在必要的時候完成一切登入以及授權流程。小程式入口頁面增加,業務拓展的時候,你只需要專注於業務實現。

    參考資料

    • 小程式•小故事(4)-取得使用者資訊

    • 取得使用者基本資訊( UnionID機制)

    • UnionID機制說明

    #相關推薦:

    微信小程式開發文件

    微信小程式開發實戰影片教學

    #開發微信小程式影片教學

    以上是微信小程式授權登入流程時序 - 圖文詳解的詳細內容。更多資訊請關注PHP中文網其他相關文章!

    來源:php.cn
    本網站聲明
    本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
    熱門教學
    更多>
    最新下載
    更多>
    網站特效
    網站源碼
    網站素材
    前端模板