转自：https://blog.csdn.net/zhouzhiwengang/article/details/90053313

项目整体结构

自定义页面涉及资源全部存放再src/main/resources 文件夹目录下：

services 目录配置

service目录，设定每一个子网站对应的请求样式，如果不设定，默认使用指定默认样式。

HTTPSandIMAPS-10000001.json 文件解析

该json配置文件是系统默认的登录模板，自定义模板配置文件规则：文件名称+id.json，如果不是这种格式cas 服务端不然找不到配置文件。

HTTPSandIMAPS-10000001.json 文件内容：

{

"@class" : "org.apereo.cas.services.RegexRegisteredService",

"serviceId" : "^(https|imaps)://.*",

"name" : "HTTPS and IMAPS",

"id" : 10000001,

"description" : "This service definition authorizes all application urls that support HTTPS and IMAPS protocols.",

"evaluationOrder" : 10000

}

自定义模板配置文件内容（digipower-1000.json）：

{

"@class" : "org.apereo.cas.services.RegexRegisteredService",

"serviceId" : "^(https|imaps|http)://.*",

"name" : "digipower",

"id" : 1000,

"description" : "CAS-SSO 登入",

"evaluationOrder" : 10,

"theme": "digipower"

}

application.properties 配置

注意：设置cas需要从json文件做初始化操作，不然我们配置的json没有生效

# cas 自定义登入界面

# 默认主题

cas.theme.defaultThemeName=digipower

# 开启识别json文件，默认false

cas.serviceRegistry.initFromJson=true

static 文件夹

digipower.css:

h1 {

color: blue;

}

templates 登录模板

目录结构可以看到，每个子站点，都会新建一个文件夹，文件夹的名称需要和 service里面配置站点的theme的名称对应上，casLoginView.html 这个模板的名称，不能瞎改，这个是固定的

(!DOCTYPE html>

(html>

(head>

(meta charset="UTF-8"/>

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

(meta http-equiv="X-UA-Compatible" content="IE=edge"/>

(title th:text="${#themes.code('digipower.pageTitle')}">(/title>

(link rel="stylesheet" th:href="@{${#themes.code('digipower.css.file')}}"/>

(/head>

(body>

(h1 th:text="${#themes.code('digipower.pageTitle')}">(/h1>

(h2>CAS-SSO 单点登录(/h2>

(div>

(form method="post" th:object="${credential}">

(div th:if="${#fields.hasErrors('*')}">

(span th:each="err : ${#fields.errors('*')}" th:utext="${err}"/>

(/div>

(h2 th:utext="#{screen.welcome.instructions}">(/h2>

(section class="row">

(label for="username" th:utext="#{screen.welcome.label.netid}"/>

(div th:unless="${openIdLocalId}">

(input class="required"

id="username"

size="25"

tabindex="1"

type="text"

th:disabled="${guaEnabled}"

th:field="*{username}"

th:accesskey="#{screen.welcome.label.netid.accesskey}"

autocomplete="off"/>

(/div>

(/section>

(section class="row">

(label for="password" th:utext="#{screen.welcome.label.password}"/>

(div>

(input class="required"

type="password"

id="password"

size="25"

tabindex="2"

th:accesskey="#{screen.welcome.label.password.accesskey}"

th:field="*{password}"

autocomplete="off"/>

(/div>

(/section>

(section>

(input type="hidden" name="execution" th:value="${flowExecutionKey}"/>

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

(input type="hidden" name="geolocation"/>

(input class="btn btn-submit btn-block"

name="submit"

accesskey="l"

th:value="#{screen.welcome.button.login}"

tabindex="6"

type="submit"/>

(/section>

(/form>

(/div>

(/body>

(/html>

配置模板信息

digipower.properties:

# 自定义登入首页相关参数配置

#定义的字段和信息，可以在页面读取到

digipower.css.file=/themes/digipower/css/digipower.css

digipower.pageTitle=CAS-SSO 登入

启动服务

到项目的根目录，找到build.cmd，然后debug启动服务。

build.cmd debug

访问测试