国产成人精品无码青草_亚洲国产美女精品久久久久∴_欧美人与鲁交大毛片免费_国产果冻豆传媒麻婆精东

18143453325 或 在線咨詢 在線咨詢
18143453325 或 在線咨詢
所在位置： 首頁 > 營銷資訊 > 網(wǎng)站運(yùn)營 > 微信的網(wǎng)頁版掃碼登陸原理？

微信的網(wǎng)頁版掃碼登陸原理？

時(shí)間：2022-09-01 19:57:01 | 來源：網(wǎng)站運(yùn)營

時(shí)間：2022-09-01 19:57:01 來源：網(wǎng)站運(yùn)營

微信網(wǎng)頁掃碼登陸的原理是什么關(guān)注者151被瀏覽52,413

5 個(gè)回答

本站用戶Web應(yīng)用多賬號系統(tǒng)設(shè)計(jì)及微信掃碼登錄實(shí)現(xiàn)

1 前言概述

公司對功能測試，性能測試，安全測試等等都做了比較好的自動化后，急需要一個(gè)MIS系統(tǒng)來統(tǒng)一管理這些結(jié)果及報(bào)表。

此MIS系統(tǒng)特點(diǎn)如下：

  • 僅內(nèi)部人員使用
  • 部署在公網(wǎng)
基于如上特點(diǎn)，顯然讓公司的人為這樣一個(gè)內(nèi)部系統(tǒng)而實(shí)現(xiàn)一個(gè)完整的賬號不太現(xiàn)實(shí)，要兼顧隱私性和便捷性的需求，作者想到了使用微信掃碼登錄來做為身份認(rèn)證，然后后臺管理員審核，這樣就可以達(dá)到如下的效果：

  • 可以實(shí)現(xiàn)無門檻注冊（微信掃一掃就完成注冊），保證了便捷性
  • 系統(tǒng)對未審核通過的人員進(jìn)行隔離，保證了隱私性
然后在開發(fā)完畢此系統(tǒng)后，覺得有必要再總結(jié)而且小升華一下，于是就有了本文的寫作動機(jī)。

2 多賬號原理

本來本文的目的是 “實(shí)現(xiàn)微信掃碼登錄” ，但是后來覺得僅僅是為了實(shí)現(xiàn)這個(gè)功能，本文的立意又顯得太低。所以就在此處擴(kuò)展一下為 “多賬號授權(quán)登錄系統(tǒng)” 。

在近些年來，隨著互聯(lián)網(wǎng)越來越開發(fā)和協(xié)作，目前的系統(tǒng)登錄方式也越來越多，已經(jīng)遠(yuǎn)遠(yuǎn)超越了以前的單用戶名的方式了。除了用戶名密碼外，一般網(wǎng)站還提供如下的登錄方式：

  • 第三方授權(quán)
    • 微信/QQ/新浪微博（國內(nèi)）
    • Google/Facebook/Github（國外）
  • 綁定賬號
    • 手機(jī)號
    • 郵箱號
基于如上的幾種登錄方式，就形成了如下的 “多賬號登錄體系圖”：


基本原理：

  • 第三方授權(quán)
    • 能夠從可信第三方獲取到相應(yīng)的返回值（用戶信息）,然后和 user_id 綁定
    • 不需要額外再輸入密碼便完成鑒權(quán)過程
    • 會創(chuàng)建一組今后可以修改的 user_id 作為 占位用戶
    • 鑒權(quán)成功后設(shè)置session狀態(tài)
  • 綁定賬號
    • 事先已經(jīng)完成了 user_id 的注冊
    • 完成了相應(yīng)賬號綁定，即表示認(rèn)可和 user_id 均能登錄
    • 使用和 user_id 同樣的或者不同的密碼體系（一般使用相同密碼）登錄完成鑒權(quán)
    • 鑒權(quán)成功后設(shè)置session狀態(tài)
關(guān)于 綁定賬號 的方式比較簡單，此處就不再贅述。

基于 第三方授權(quán) 的方式，則比較精妙，可學(xué)習(xí)性比較強(qiáng)，因?yàn)榛诨ヂ?lián)網(wǎng)越來越開放的特性，此方式肯定會越來越多的被應(yīng)用，越來越成為主流。下面將以 微信掃碼 授權(quán)登錄為例子來進(jìn)行講解。


3 掃碼登錄邏輯

使用 微信掃碼 授權(quán)登錄的邏輯圖如下：

其中主要處理的事情如下：

  • 向第三方發(fā)起鑒權(quán)請求
  • 第三方鑒權(quán)回調(diào)
  • 和MIS系統(tǒng)本地 user_id 體系關(guān)聯(lián)（新建用戶）
  • 設(shè)置session登錄狀態(tài)
  • 處理不同結(jié)果的顯示界面
4 微信掃碼過程

使用過微信掃碼登錄系統(tǒng)的人會有如下的過程體驗(yàn)（以著名社交網(wǎng)站 本站 為例子）：

  1. 打開 本站 主頁，點(diǎn)擊 “微信登錄” 的圖標(biāo)
  2. 瀏覽器重定向到微信域（見下圖標(biāo)記1）下面的二維碼頁面
  3. 用戶掏出手機(jī)打開微信，掃一掃
  4. 在手機(jī)微信上點(diǎn)擊授權(quán)
  5. PC上面的二維碼頁面顯示授權(quán)成功，并轉(zhuǎn)向到 本站 首頁，認(rèn)證成功
整個(gè)過程對于終端用戶來說，只有短短幾秒，而且不用輸入任何密碼，可以說是一種非常安全又便捷的體驗(yàn)。

那么問題來了，通過微信掃描二維碼，并完成MIS系統(tǒng)注冊登錄這個(gè)短短幾秒的時(shí)間里面，到底發(fā)生了哪些事情？

通過瀏覽器抓包，對幾個(gè)關(guān)鍵通訊過程進(jìn)行分析。

PC瀏覽器會依次發(fā)起兩個(gè)長連接（比較長時(shí)處于 pending 狀態(tài)）的請求：

  • 等待手機(jī)端的微信掃碼（上圖標(biāo)記2）
  • 等待手機(jī)微信點(diǎn)擊 “確認(rèn)登錄” 按鈕（上圖標(biāo)記3）
這兩個(gè)狀態(tài)都會反饋到PC端的二維碼頁面，在手機(jī)端完成確認(rèn)后，PC瀏覽器上面的頁面就會生定向到授權(quán)后的頁面（如 本站 首頁）。

具體各方通訊時(shí)序圖如下：



上圖對整個(gè)過程中通訊涉及的對象進(jìn)行了清楚的描述，關(guān)于上圖數(shù)字標(biāo)注部分注解如下：

  1. 網(wǎng)站服務(wù)器向微信API傳入帶有 回調(diào)url 的參數(shù)
  2. 手機(jī)微信通過攝像頭掃二維碼，從 光學(xué)原理 上完成數(shù)據(jù)的傳遞
  3. PC瀏覽器上查詢掃碼狀態(tài)的長連接收到返回的狀態(tài)值，并更新提示
  4. PC瀏覽器上查詢手機(jī)客戶端點(diǎn)擊確認(rèn)按鈕的狀態(tài)值，并更新提示，然后重定向到 過程1 中傳遞url地址上
  5. 網(wǎng)站服務(wù)器在授權(quán)成功后，完成本系統(tǒng)的用戶注冊或者登錄的業(yè)務(wù)邏輯
  6. 網(wǎng)站服務(wù)器重定向到用戶登錄成功的界面中（如果對于新注冊用戶不需要額外的審核的話）
關(guān)于微信掃碼認(rèn)證部分的開發(fā)，本文不再贅述，只給出如下注意事項(xiàng)：

  • 微信平臺的各種API接口請參考：微信開放平臺提供的官方文檔
  • 微信掃碼登錄的開發(fā)權(quán)限需要在微信開放平臺中進(jìn)行企業(yè)資質(zhì)認(rèn)證（個(gè)人用戶無法獲得）
  • 回調(diào)url 的域必需在微信開放平臺中進(jìn)行填寫備案，本地開發(fā)時(shí)傳遞的 回調(diào)url 參數(shù)必須和備案一致
5 代碼實(shí)現(xiàn)

根據(jù)如上原理,最后將提供具體實(shí)現(xiàn)代碼以供參考 ，為了簡潔，有一些通用的工具函數(shù)的具體實(shí)現(xiàn)就不貼出來了。

使用 python3.5 實(shí)現(xiàn) 微信掃碼登錄Web應(yīng)用程序 的參考代碼如下所示。

對應(yīng) 上圖標(biāo)識1 中的代碼實(shí)現(xiàn)：

class WeChatAuth(MyBaseHandler): """ 點(diǎn)擊后直接重定向到微信登錄界面 - wechat QR掃碼登錄,web端 - 直接重定向到微信的頁面 """ def get(self): state = get_uuid1_key() # 生成唯一的碼 wx_qr_param = dict( appid=wx_webapp.appid, # redirect_uri=wx_webapp.qr_auth_cb_url, redirect_uri='http://your.domain.com/wechat/wechat-auth-callback/', response_type='code', scope=wx_webapp.login_scope, state=state ) ##wechat_redirect wx_qr_url = 'https://open.weixin.qq.com/connect/qrconnect?%s#wechat_redirect' / % urllib.parse.urlencode(wx_qr_param) self.redirect(wx_qr_url)對應(yīng) 上圖標(biāo)識2 中的代碼實(shí)現(xiàn)：

class WeChatAuthCallback(MyBaseHandler): """ 微信第三方認(rèn)證之后，開始將此用戶在本系統(tǒng)沉淀下來 - 用于微信服務(wù)器傳回code的值 - 此處要再請求獲得access_token """ async def get(self): wx_code = self.get_argument('code', '') wx_state = self.get_argument('state', '') if wx_code == '': res = ConstData.msg_forbidden dlog.debug(res) self.write(res) return dlog.debug('wx_code:%s,wx_state:%s' % (wx_code, wx_state)) access_token_res = wx_webapp.get_auth_access_token(code=wx_code, state=wx_state) user_info = wx_webapp.get_auth_user_info(auth_access_token_res=access_token_res) """:type:WeChatUser""" # 微信返回的用戶信息串 if user_info is None: res = ConstData.msg_forbidden dlog.debug(res) self.write(res) return wechat_user = await MisWeChatUser.objects.get(openid=user_info.openid, unionid=user_info.unionid) """:type:MisWeChatUser""" # 一個(gè)Open_id下面所有的id都是靠union來區(qū)分賬號 if wechat_user is not None: user = await User.objects.get(user_id=wechat_user.user_id) assert user is not None if user.active: if await user.is_online(): await self.update_session() # 更新時(shí)間 else: await self.create_session(user) # 新增加一個(gè)session self.write('in authorized page') # self.redirect('/') # todo 重定向到登錄授權(quán)后的主頁 return # 如果不存在wechat備案信息,則需要備案wechat信息,而且新注冊初始賬號 default_new_user_id = 'u_' + get_uuid1_key() new_wechat_user = MisWeChatUser( openid=user_info.openid, nickname=user_info.nickname, unionid=user_info.unionid, # user_id=wx_webapp.appid + '_' + user_info.unionid, # 通過微信號登錄生成的一個(gè)唯一的用戶名，后面可以提供修改 user_id=default_new_user_id, appid=wx_webapp.appid ) new_wechat_user.set_default_rc_tag() # rand_salt = get_rand_salt() new_user = User( user_id=default_new_user_id, # salt=rand_salt, # 防止別人md5撞庫反向破解的隨機(jī)數(shù) # passwd=StringField() # 密碼,通過第三方登錄的默認(rèn)不設(shè)置 first_name=user_info.nickname, status=FieldDict.user_status_init, # 表示是可更改狀態(tài) active=False, ) new_user.set_default_rc_tag() await new_wechat_user.save() await new_user.save() self.write('in unauthorized page') # self.redirect(URL_ROOT) # todo 導(dǎo)入到未授權(quán)的頁面

6 功能測試

設(shè)計(jì)兩組測試用例。

檢查微信用戶掃碼后能否完成上述流程:

  1. 用A微信賬號掃碼登錄，查看是否自動注冊
  2. 是否提示重定向到 “未授權(quán)頁面”
在數(shù)據(jù)庫中修改A微信自動注冊的用戶狀態(tài)為審核通過后再掃碼登錄:

  1. 修改A用戶狀態(tài)為 active=True
  2. 是否提示重定向到 “授權(quán)頁面”
  3. 是否在數(shù)據(jù)庫中看到登錄的session狀態(tài)
測試截圖如下：



7 小結(jié)

如果我是一個(gè)產(chǎn)品經(jīng)理，如果我做一個(gè)web應(yīng)用的產(chǎn)品，那么在產(chǎn)品早期階段，我肯定會選擇微信登錄的方式，因?yàn)檫@種方式的登錄門檻實(shí)在是太低了，用戶試用產(chǎn)品的門檻也降到了最低，后續(xù)的活躍程度至少不會受到登錄的門檻的影響。

可惜，還有好多產(chǎn)品經(jīng)理不懂這個(gè)，這么重要的入口都沒有稍微花點(diǎn)心思去打磨。
74
73
25
news

版權(quán)所有? 億企邦 1997-2022 保留一切法律許可權(quán)利。

為了最佳展示效果，本站不支持IE9及以下版本的瀏覽器，建議您使用谷歌Chrome瀏覽器。 點(diǎn)擊下載Chrome瀏覽器
關(guān)閉