實戰模拟│單點登入 SSO 的實作

單點登入讓你一次性解決多應用認證的繁瑣

目錄

• 🎈 什麼是單點登入
• 🎈 單點登入的憑證
• 🎈 父域 Cookie 方式
• 🎈 使用者認證中心方式
• 🎈 localstorage方式

🎈 什麼是單點登入

• 單點登入：

  SSO（Single Sign On）

  使用者隻需登入一次，就可通路同一帳号平台下的多個應用系統。
• 比如阿裡巴巴這樣的大集團，旗下有很多的服務系統，比如天貓，淘寶，1688等等，如果每個子系統都需要使用者進行登入認證，估計使用者會被煩死。
• 而

  SSO

  是一種統一認證和授權機制，去解決這種重複認證的邏輯，提高使用者的體驗。

單點登入原理圖

🎈 單點登入的憑證

• 由單點登入的原理，可以看出來，最重要的就是這個通用的登入憑證

  ticket

  如何獲得
• 而實作

  ticket

  多應用共享主要有三種方式：父域加密 Cookie、使用者認證中心、Localstorage

🎈 父域 Cookie 方式

• 使用者在登入父應用後，服務端傳回使用者登入後的

  cookie

  ，用戶端将該

  cookie

  儲存到父域中
• 這個

  cookie

  最好經過加密處理，因為

  Cookie

  本身并不安全
• 這種加密算法隻有服務端才可以知道，服務端的解密算法不能暴漏
• 放在父域中，主要是因為

  Cookie

  不能跨域實作免登，放到父域中可以解決跨域的問題
• 父域也就是

  domain

  要設定成主域名，而非二級域名，這樣二級域名就可以使用同一個

  Cookie

  了

// 如果某個平台有三個應用，分别是：
// 門戶應用：www.autofelix.com
// 商城應用：shop.autofelix.com
// 支付應用：pay.autofelix.com

document.cookie = "ticket=xxxxxx;domain=.autofelix.com;path=/
           

🎈 使用者認證中心方式

• 使用一個認證中心，用來專門負責處理登入請求
• 使用者中心不處理業務邏輯，隻是處理使用者資訊的管理以及授權給第三方應用
• 第三方應用需要登入的時候，則把使用者的登入請求轉發給使用者中心進行處理，使用者處理完畢傳回憑證，第三方應用驗證憑證，通過後就登入使用者。
• 流程是使用者通路應用系統，應用系統先檢查使用者是否有

  Ticket

  ，如果沒有，則說明使用者在該應用上尚未登入，跳轉到使用者中心，通過使用者中心的

  Cookie

  去判斷使用者是否在其他應用上進行了登入
• 如果認證中心發現使用者尚未在其他任何應用上執行過登入，則提示使用者執行登入操作，等待使用者登入後，生成

  Tickcet

  ，并讓

  Ticket

  拼接在

  URL

  上，重定向回應用系統
• 當應用系統拿到

  Ticket

  後，将重新向使用者認證中心發起驗證，防止該

  Ticket

  是使用者僞造，驗證成功後，記錄使用者登入狀态，并将

  Ticket

  寫入到目前應用的

  Cookie

  中
• 而當使用者通路該應用系統時，就都會帶上目前的

  Ticket

  ，也就能正常通路服務了

使用者認證中心方式

🎈 localstorage方式

• 當使用者在一個應用下登入後，前端可以通過

  iframe+postMessage()

  方式，将同一份

  Ticket

  儲存到多個域名下的

  LocalStorage

  中
• 但是這種方式完全由前端控制，後端僅僅需要将使用者登入成功後的

  Ticket

  傳回給前端處理即可
• 這樣其實也實作了，多應用下單點登入的問題，并且支援跨域

localstorage方式