分析 微信網(wǎng)頁版 掃碼登錄
一次舌、來源于index.html的三個js文件
-
aq_common.js: 與網(wǎng)絡(luò)安全方面相關(guān) -
vendor_7ee9f11.js: 第三方依賴和庫 -
index_f5ac071.js: 重點！業(yè)務(wù)邏輯在這里面
來源于index.html的三個js文件
index.html 頭
index.html 尾
二桩了、jslogin: 請求二維碼
jslogin 的 Response Headers 中的 Content-Type為text/javascript
Response Headers
所以在拿到
Response 返回值后，全局變量window.QRLogin的屬性uuid被賦值，而這個uuid就是二維碼圖片的地址
jslogin 二維碼
從函數(shù)棧中可以看到：首先
r方法調(diào)用getUUID斥废，再由getUUID方法向微信服務(wù)器發(fā)送 ajax請求，請求的url為"jslogin?appid=..."给郊，拿到uuid
jslogin 調(diào)用函數(shù)棧
我們看看源碼牡肉，
r方法做了什么？
function r
大致是
r先調(diào)用t.getUUID方法返回一個Promise, then調(diào)用t.checkLogin方法,t.checkLogin也返回一個Promise淆九，checkLogin成功后調(diào)用o, o在下面會講到统锤，現(xiàn)在看看
checkLogin：從函數(shù)棧中可以看到：
checkLogin方法向微信服務(wù)器發(fā)送 ajax請求，請求的url為"login?loginicon=..."
login 調(diào)用函數(shù)棧
getUUID and checkLogin
三炭庙、login: 檢查 code 狀態(tài)
login code
四饲窿、login: 循環(huán)
下圖黃色區(qū)域中我們看到，資源列表顯示瀏覽器每間隔25秒左右就請求一次 login
login loop
為什么會這樣? 我們分析一下
function o：
五煤搜、o函數(shù): 遞歸調(diào)用
函數(shù)o會檢查參數(shù)c的code屬性免绿。
index_f5ac071.js
分析下 case 408:
當 code === 408 時，調(diào)用t.checkLogin方法擦盾，后面跟了一個then表示checkLogin是一個Promise嘲驾， then方法有兩個參數(shù)淌哟，第一個參數(shù)是當Promise變成接受狀態(tài)時調(diào)用函數(shù)o，而 o正是function o自身辽故，由此我們得知徒仓，這是一個遞歸調(diào)用，所以會出現(xiàn)上圖中循環(huán)請求login的情況;
200誊垢、201等等其它情況請大家自行參看源碼掉弛。
六、總結(jié) Login 流程
對于login的 Response返回值我們考慮下面幾種情況就差不多了:
- 當我們不做任何操作時喂走，系統(tǒng)循環(huán)請求
login
window.code=408; - 當我們通過手機掃碼后
window.code=201;
(當前用戶有頭像時返回值后面還會有userAvatar = 'data:img/jpg;base64...';) - 當我們在手機上確認登錄后
window.code=200; window.redirect_uri="https://wx2.qq.com/..."; - 當返回值為其它值時殃饿，我們刷新系統(tǒng)重新開始
偽代碼
- login.js
const login = {
start () {
// 終止外循環(huán) code === 200
// 內(nèi)循環(huán)條件 code === 408 201
const code = ''
while (true) {
if (code === '200') {
// 終止外循環(huán)
break
}
const uuid = jslogin()
code = login(uuid, 1)
while (true) {
if (code !== '201' && code !== '408') {
// 終止內(nèi)循環(huán)
break
}
code = login(uuid, 0)
}
}
}
}
Login流程圖
登錄流程
上一節(jié) Electron開發(fā)實戰(zhàn)之13-webwxapi-01
目錄
下一節(jié) Electron開發(fā)實戰(zhàn)之15-webwxapi-03
