奇舞團資深前端教你,什麼是 Web 驗證

本文作者:韓永剛,360奇舞團 前端開發工程師。

本文將以時間維度介紹一些目前常見的Web驗證方法以及相關協議,帶你瞭解Web驗證的過去、現在與未來。

傳統身份驗證方式

過去普遍的做法可能是這樣的

註冊

  • 前端註冊頁面填寫用戶名和密碼錶單,發送給後臺服務器

  • 後臺服務器將接收到的用戶名和密碼進行加密並插入到數據庫,然後回饋是否成功的信息給前端頁面。

登錄

  • 前端登錄頁面填寫用戶名和密碼錶單,發送給後臺服務器

  • 後臺服務器將接收到的用戶名和密碼進行加密後與數據庫儲存信息進行對比,如果賬號密碼一致則返回給前端登錄成功信息,不一致則返回失敗信息。

這種做法存在普遍問題

  • 當登錄環境不安全時,輸入密碼時可能被監控

  • 發送密碼到服務器的過程中可能被劫持

  • 密碼存儲在數據庫如果被黑客攻擊可能造成大量密碼泄露

這種做法最大的問題在於你需要輸入密碼

  • 人們通常使用一個密碼應對所有賬號,而攻擊者獲取密碼的方式又數不勝數,一旦在某個疏於防備的瞬間泄露了一個密碼,那麼該用戶所有賬號都將面臨巨大安全風險

第三方登錄方式

現在,越來越多的站點開放了第三方登錄的功能,使得賬號密碼登錄不再是唯一的身份驗證方式,在可以進行第三方登錄的站點,人們通常選擇使用第三方登錄的方式進行身份驗證。實現第三方登錄有兩種協議,分別爲OpenID開放認證協議與OAuth開放授權協議

OpenID和OAuth完全是爲了兩種不同的需求而生,OpenID的目標是爲了幫助網站確認一個用戶的身份 ,OAuth的目標是爲了授權第三方在可控範圍下訪問用戶資源,OAuth有兩個版本,OAuth1.0由於其實現較爲複雜,已經基本被OAuth2.0所取代,以下分別對兩種協議進行講解

OpenID 開放認證協議

定義

  • OpenID是一個去中心化的網上身份認證系統。對於支持OpenID的網站,用戶不需要記住像用戶名和密碼這樣的傳統驗證標記。取而代之的是,他們只需要預先在一個作爲OpenID身份提供者(identity provider, IdP)的網站上註冊,比如Google。OpenID是去中心化的,任何網站都可以使用OpenID來作爲用戶登錄的一種方式,任何網站也都可以作爲OpenID身份提供者。OpenID既解決了問題而又不需要依賴於中心性的網站來確認數字身份。

  • OpenID是專爲登錄認證而生,它使用簡單,門檻很低。一個網站如果想要接入OpenID認證是非常簡單的,不需要創建應用,不需要App Key,不需要Secret,只需要將用戶導向OpenID Provider的Entry並帶上Callback,用戶只要同意提供信息,你就可以拿到這個用戶的唯一標識。對於站點來說只要有人使用Google OpenID授權並返回這個唯一標識那就是我在登錄。

優點

  • 使用門檻變低,免去註冊流程,且用戶不再需要輸入密碼,可直接使用第三方登錄,有利於產品的廣泛傳播

  • 由於客戶端不在需要輸入密碼,很大程度上減少了安全風險,客戶端不接觸用戶密碼,服務器端更易於集中保護

缺點

  • 依賴開放平臺的安全防護能力,因爲開放平臺本身也可能是使用賬號密碼登錄或者其他第三方平臺登錄,所以開放平臺本身也會出現一定的安全風險。如果開放平臺本身出現安全問題,那麼所有與其關聯的第三方認證站點都將會出現安全問題

  • 依賴開放平臺的認證,如果開放平臺的穩定性不達標,會導致自身登錄穩定性差。如第三方平臺暫時不可用,則自身登錄也不可用,如果開放平臺惡意不給予認證,那麼用戶將無法登錄,這個在較大的站點上是致命的。

  • 用戶流失的風險,因爲用戶只記得是用第三方登錄的,而往往不是該網站的帳號,弱化了自身賬號的影響力。

OAuth2.0 開放授權協議

定義

  • 提到OAuth,可以想像這樣一幅畫面,在一個炎熱且忙碌的夏天,小明與妻子在公司不分晝夜的趕着項目,可家裏又有老人需要照顧,所以小明決定請一個保姆照顧老人,但是又覺得如果保姆能在家裏亂走的話很不放心,就授權給保姆一個只能打開老人房門且有效期僅爲7天的臨時密碼憑證,之後一週內保姆拿着這個臨時密碼憑證便可以不經過小明同意隨意出入老人房間,但不能進入小明和他妻子的房間。

  • 我們把上面的例子搬到互聯網,就是 OAuth 的設計了,OAuth與OpenID最大的區別就是,OpenID是一種認證協議,是開放平臺給第三方一個能夠代表用戶身份的唯一標識,而OAuth是一種授權協議。授權允許第三方直接從開放平臺讀取用戶信息。

優點

  • 使用門檻變低,免去註冊流程,且用戶不再需要輸入密碼,可直接使用第三方登錄,有利於產品的廣泛傳播

  • 由於客戶端不在需要輸入密碼,很大程度上減少了安全風險,客戶端不接觸用戶密碼,服務器端更易於集中保護

  • 客戶可以具有不同的信任級別,級別越高,可獲取資料越多

缺點

  • 依賴開放平臺的安全防護能力,因爲開放平臺本身也可能是使用賬號密碼登錄或者其他第三方平臺登錄,所以開放平臺本身也會出現一定的安全風險。如果開放平臺本身出現安全問題,那麼所有與其關聯的第三方認證站點都將會出現安全問題

  • 依賴開放平臺的授權,如果開放平臺的穩定性不達標,會導致自身登錄穩定性差。如開放平臺暫時不可用,則自身登錄也不可用,如果開放平臺惡意不給予授權,那麼用戶將無法登錄,這個在較大的站點上是致命的。

  • 用戶流失的風險,因爲用戶只記得是用第三方登錄的,而往往不是該網站的帳號,弱化了自身賬號的影響力。

  • 站點獲取到開放平臺用戶的臨時權限後利用這些權限來做什麼完全由該站點決定,在一定程度上會帶來安全隱患

第三方登錄總結

第三方登錄簡化了註冊登錄流程,用戶在使用時大部分情況下都不需要輸入賬號密碼來進行登錄操作,但第三方登錄依賴開放平臺,開放平臺依然需要進行賬號密碼的儲存與管理,而且當開放平臺出現安全事故時,所有通過該平臺登錄的站點都將面臨安全風險。

2FA 雙因素認證

什麼是雙因素認證

  • 雙因素認證也叫二次驗證就是指同時使用兩種及以上能夠證明自己身份的方式進行驗證,雙因素認證就是在使用用戶名密碼登錄網站、應用、賬號之後,還需要一個驗證碼才能正常登錄。

  • 其實雙因素認證早在十幾年前就已經開始應用,諸如短信驗證碼、郵件驗證碼、動態令牌、RSA電子動態令牌等都屬於雙因素認證。各大網銀廣泛使用的各種盾、各種 Key 其實也屬於雙因素認證,包括短信驗證碼,它能夠讓用戶的數據多一層保護。

常見的雙因素認證方法

  • 第一種是短信驗證,也是目前較爲常用的,每一次認證時會生成短信驗證碼發送到指定手機上,輸入的內容與發送的內容一致則完成認證。

  • 第二種是認證APP,基於TOTP的加密算法,利用應用與認證APP共同持有的種子密鑰,每隔30秒生成一個新的6位驗證碼,應用與APP之間的驗證碼一致則完成驗證,通常在公司內部使用的VPN就是採用這種方式來進行身份驗證。

  • 第三種是登錄確認的方式,這種方式不需要輸入驗證碼,而是通過登錄確認點擊的方式來完成雙因素認證的過程,這種方式是通過公鑰加密算法來確認你的身份,應用會生成一個密鑰對,私鑰存儲在本地,公鑰發送給服務端作爲用戶信息存儲,當用戶進行登錄操作時,服務端會用公鑰加密一段信息發送到你的設備上,只有擁有正確私鑰的設備才能解密並完成二次認證。

優點

  • 必須通過兩種及以上的驗證才能確認身份,安全性較高

缺點

  • 使用門檻變高,登錄多了一步,費時且麻煩,不有利於產品的廣泛傳播

  • 2FA 不意味着賬戶的絕對安全,入侵者依然可以通過克隆SIM卡、盜取cookie或token等方式進行攻擊

  • 一旦忘記密碼或者遺失手機,想要恢復登錄,勢必就要繞過雙因素認證,這就形成了一個安全漏洞。除非準備兩套雙因素認證,一套用來登錄,另一套用來恢復賬戶。

Web驗證的未來 WebAuthn

WebAuthn是什麼?

  • WebAuthn是由W3C萬維網聯盟發佈的 Web 標準。WebAuthn 是FIDO聯盟指導下的FIDO2項目的核心組成部分。WebAuthn的目標就是提供一系列標準化的協議,讓用戶告別過去繁瑣且不安全的賬號密碼登錄方式,以實現安全的無密登錄體驗爲目的。

  • WebAuthn 徹底拋棄了傳統的賬號密碼登錄方式,它允許用戶直接使用設備的指紋識別面部識別虹膜識別聲音識別實體密鑰(USB連接、藍牙連接、NFC連接)等方式來進行登錄驗證。

體驗WebAuthn

https://demo.yubico.com/webauthn-technical/registration

  • windows 10 用戶可以購買型號爲yubikey 5 NFC版密鑰,插入設備的USB接口後訪問以上網址體驗WebAuthn。

  • 有touch bar功能的macbook可以直接訪問以上網址體驗WebAuthn。

  • iPhone 用戶可以購買型號爲yubikey 5 NFC版密鑰,打開以上網址後將密鑰放在手機背後通過密鑰NFC的驗證功能體驗WebAuthn。

  • 安卓用戶可以在手機開啓GMS服務並升級Google Play爲最新版後訪問以上網址體驗WebAuthn。

優點

  • 使用WebAuthn進行賬號登錄的安全性非常高

  • 即不需要輸入密碼,又不需要徵求第三方授權,直接利用設備的生物識別功能,登錄流程非常簡單快速,有利於產品的廣泛傳播

缺點

  • 目前還不成熟,國內大部分站點都不支持使用WebAuthn登錄

WebAuthn學習資料

1. 想要快速瞭解WebAuthn可以參考我的PPT,並結合Demo源碼來學習

PPT:https://ppt.baomitu.com/d/129a784a

Demo源碼:https://github.com/hanyonggang/WebAuthnDemo

2. 有關WebAuthn詳細用法,可以查閱W3C或MDN的官方文檔。

總結

WebAuthn的無密登錄體驗無論在安全性方面還是在易用性方面都是未來更好的選擇,預計在不久的將來有望成爲主流的Web驗證方式。也希望我們能夠早日使用上這樣的無密登錄體驗吧!


❤️ 看完三件事

如果你覺得這篇內容對你挺有啓發,我想邀請你幫我三個小忙:

  1. 點個「在看」,讓更多的人也能看到這篇內容(喜歡不點在看,都是耍流氓 -_-)

  2. 關注我的博客 https://github.com/SHERlocked93/blog,讓我們成爲長期關係

  3. 關注公衆號「前端下午茶」,持續爲你推送精選好文,也可以加我爲好友,隨時聊騷。

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章