微信小程序受權流程方案（unionID版）

什麼是UnionID？

微信官方的定義：若是開發者擁有多個移動應用、網站應用、和公衆賬號（包括小程序），可經過 UnionID 來區分用戶的惟一性，由於只要是同一個微信開放平臺賬號下的移動應用、網站應用和公衆賬號（包括小程序），用戶的 UnionID 是惟一的。換句話說，同一用戶，對同一個微信開放平臺下的不一樣應用，unionid是相同的。

簡單來講，是開放平臺中對用戶身份的惟一標識。可先閱讀《微信開發中OpenID 和 UnionID的區別》進行了解。

獲取 UnionID 的方式

綁定了開發者賬號的小程序，能夠經過如下途徑獲取 UnionID。

1. 調用接口 wx.getUserInfo，從解密數據中獲取 UnionID。注意本接口須要用戶受權，請開發者妥善處理用戶拒絕受權後的狀況。
2. 若是開發者賬號下存在同主體的公衆號，而且該用戶已經關注了該公衆號。開發者能夠直接經過 wx.login + code2Session 獲取到該用戶 UnionID，無須用戶再次受權。
3. 若是開發者賬號下存在同主體的公衆號或移動應用，而且該用戶已經受權登陸過該公衆號或移動應用。開發者也能夠直接經過 wx.login + code2Session 獲取到該用戶 UnionID ，無須用戶再次受權。
4. 用戶在小程序（暫不支持小遊戲）中支付完成後，開發者能夠直接經過getPaidUnionId接口獲取該用戶的 UnionID，無需用戶受權。注意：本接口僅在用戶支付完成後的5分鐘內有效，請開發者妥善處理。
5. 小程序端調用雲函數時，若是開發者賬號下存在同主體的公衆號，而且該用戶已經關注了該公衆號，可在雲函數中經過 cloud.getWXContext 獲取 UnionID。
6. 小程序端調用雲函數時，若是開發者賬號下存在同主體的公衆號或移動應用，而且該用戶已經受權登陸過該公衆號或移動應用，也可在雲函數中經過 cloud.getWXContext 獲取 UnionID。

如下將針對第一種方式 —— 從 wx.getUserInfo 的解密數據中獲取 UnionID 的方案，設計小程序在業務上的登陸流程

小程序登陸流程方案

如圖所示

1. 調用 wx.login 接口，獲得 code ( 注意 code 只能使用一次，且有效期五分鐘 )

2. 經過 <button> 組件定義用戶受權框，待用戶點擊時，彈出受權框

3. 在用戶贊成受權的狀況下，執行如下流程函數

   3.1 從新執行 wx.login 獲得 code。（爲何要從新執行呢？下面講）

   3.2 執行 wx.getUserInfo 接口，獲得用戶的基礎數據以及一些加密數據 （ 在已獲得用戶贊成受權的狀況下，該接口將直接返回用戶的數據 ）

4. 將相關數據傳給後臺，後臺解密獲得 UnionID

詳細流程請看下圖

上面留了一個小疑問。

爲何在用戶贊成受權的狀況下，要從新執行 wx.login，從新走一次獲取數據的流程呢？

結合如下兩點說明：

1. 細心的讀者應該發現， code 是一個極其奇妙的字段

   • 只能使用一次
   • 有效期只有5分鐘

2. 經過<button> 觸發的彈出受權框，在等待用戶受權的時間裏，不能保證是否會超過5分鐘（這裏不能假設用戶都是立刻進行響應的，有可能恰好接個電話什麼的，就開始煲電話粥了，煲完以後再點擊受權，🤣🤣🤣）

結合上述兩點，爲防止用戶操做超時，所以在用戶贊成受權的狀況下，從新再走一次 login 和 getUserInfo 的流程。

總結

因爲有大量的場景須要使用到UnionID，此方案是以獲取 UnionID 爲重點的方案。

若是不須要使用到 UnionID 的話，僅僅使用 OpenID ，整個流程能夠簡化許多。

與此同時，在系統設計用戶受權的狀況下，儘量讓用戶在拒絕受權的狀況下，也能夠參與或瀏覽該產品，不然會很容易由於一個硬性的受權邏輯而提升了用戶使用的門檻，避免所以致使用戶量不高的問題。

若是你也在優化或研究小程序的登陸模塊，歡迎和咱們一塊兒交流~

做者簡介：土撥鼠，蘆葦科技web前端開發工程師，表明做品：飛花亭小程序、續航基因、YY表情紅包、YY疊方塊直播競賽小遊戲。擅長網站建設、公衆號開發、微信小程序開發、小遊戲、公衆號開發，專一於前端框架、服務端渲染、SEO技術、交互設計、圖像繪製、數據分析等研究，有興趣的小夥伴來撩撩咱們~ web@talkmoney.cn

訪問 www.talkmoney.cn 瞭解更多