在微信中打開網頁且需要調用微信登錄接口時，微信官方給我們提供了兩種登錄調用方式：靜默登錄和非靜默登錄；但是官方文檔中卻沒有說明在何種情況下使用靜默登錄，何種情況下使用非靜默登錄，所以在這里，我想將之前做項目關於這個問題的心得分享給大家。
一、閱讀官方文檔，實現兩種登錄方式
其實通過閱讀微信官方文檔，很容易就能分別實現兩種登錄方式，這里我貼一下微信官方文檔關於《微信網頁授權》的鏈接以及我的實現代碼（如果你已經實現了這兩步，就可以直接跳過這一部分啦）：
a. 微信網頁授權官方文檔鏈接
https://mp.weixin.qq.com/wiki?t=resource/res_main&id=mp1421140842
b. 我的實現代碼：
1、調用靜默登錄：
2、調用非靜默登錄：
可以看出，除了scope參數（其實這里可以通過加函數參數的方式將兩個方法合二為一）
3、獲取code之后，調用微信的接口獲取用戶信息（因為為了將appsecret保存在服務端，所以我們將這一步分為兩步：前端拿到code之后調用服務端login接口，服務端login接口根據code調用微信獲取用戶信息接口）
前端拿到code之后調用服務端login接口：
（因為我使用了react框架和react-router路由管理所以這里將調用服務端login接口寫在我的最外層組建的componentDidMount方法中，並通過判斷query中是否含有code的方式決定是否調用login方法）
服務端login接口根據code調用微信獲取用戶信息接口：
（這一步步驟略多，因為我的后端使用的是nodejs，但是因為網絡請求都是異步的，即使使用了Promise，代碼看起來還是很捉急【回調傷不起。。。】，具體方式那家可以參閱上方的鏈接：微信官方文檔）
二、靜默登錄及非靜默登錄的正確使用姿勢
回到這張文章的標題：微信H5中靜默登錄及非靜默登錄的正確使用姿勢
先上代碼：
這個代碼就是前文中“前端拿到code之后調用服務端login接口”的改裝，具體改裝方式就一點：在調用服務端login接口后如果拿不到用戶信息，則調用微信的非靜默登錄。
所以這里我們實現的登錄邏輯其實是：
1.先調用靜默登錄
2.拿到code之后調用后端login接口獲取用戶信息
3.根據2的結果：
如果拉取用戶信息成功：
執行客戶端登錄邏輯（這一步執行完整個登陸過程就結束了）
如果拉取用戶信息失敗：
執行非靜默登錄（這一步執行完就會跳到步驟2）
再說原因：
當一個微信用戶進入到我們的網頁時，我們沒法預先判定 ta 是否已經微信授權過我們的網頁，當我們第一次調用微信登錄接口時，我們就必須在靜默登錄與非靜默登錄中做出選擇，先來看調用兩者分別會產生什么樣的效果：
a.靜默登錄：用戶無感知；如果用戶曾經授權過該網頁，則后續拉去用戶信息會成功；如果用戶曾經沒有授權過該網頁，則后續無法拉取到用戶信息；
b.非靜默登錄：頁面會跳轉到授權頁面，請求用戶授權；如果用戶曾經授權過該網頁，則會顯示您近期已經授權過該應用；如果用戶曾經沒有授權過該網頁，則會請求用戶授權該網頁；
上文中斜體及下划線的地方即使兩種方式分別不好的地方；會產生這些缺點的根本原因就是：在一個用戶進入我們的網頁時，我們沒辦法判斷其以前是否使用微信登錄過我們的網頁，所以我們無法做出正確的選擇
但是我們終究要做出選擇，相比兩者的缺點，首先使用靜默登錄的缺點更能讓我們接受，因為使用靜默登錄失敗后用戶是無感知的，即使是沒有拉到用戶信息，我們也可以根據返回信息判斷從而進一步調用費靜默登錄；相反，如果首先使用非靜默登錄，則當用戶已經授權過應用時，頁面的來回跳轉顯然不是一個很好的用戶體驗，而且這也違背了微信官方提供非靜默登錄方式的初衷：近期已授權過的用戶無感知登錄
三、總結
以上就是我對於“微信H5中靜默登錄及非靜默登錄的正確使用姿勢”的看法啦，大家有什么心得和看法，也可以留言與我交流。