1. 程式人生 > >淘淘商城系列——單點登入之使用者登入頁面實現

淘淘商城系列——單點登入之使用者登入頁面實現

我們來看下login.jsp頁面,如下圖所示。可以看到<input .../>標籤中並沒有定義onclick方法,只是定義了個id="loginsubmit",那麼onclick事件在哪兒定義了呢?
這裡寫圖片描述
其實是在js程式碼當中定義了,如下圖所示,頁面載入完後就給id為loginsubmit的按鈕添加了onclick事件,當點選這個按鈕的時候,會觸發LOGIN物件的login方法,login方法要先檢查使用者名稱和密碼是否為空,如果為空則彈出alert警告框進行警告,如果都不為空,就呼叫登入方法。這裡需要說明一點的是,登入有可能是從不同的頁面跳轉過來的(比如你在京東購物,在購物車裡新增好了商品,要去結算時,如果沒有登入的話,是需要登入的,但是登入之後還要回到購物車介面的),因此登入成功後還應該回到原來的頁面中。
這裡寫圖片描述


現在我們來測試登入,由於登入後要跳轉到淘淘商城首頁,因此我們要先啟動淘淘商城相關的所有服務,zookeeper服務、image服務、Solr服務(我這裡用的是叢集版)、Redis服務(我這裡用的是單機版)、ActiveMQ服務。啟動好服務之後,我們依次啟動taotao-manager、taotao-content、taotao-search、taotao-sso、taotao-manager-web、taotao-portal-web、taotao-search-web、taotao-item-web、taotao-sso-web這9個工程,成功啟動完工程後,我們就來測試登入,我們先來輸個錯誤的密碼,如下圖所示。
這裡寫圖片描述

這樣的話,登入會報空指標異常,如下圖所示,出現空指標是由於登入失敗,result的data值是NULL,因此才會報空指標異常。
這裡寫圖片描述
要解決這個問題很簡單,在寫入cookie之前,先判斷下是否登入成功,登入成功之後再寫入到cookie,如下圖所示。
這裡寫圖片描述
修改了UserController類的程式碼,現在我們重新啟動taotao-sso-web工程,啟動好後,我們輸入正確的使用者名稱、密碼進行登入,會發現提示登入成功,點確定後,會跳轉到淘淘商城首頁,如下圖所示。當然了,現在淘淘商城首頁還沒有完全連通起來,所以會發現這個頁面並沒有顯示已登入狀態,而是依舊是未登入狀態。
這裡寫圖片描述

相關推薦

商城系列——登入使用者登入

我們先來看下使用者登入流程圖,如下圖所示。使用者登入涉及到三個部分,第一部分是淘淘商城前臺工程,第二部分是單點登入服務,第三部分是Redis服務。具體流程下圖已經說的很明白了,我就不再囉嗦一遍了,相比於傳統的登入,我們沒有把使用者登入資訊存在session當中,

商城系列——登入使用者註冊

首先我們還是看關於單點登入介面文件中關於使用者註冊介面的說明,如下圖所示。請求方式是POST型別,URL為我們明確指定好了,引數有四個,需要校驗完合法性之後再提交。 以上介面文件寫的還算明瞭,大家就湊合著看吧! 由於使用者註冊只涉及到單表操作,因此我們使

商城系列——登入使用者登入頁面實現

我們來看下login.jsp頁面,如下圖所示。可以看到<input .../>標籤中並沒有定義onclick方法,只是定義了個id="loginsubmit",那麼onclick事件在哪兒定義了呢? 其實是在js程式碼當中定義了,如下圖所示,頁

商城——登入使用者登入

我們先來看下使用者登入流程圖,如下圖所示。使用者登入涉及到三個部分,第一部分是淘淘商城前臺工程,第二部分是單點登入服務,第三部分是Redis服務。具體流程下圖已經說的很明白了,我就不再囉嗦一遍了,相比於傳統的登入,我們沒有把使用者登入資訊存在session當中,而是存放到了Re

商城26_登入SSO_02程式碼的實現,雪崩演算法

一、驗證資料是否可用 1. 介面文件 2. 需求分析 URL:請求的路徑 引數:param   type    param:username/phone/email     type:1/2/3 返回型別

商城26_登入SSO_01專案的搭建及配置

一、什麼是單點登入 1. 我們要做的單點登入 taotao-portal-web  taotao-search-web   taotao-item-web  這個三個專案,都得用到使用者,  三個tomcat 意味要有三臺伺服器

商城系列——SSM框架整合逆向工程

我們知道在開發中有些工作是非常耗時但是又沒有什麼技術含量的,比如建立mapper檔案、pojo、dao等,我們更關心的是業務邏輯的處理,而不是這些無關緊要的東西,因此如果能有工具幫我們自動生成程式碼將是非常棒的一件事情,這些mybatis官方已經為我們考慮到了,mybatis官方提供了逆向生成程式

(十一)Java B2B2C o2o多使用者商城-SSO登入OAuth2.0登入流程(2)

上一篇是站在巨人的肩膀上去研究OAuth2.0,也是為了快速幫助大家認識OAuth2.0,閒話少說,我根據框架中OAuth2.0的使用總結,畫了一個簡單的流程圖(根據使用者名稱+密碼實現OAuth2.0的登入認證):    上面的圖很清楚的描述了當前登入login的流程,現在我們針對於

登入CAS原理和實現

1.開源單點登入系統CAS入門 1.1 什麼是單點登入 單點登入(Single Sign On),簡稱為 SSO,是目前比較流行的企業業務整合的解決方案之一。SSO的定義是在多個應用系統中,使用者只需要登入一次就可以訪問所有相互信任的應用系統。 我們目

(十一)Java B2B2C o2o多用戶商城-SSO登錄OAuth2.0登錄流程(2)

-- 設計思想 組件 expire image term 總結 pass 一起 上一篇是站在巨人的肩膀上去研究OAuth2.0,也是為了快速幫助大家認識OAuth2.0,閑話少說,我根據框架中OAuth2.0的使用總結,畫了一個簡單的流程圖(根據用戶名+密碼實現OAuth2

帶你逐步深入瞭解SSM框架——商城專案商品詳情頁面實現

1.  課程計劃 l  商品詳情頁實現    1、商品查詢服務事項       2、商品詳情展示    3、新增快取 2.  實現商品詳情頁功能 2.1. 功能分析 1、Taotao-portal

登錄原理與簡單實現

title with 內部 resp 判斷 觀察 pac target sessionid 1、http無狀態協議 web應用采用browser/server架構,http作為通信協議。http是無狀態協議,瀏覽器的每一次請求,服務器會獨立處理,不與之前或之後的請求產生關聯

數據庫的備份與還原系列——表備份和恢復詳細完整實現

單表備份 單表還原 表定義備份還原 表數據備份還原 參考實現:https://www.percona.com/doc/percona-xtrabackup/LATEST/innobackupex/innobackupex_script.htmlRestoring Individual Tabl

登錄系統SSO以及實現技術CAS了解(手記)

http 多個 文件中 style 處理 通信 發送 所有 什麽 一.單點登錄 單點登錄(Single Sign On),簡稱為 SSO,是目前比較流行的企業業務整合的 解決方案之一。SSO 的定義是在多個應用系統中,用戶只需要登錄一次就可以訪 問所有相互信任的應用系統。它

Vue 進階系列(二)外掛原理及實現

Vue進階系列彙總如下,歡迎閱讀,歡迎加群討論(文末)。 Vue 進階系列(一)之響應式原理及實現 Vue 進階系列(二)之外掛原理及實現 使用方法 外掛的詳細使用方法詳情看Vue官網 Vue官網之外掛Plugins 概括出來就是 1、通過Vue.use(MyPlugin)使用,

例模式靜態內部類實現

這些天在看一本書,關於java多執行緒的,系統的掌握了多執行緒的一些知識,就簡單的把一些學習重要的知識記錄下來。 DCL可以解決多執行緒單例模式的非執行緒安全問題,當然也可以用其他方式,這裡就說另一種用內部類實現的。 如下程式碼: package test; public

R語言學習系列(資料探勘決策樹演算法實現--ID3程式碼篇)

轉載自:http://blog.csdn.net/hawksoft/article/details/7760868 1、輔助類,用於計算過程和結果儲存 [csharp] view plaincopyprint? /// &

Web 登錄(SSO) 實現模型

短信驗證碼 alt img sso com 怎麽 image 分離 前後端 有網友問起, 前後端分離 架構下的 Web 單點驗證 怎麽做, 我畫了個圖 : Temp Token 就 相當於 短信驗證碼 。 Web 單點登錄 都可以用這個 模型, 不僅僅是 前後端分

Scrapy框架模擬登入cookie登入

新建douban專案 通過charles  獲取到cookie後 貼上進入pycharm, 尼瑪格式混亂,無奈手工新增冒號,同時將=號換成:號。。。 cookies = { "bid": "EP3q1inffgg", "__yadk_uid" : "bI

第三方登入QQ登入(二)——OAuth2.0處理流程介紹(以QQ登入為例)

為了讓網站更快接入,騰訊提供了JS SDK的接入方案,具體點選這裡或者點選這裡進行檢視。不過也可以自己寫程式碼,當然你需要了解QQ的OAuth2.0的處理流程(Web Server Flow)。OAuth2.0的處理流程:點選這裡檢視官方Wiki。1.授權:獲取授權碼Auth