【SSO單點系列】(2):CAS4.0 登錄頁的個性化定制


 

  上一篇 【SSO單點系列】(1):CAS環境的搭建介紹了CAS最簡單環境的搭建,以及一個例子用來講解CAS的一個最基礎的用法。 今天主要是介紹如何對CAS登錄頁進行個性化定制。

    一.開始

  下圖是CAS默認的登錄界面,可以看到這界面是肯定不能直接用在生產環境上的,因為上面的有許多英文,簡單來說,這是一個對客戶非常不友好的界面。那么怎么修改它呢?我們接着往下看!

  ps:這個頁面在工程中的地址為 cas\WEB-INF\view\jsp\default\ui\casLoginView.jsp,大家可以打開看一看

  

  二.配置文件修改

  其實CAS所有的界面位置都是在cas.properties(具體位置:cas\WEB-INF\cas.properties)中指定的。我們打開這個文件,找到下面這行

 

cas.securityContext.status.allowedSubnet=127.0.0.1

cas.themeResolver.defaultThemeName=cas-theme-default

//注意下面這行
cas.viewResolver.basename=default_views

 

 

  看cas.viewResolver.basename 這個鍵值對,它的值是default_views,表示的是默認的視圖配置,其實是一個properties文件的名稱而已。大家找找看,在工程中是不是有一個名為default_views.properties(具體位置:cas\WEB-INF\classes\default_views.properties )的文件,文件的具體內容如下:

 

casLoginView.(class)=org.springframework.web.servlet.view.JstlView
casLoginView.url=/WEB-INF/view/jsp/default/ui/casLoginView.jsp

### Display login (warning) messages
casLoginMessageView.(class)=org.springframework.web.servlet.view.JstlView
casLoginMessageView.url=/WEB-INF/view/jsp/default/ui/casLoginMessageView.jsp

### Login confirmation view (logged in, warn=true)
casLoginConfirmView.(class)=org.springframework.web.servlet.view.JstlView
casLoginConfirmView.url=/WEB-INF/view/jsp/default/ui/casConfirmView.jsp

### Logged-in view (logged in, no service provided)
casLoginGenericSuccessView.(class)=org.springframework.web.servlet.view.JstlView
casLoginGenericSuccessView.url=/WEB-INF/view/jsp/default/ui/casGenericSuccess.jsp

### Logout view (/logout)
casLogoutView.(class)=org.springframework.web.servlet.view.JstlView
casLogoutView.url=/WEB-INF/view/jsp/default/ui/casLogoutView.jsp

//省略

 

可以看到我們的登錄頁面就是配置在上面的, 里面還配置了 登錄成功頁面,退出頁面等,這個后面會具體說明。

我們知道了頁面配置后,那么是不是可以根據業務來具體訂制一套頁面了。

 

1.在cas.properties 修改 cas.viewResolver.basename  值為 bokeyuan_view ,那樣系統就會自動會查找 bokeyuan_view.properties 這個配置文件

2.第1點中查找的 bokeyuan_view.properties 是沒有的,我們要自己新建,直接復制原來的 default_views.properties 就行了,重命名為bokeyuan_view.properties

3.但是bokeyuan_view.properties 中的地址還是 /WEB-INF/view/jsp/default ,我們全部替換把這地址替換成 WEB-INF\view\jsp\bokeyuan

4.接下來我們把 cas\WEB-INF\view\jsp\default 下面的所有文件復制下,然后重命名為我們需要的名稱,cas\WEB-INF\view\jsp\bokeyuan

5.這樣我們就可以可以隨意修改登錄界面了

ps:有人說直接修改原來的 cas\WEB-INF\view\jsp\default\ui\casLoginView.jsp 就行了,省得麻煩。 其實這樣也是行的,但這樣如果后面需要初始的界面,那樣就沒了。

采用配置修改的方式主要會更加靈活點,可以保留原來的備份。

pps:登錄界面中的jquery庫 是配置在cas\WEB-INF\view\jsp\default\ui\includes\bottom.jsp中的,但是這個是直接引用googleapis 的,我們是不能訪問的,需要修改成你本地或者能夠訪問的CDN庫(百度CDN、360CDN 等)

ppps:你可以隨意修改原來的界面,但是原來的邏輯不能修改,其實主要是 form:form 這標簽里的東西不要變了。反正你只修改樣式,是肯定不會錯的

 

三、總結

這樣我們就可以按照我們的需求 個性化定制我們的登錄界面了。

原來的界面上只有姓名、密碼兩個表單,可能大家還想在上面加上驗證碼, 加驗證碼 在下一篇中進行介紹,大家敬請期待!

 

 

好了 ,打完收工!

 

 

 

  

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM