cas4.2.7定製登錄頁面樣式(並且讓頁面默認使用中文提示)

目     錄

1、讓cas服務端的頁面默認使用中文

2、定製我們自己想要的登錄頁面

      2.1 修改cas.properties配置文件

      2.2創建view-cj目錄

      2.3 修改view-cj目錄下的登錄相關的文件

                2.3.1 top.jsp的修改

                2.3.2 bottom.jsp的修改

                2.3.3 casLoginView.jsp的修改

3其他說明

 

1、讓cas服務端的頁面默認使用中文

          cas4.2.7服務端的所有頁面默認是英文的,如果不修改配置文件而要在頁面上使用中文提示,需要在訪問的每個URL後面使用參數locale=zh_CN指明我們要使用中文。例如登錄頁面的原始地址是https://127.0.0.1:8090/cas/login

如果我們要讓登錄頁面上提示中文,需要將URL修改爲https://127.0.0.1:8090/cas/login?locale=zh_CN

 

           訪問每個頁面都要指定語言種類,太不科學了,直接修改cas.properties文件,可以讓默認語言由英文變成中文(如果你問我cas.properties請先跳到本文的第3章節,看了那兩篇文章你就知道在哪裏找了)

 在該文件中增加下面的配置項並且重啓web容器(此處使用的是tomcat):

 

#默認使用中文

locale.default=zh_CN

 

如圖:

 

     在未增加該配置前,登錄頁面是這樣的

如圖:

 

    

      增加該配置後,登錄頁面上是中文提示了

如圖:


2、定製我們自己想要的登錄頁面

           光是把默認語言設置爲中文的登錄頁面顯然也不是我們想要的,在cas4.2.7服務端中要定製自己的登錄頁面樣式也很容易。請看下面的步驟。

2.1、修改cas.properties配置文件

      

    在cas.properties中增加配置項:


#cas使用我們想要的頁面

cas.themeResolver.pathprefix=/WEB-INF/view-cj/jsp/  

 

如圖:

 

  說明:view-cj這個是我們要創建的目錄,這個名字可以隨便起的,往下看。

2.2、創建view-cj目錄

      將WEB-INF目錄下的view文件夾複製一份,取名爲view-cj

如圖:

  

 

2.3、修改view-cj目錄下的登錄相關的文件

修改3 個文件

\WEB-IN\view-cj\jsp\default\ui\includes\top.jsp

\WEB-IN\view-cj\jsp\default\ui\includes\bottom.jsp

\WEB-IN\view-cj\jsp\default\ui\ casLoginView.jsp

 

       這三個文件中top.jsp是我們看到的登錄頁面的header部分,bottom.jspfooter部分,casLoginView.jsp是中間部分,你想要長什麼樣子的登錄頁面,取決於你怎麼修改這3個文件。

例如我想要這樣的效果

如圖:


 

     下面的內容是我對這三個文件的修改。

2.3.1 top.jsp的修改

     路徑是: \WEB-IN\view-cj\jsp\default\ui\includes\top.jsp

     特別說明,由於csdn博客編輯器的問題,會把<%@taglib prefix="c"  uri="http://java.sun.com/jsp/jstl/core"%>中的小寫java弄成大寫的,導致你複製粘貼會出錯,你複製粘貼時候請將這個大寫的Java修改爲小寫java即可):

        內容是:


<!DOCTYPEhtml>

 

<%@page  pageEncoding="UTF-8"%>

<%@page  contentType="text/html;charset=UTF-8"%>

<%@taglib  prefix="c"  uri="http://java.sun.com/jsp/jstl/core"%>

<%@taglib  prefix="spring"  uri="http://www.springframework.org/tags"%>

<%@taglib  prefix="form"  uri="http://www.springframework.org/tags/form"%>

<%@taglib  prefix="fn"  uri="http://java.sun.com/jsp/jstl/functions"%>

 

<html lang="zh_CN">

<head>

 <meta charset="UTF-8"/>

   <meta name="viewport" content="width=device-width,initial-scale=1"/>

 

   <title>認證系統-登錄中心</title>

 

   <meta name="_csrf"  content="${_csrf.token}"/>

   <meta name="_csrf_header" content="${_csrf.headerName}"/>

 

 

   <spring:theme code="standard.custom.css.file" var="customCssFile"/>

   <link  rel="stylesheet"  href="<c:url  value="${customCssFile}"/>"/>

   <link  rel="icon"  href="<c:url value="/favicon.ico"/>"  type="image/x-icon"/>

 

</head>

<body id="cas">

 

<div id="container" >

  <div  style="margin-top:120px;"/>&nbsp;</div>

 <div id="content"  style="width:250px;margin-left:auto;margin-right:auto;">

 

2.3.2 bottom.jsp的修改

    路徑是:\WEB-IN\view-cj\jsp\default\ui\includes\bottom.jsp

   內容是:

 

<%@taglibprefix="c"  uri="http://java.sun.com/jsp/jstl/core"%>

 

</div><!-- END #content -->

 

 

 

</div><!-- END #container -->

 

<script  src="https://cdnjs.cloudflare.com/ajax/libs/headjs/1.0.3/head.min.js"></script>

<spring:theme  code="cas.javascript.file"  var="casJavascriptFile"  text=""/>

<script  type="text/javascript"  src="<c:url  value="${casJavascriptFile}"/>"></script>

 

</body>

</html>

 

 

2.3.3 casLoginView.jsp的修改


     路徑是:\WEB-IN\view-cj\jsp\default\ui\ casLoginView.jsp

    內容是:

<jsp:directive.include  file="includes/top.jsp"/>

 

 

 

<div id="cookiesDisabled"  class="errors"  style="display:none;">

   <h2><spring:message code="screen.cookies.disabled.title"/></h2>

   <p><spring:message  code="screen.cookies.disabled.message"/></p>

</div>

 

 

<c:if  test="${not empty registeredService}">

   <c:set var="registeredServiceLogo" value="images/webapp.png"/>

   <c:set var="registeredServiceName" value="${registeredService.name}"/>

   <c:set var="registeredServiceDescription" value="${registeredService.description}"/>

 

   <c:choose>

        <c:when test="${not empty mduiContext}">

            <c:if  test="${not empty mduiContext.logoUrl}">

                <c:set  var="registeredServiceLogo" value="${mduiContext.logoUrl}"/>

            </c:if>

            <c:set var="registeredServiceName" value="${mduiContext.displayName}"/>

            <c:set var="registeredServiceDescription" value="${mduiContext.description}"/>

        </c:when>

        <c:when test="${not empty registeredService.logo}">

            <c:set var="registeredServiceLogo" value="${registeredService.logo}"/>

        </c:when>

   </c:choose>

 

 

   <p/>

</c:if>

 

<div class="box" id="login">

   <form:form  method="post" id="fm1"  commandName="${commandName}"  htmlEscape="true">

 

        <form:errors path="*"  id="msg"  cssClass="errors"  element="div"  htmlEscape="false"/>

 

        <h2><spring:message code="screen.welcome.instructions"/></h2>

 

        <section class="row">

            <label for="username"><spring:message code="screen.welcome.label.netid"/></label>

            <c:choose>

                <c:when  test="${not empty sessionScope.openIdLocalId}">

                    <strong><c:out value="${sessionScope.openIdLocalId}"/></strong>

                    <input  type="hidden" id="username"  name="username"  value="<c:out  value="${sessionScope.openIdLocalId}"/>"/>

                </c:when>

                <c:otherwise>

                    <spring:message  code="screen.welcome.label.netid.accesskey"  var="userNameAccessKey"/>

                    <form:input cssClass="required"   cssErrorClass="error" id="username"  size="25"  tabindex="1"  accesskey="${userNameAccessKey}"   path="username"   autocomplete="off"  htmlEscape="true"/>

                </c:otherwise>

            </c:choose>

        </section>

 

        <section  class="row">

            <label for="password"><spring:message  code="screen.welcome.label.password"/></label>

              

            <spring:message  code="screen.welcome.label.password.accesskey"  var="passwordAccessKey"/>

            <form:password cssClass="required"  cssErrorClass="error"  id="password" size="25"  tabindex="2" path="password"  accesskey="${passwordAccessKey}"  htmlEscape="true" autocomplete="off"/>

            <span  id="capslock-on"  style="display:none;"><p><img src="images/warning.png"  valign="top"><spring:message code="screen.capslock.on"/></p></span>

        </section>

 

      

 

        <section class="rowbtn-row">

          

          <input type="hidden" name="execution"  value="${flowExecutionKey}"/>

            <input  type="hidden"  name="_eventId"  value="submit"/>

 

            <input class="btn-submit"  name="submit"  accesskey="l"  value="<spring:message  code="screen.welcome.button.login"/>"   tabindex="6"    type="submit"/>

            <input class="btn-reset"  name="reset"  accesskey="c"  value="<spring:message code="screen.welcome.button.clear"/>"  tabindex="7"   type="reset"/>

        </section>

   </form:form>

</div>

 

<jsp:directive.include  file="includes/bottom.jsp"/>

 

3、其他說明

           關於如何使用eclipse構建cas服務端的war部署包請看

http://blog.csdn.net/pucao_cug/article/details/68945379

 

       關於如何部署打好的4.2.7版本的war包請看

http://blog.csdn.net/pucao_cug/article/details/68942734

 

       注意:關於部署的這邊文章雖然用的是4.1.3版本的war包講的,但是不影響的,war包的部署方法是一樣的,只是要修改配置時候4.1系列和4.2系列還是有比較多的不同之處,具體步驟照着文章來吧。

 

發佈了54 篇原創文章 · 獲贊 174 · 訪問量 82萬+
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章