引言
這個問題我是在今年8月份的時候被問到過，當(dāng)時一臉懵，當(dāng)面試官一提出這個問題，我當(dāng)場回答這個沒接觸過，可能不知道。面試官笑了笑：這是一個設(shè)計題，如果你原本就會的話，我就不會要你來設(shè)計了。
我：（苦笑...）憑借三寸不爛之舌和面試官討論了起來，說完之后信心滿滿，但結(jié)果反手就收到了一份正式地感謝信。
當(dāng)時，面試官問你還有什么想要問我的嗎？ 我請教了這個問題，面試官回答說，你其實也猜到了一點，但是我想要的那個邏輯你沒理清楚，然后吧啦吧啦引導(dǎo)了一下，告知可以待會學(xué)習(xí)一下，這個也挺多人討論的。
直到今天，又收到了一份“新”的感謝信后，我突然回想到了這個問題，想了想，這個問題不能一直丟著不管，我不去學(xué)習(xí)，當(dāng)然不會自然就明白其中原理，下面我們一起來探討一下吧。
如若有幫助到您，請一鍵三連，當(dāng)然，本文表述有問題的地方，歡迎讀者指正，也是一個學(xué)習(xí)的過程，謝謝~
基本技術(shù)原理
掃碼登錄功能到底是什么樣的？
現(xiàn)在大部分手機上都裝有微信、qq和淘寶這一類的軟件。而這些app都有他們相對應(yīng)的網(wǎng)頁端。為了讓用戶在使用他們的網(wǎng)頁時登錄更加方便和安全，使用手機掃一掃就可以登錄的服務(wù)，就顯得自然而然了。
那么，此時問題來了，我們訪問某個網(wǎng)頁，這個網(wǎng)頁怎么就出現(xiàn)了這個二維碼呢？有了這個二維碼了，它怎么知道是我掃的，還是其它人掃的呢？好神奇??！當(dāng)時面試完之后，我就有這個疑惑，下文我們逐一解答。
二維碼是怎么出現(xiàn)的？
首先，用戶打開網(wǎng)站的登錄首頁的時候，瀏覽器就會向?qū)?yīng)網(wǎng)頁服務(wù)器發(fā)送獲取登錄二維碼的請求，服務(wù)器收到請求后，會隨機生成一個 uuid，將這個 uuid 作為key值存入redis服務(wù)器，同時設(shè)置一個過期時間，一旦過期后，用戶登錄二維碼需要進行刷新重新獲取。
同時，將這個key值和公司的驗證字符串合在一起，通過二維碼生成接口，生成一個二維碼的圖片。然后，將二維碼圖片和 uuid 一起返回給用戶瀏覽器。
例如，對于某個登錄的網(wǎng)頁（我打開的是力扣的微信登錄地址），我們習(xí)慣性地打開了瀏覽器的開發(fā)者工具，我發(fā)現(xiàn)當(dāng)我在登錄頁面停滯一小會（大概30秒樣子），請求鏈接會不斷發(fā)生變化，如下圖所示：
其中就有一個字段 uuid，伴隨著鏈接的更新而自增變化。這就很好解釋了上文，服務(wù)器端會通過這個 uuid 調(diào)用相關(guān)接口來返回給瀏覽器一個二維碼。
所以，二維碼是誰生成的呢？別急，繼續(xù)分析：
當(dāng)用戶打開網(wǎng)站后，網(wǎng)站后臺根據(jù)微信 OAuth2.0 協(xié)議向微信開發(fā)平臺請求授權(quán)登錄，并傳遞事先在微信開發(fā)平臺中審核通過的 AppID 和 AppSecrect 等參數(shù)
微信開發(fā)平臺對AppID等參數(shù)進行驗證，并向網(wǎng)站后臺返回二維碼
網(wǎng)站后臺將二維碼傳送至網(wǎng)站前端進行顯示
原來，還有微信開發(fā)平臺參與，由它來生成我們的二維碼，OK，我們接著下一個問題的思考。
怎么知道是我掃了這個二維碼？
上文我們了解到了二維碼的生成，并且在將 uuid 作為key值存入redis服務(wù)器，那么只有這個 key 值，哪里來的用戶相關(guān)信息呢？帶著這個思考，繼續(xù)探討吧。
上文我們獲取了網(wǎng)頁二維碼，現(xiàn)在來到了用戶掃這個二維碼的時候了，當(dāng)用戶拿出手機掃描二維碼，就可以得到一個驗證信息和一個 uuid。由于手機端已經(jīng)進行過了登錄，在訪問手機端的服務(wù)器的時候，參數(shù)中都會攜帶一個用戶的token，手機端服務(wù)器可以從中解析到用戶的 userId（這里從token中取值而不是手機端直接傳userid是為了安全，直接傳userid可能會被截獲和修改，token是加密的，被修改的風(fēng)險會小很多）。
手機端將解析到的數(shù)據(jù)與微信賬號綁定，向微信開發(fā)平臺發(fā)送登錄驗證請求，微信開發(fā)平臺驗證綁定數(shù)據(jù)，調(diào)用網(wǎng)站后臺的回調(diào)接口，發(fā)送授權(quán)臨時票據(jù) code ，如果授權(quán)成功，返回一個確認信息給手機端。
手機端收到返回后，將登錄確認框顯示給用戶（防止用戶誤操作，同時使登錄更加人性化）。用戶確認是進行的登錄操作后，手機再次發(fā)送請求。服務(wù)器拿到 uuId 和 userId 后，將用戶的userid作為value值存入redis中以uuid作為key的鍵值對中。
網(wǎng)站后臺接收到code，表明微信開發(fā)平臺同意數(shù)據(jù)請求
網(wǎng)站后臺根據(jù)code參數(shù)，再加上AppID和AppSecret請求微信開發(fā)平臺換取 access_token
微信開發(fā)平臺驗證參數(shù)，并返回 access_token
網(wǎng)站后臺收到 access_token 后即可進行參數(shù)分析獲得用戶賬號數(shù)據(jù)
這里，我們就拿到了用戶的相關(guān)信息了。
AppID：應(yīng)用唯一標識，在微信開放平臺提交應(yīng)用審核通過后獲得
AppSecret：應(yīng)用密鑰，在微信開放平臺提交應(yīng)用審核通過后獲得
code：授權(quán)臨時票據(jù)，第三方通過code進行獲取access_token的時候需要用到，code的超時時間為10分鐘，一個code只能成功換取一次access_token 即失效。code的臨時性和一次性保障了微信授權(quán)登錄的安全性。
access_token：用戶授權(quán)第三方應(yīng)用發(fā)起接口調(diào)用的憑證
整個過程從網(wǎng)站后臺向微信開發(fā)平臺請求授權(quán)登錄開始，最終目的是為了獲得 access_token。
在獲得了 access_token 后就可以解析用戶的一些基本信息，包括頭像、用戶名、性別、城市等。這樣一來，整個微信掃描登錄的過程就完成了。
整個過程流程圖
本文參考
喬戈里：阿里面試官：分別說說微信和淘寶掃碼登錄背后的實現(xiàn)原理？
感謝以上大佬的文章，尊重勞動成果，特此提出原本鏈接。
最后
文章產(chǎn)出不易，還望各位小伙伴們支持一波！
作者：Chocolate
鏈接：https://juejin.im/post/6881597417637511181
來源：掘金
