前言
這里主要講解什么是單點登錄以及前端如何實現單點登錄。但注意單點登錄並不安全，因為只要數據在前端，不管你怎么加密，都只是相對安全，而非絕對安全，你用cookie和session安全級別都差不多，都很容易被攻擊。所以做單點登錄的系統，就不要出現很重要的信息，或是要做很重要的信息修改或獲取時，得再進行一次安全驗證。
另外推薦一個前端加密的文章，內容相對比較全，有興趣可以看看 https://mp.weixin.qq.com/s/V-g2P42t8EJDl-wFhWxSUQ
什么是單點登錄？
單點登錄（Single Sign On），簡稱為 SSO，是目前比較流行的企業業務整合的解決方案之一。SSO的定義是在多個應用系統中，用戶只需要登錄一次就可以訪問所有相互信任的應用系統。
常用的地方例如學校，醫院，或類似豆瓣這種大型網站，他們可能開發了很多不同的系統，像是上豆瓣，要登錄豆瓣FM、豆瓣讀書、豆瓣電影、豆瓣日記，如果我們訪問豆瓣讀書、豆瓣電影、豆瓣日記都需要進行一次登錄認證，那么用戶體驗是非常不好的。所以引用了單點登錄。只要一次登錄就可以訪問所有相互信任的應用系統。
上圖實現的是如何使用cookie進行單點登錄
客戶端持有ID，服務端持有session，兩者一起用來保持登錄狀態。客戶端需要用ID來作為憑證，而服務端需要用session來驗證ID的有效性。但是session這東西一開始是每個server自己獨有的，豆瓣FM有自己的session、豆瓣讀書有自己的session，而記錄ID的cookie又是不能跨域的。所以，我們要實現一次登錄一次退出，只需要想辦法讓各個server的共用一個session的信息，讓客戶端在各個域名下都能持有這個ID就好了。再進一步講，只要各個server拿到同一個ID，都能有辦法檢驗出ID的有效性、並且能得到ID對應的用戶信息就行了，也就是能檢驗ID。
實現方式
前端經常使用cookie或session來存儲Token，撇開安全性不說，怎么讓別的域名也能夠拿到這個域名下的cookie？同域名很簡單，我們可以把token存在cookie里，把cookie的路徑設置成頂級域名下，這樣在當前瀏覽器打開的所有子域都能讀取cookie中的token。這就是共享cookie的方式。
例如：cn.yahoo.com和www.yahoo.com，存入到任何一個域里的cookie都能被另一個域獲取，因為頂級域名都是yahoo.com。
只要拿到的cookie里的token，進入另一個系統時寫個判斷，例如利用vue的路由管理，判斷用戶信息與后台的是否一致，是的話允許進入，否則直接跳轉到登錄頁。
JWT實現方式參考網址：https://www.jianshu.com/p/576dbf44b2ae
總結
單點登錄的優點
1、提高用戶的效率。 用戶不再被多次登錄困擾，也不需要記住多個 ID 和密碼。另外，用戶忘記密碼並求助於支持人員的情況也會減少。
2、提高開發人員的效率。 SSO 為開發人員提供了一個通用的身份驗證框架。實際上，如果 SSO 機制是獨立的，那么開發人員就完全不需要為身份驗證操心。他們可以假設，只要對應用程序的請求附帶一個用戶名，身份驗證就已經完成了。
3、簡化管理。 如果應用程序加入了單點登錄協議，管理用戶帳號的負擔就會減輕。簡化的程度取決於應用程序，因為 SSO 只處理身份驗證。所以，應用程序可能仍然需要設置用戶的屬性（比如訪問特權）。
單點登錄的缺點
1、不利於重構 因為涉及到的系統很多，要重構必須要兼容所有的系統，可能很耗時。
2、無人看守桌面 因為只需要登錄一次，所有的授權的應用系統都可以訪問，可能導致一些很重要的信息泄露。