?????? 手機(jī)掃碼二維碼實(shí)現(xiàn)登錄某個(gè)網(wǎng)站的操作過程為旬蟋，手機(jī)登錄某個(gè)APP灯变，利用“掃一掃”功能掃描網(wǎng)頁(yè)上的二維碼，掃描成功后菜循，提示“登錄網(wǎng)頁(yè)版XX”翘地，同時(shí)網(wǎng)頁(yè)上顯示“成功掃描 請(qǐng)?jiān)谑謾C(jī)點(diǎn)擊確認(rèn)以登錄”，手機(jī)端點(diǎn)擊“登錄網(wǎng)頁(yè)版XX”癌幕，網(wǎng)頁(yè)跳轉(zhuǎn)到用戶登錄后的首頁(yè)衙耕。

? ? ? 整個(gè)掃碼登錄的操作過程還是挺簡(jiǎn)單的，而且交互地實(shí)時(shí)性比較好勺远，如果網(wǎng)絡(luò)不是非常阻塞橙喘，整個(gè)過程還是非常快的胶逢。那它是如何實(shí)現(xiàn)的呢厅瞎？

? ? 其基本思想是，PC瀏覽器首先獲得一個(gè)臨時(shí) id初坠，這個(gè)id用二維碼包裝著和簸，并且設(shè)置了有效時(shí)間，這個(gè)id不是UID（user ID）碟刺，只是一個(gè)唯一的由字母和數(shù)字組合成的標(biāo)識(shí)符锁保。然后等待客戶端掃描帶有此 id 的二維碼，二維碼的轉(zhuǎn)碼規(guī)則是統(tǒng)一的，所以意味著爽柒，只要是個(gè)二維碼掃描軟件吴菠，誰都能拿到這個(gè)鏈接。拿到鏈接沒有用浩村，重要的是誰拿到鏈接（即電腦端是如何知道是哪個(gè)APP賬號(hào)掃的它）做葵。PC端瀏覽器通過長(zhǎng)連接或不斷輪詢某個(gè)登錄授權(quán)接口，查看與此id關(guān)聯(lián)的二維碼是否被手機(jī)客戶端掃描心墅。手機(jī)客戶端掃描時(shí)蜂挪，會(huì)給后端服務(wù)器（無論手機(jī)還是網(wǎng)頁(yè)都對(duì)應(yīng)著后端同一個(gè)或有相互關(guān)系的服務(wù)器）傳送這個(gè)id，即發(fā)送一條信息給服務(wù)器嗓化，告訴服務(wù)器棠涮，現(xiàn)在是誰使用了這個(gè)二維碼鏈接。服務(wù)器在收到這個(gè)id后刺覆，在給PC瀏覽器的長(zhǎng)連接或輪詢請(qǐng)求中響應(yīng)一些不同的信息說明該二維碼鏈接被掃描了严肪，并要求在手機(jī)端去確認(rèn)。當(dāng)手機(jī)客戶端點(diǎn)擊確認(rèn)后谦屑，pc瀏覽器端會(huì)獲得服務(wù)器授信的令牌（或設(shè)置的sessionID）驳糯，這樣PC瀏覽器就可以攜帶這個(gè)令牌進(jìn)行隨后的信息交互。 圖示如

? ? ?二維碼鏈接在超時(shí)氢橙、網(wǎng)絡(luò)斷開酝枢、其他設(shè)備上登錄后，此前獲得的令牌或丟失悍手、或失效帘睦，對(duì)授權(quán)過程形成有效的安全防護(hù)。

下面看一下某公司掃碼登錄的過程坦康，首先看一下網(wǎng)站給出的二維碼竣付，

實(shí)際上任何一個(gè)二維碼表示的都是一串字符串。通過草料二維碼網(wǎng)站解析出這張二維碼表示的是如下字符串：

http://mtest.[公司域名]/passport/scan_login.php?scan_source=pc&code=201903131952062593943457001ba84b

其中code是當(dāng)前網(wǎng)頁(yè)給出的一個(gè)唯一ID滞欠。每當(dāng)打開一次或刷新一次古胆，都會(huì)生成一個(gè)含有唯一id的二維碼，確定登錄用戶的唯一性筛璧。

當(dāng)打開了二維碼登錄頁(yè)面后逸绎，我們通過控制臺(tái)看網(wǎng)路請(qǐng)求，會(huì)發(fā)現(xiàn)網(wǎng)頁(yè)在輪詢調(diào)用接口：

如果沒有掃碼夭谤，返回的是：

jsonp1552477921883({

???????? "returnval":1001

})

如果手機(jī)掃了碼棺牧，手機(jī)端會(huì)發(fā)送一次http://mtest.[公司域名]/index.php請(qǐng)求

該請(qǐng)求會(huì)攜帶二維碼的id，它的返回信息：成功設(shè)置狀態(tài)為已掃描待登錄沮翔。但是手機(jī)上沒點(diǎn)擊“確認(rèn)登錄”的話陨帆，瀏覽器上繼續(xù)輪回接口，

但這時(shí)接口返回的是

jsonp1552477921887({

???????? "returnval":1002

})

可見狀態(tài)已發(fā)生了變化采蚀，當(dāng)手機(jī)端點(diǎn)擊“確認(rèn)登錄”后疲牵，手機(jī)端又調(diào)用一次http://mtest.[公司域名]/index.php請(qǐng)求

這次請(qǐng)求的返回信息：登錄成功。而且與上次請(qǐng)求攜帶的參數(shù)幾乎一樣榆鼠。

此時(shí)查看pc端輪詢接口的請(qǐng)求和響應(yīng)如下纲爸，

接口返回的是：

jsonp1552477921895({

???????? "returnval":1003

})

這個(gè)請(qǐng)求響應(yīng)中，服務(wù)器同時(shí)設(shè)置了sessionID和其他一些cookie信息

HTTP/1.1 200 OK

Server: nginx/1.2.0

Date: Wed, 13 Mar 2019 11:52:39 GMT

Content-Type: text/html

X-Powered-By: PHP/5.2.10

.......

Set-Cookie: sessionID=pc_8d08c656a23b4156c173a4554db993fde21fad3dcab7bcf4bbfbb1e85fcccaa0;path=/; domain=[公司域名]

Content-Encoding: gzip

Vary: Accept-Encoding

Transfer-Encoding: chunked

Connection: Keep-alive

?

jsonp1552477921895({"returnval":1003})

? ? ?這樣就PC瀏覽器就得到了session信息妆够，后續(xù)的會(huì)話就可以免登陸了识啦。

我只是知識(shí)的搬運(yùn)工，如有侵權(quán)神妹，請(qǐng)留言颓哮，分分鐘刪除。