3.5. Red Hat Buld of HawtIO 的自定义品牌配置
hawtconfig.json 是用来配置 Red Hat Buld of HawtIO 的前端控制台的入口点 JSON 文件。它可用于对控制台的不同部分进行自定义:品牌、样式和基本 UI 部分,如登录页面和相关模态,以及特定于控制台的行为,以及一些 Red Hat Buld of HawtIO 插件的一些特定行为。
以下是 hawtconfig.json 的示例文件:
hawtconfig.json 示例 :
{
"branding":
{
"appName": "Red Hat buuld of HawtIO Management Console",
"showAppName": false,
"appLogoUrl": "hawtio-logo.svg",
"companyLogoUrl": "hawtio-logo.svg",
"css": "",
"favicon": "favicon.ico"
},
"login": {
"description": "Login page for Red Hat buuld of HawtIO Management Console.",
"links": [
{ "url": "#terms", "text": "Terms of Use" },
{ "url": "#help", "text": "Help" },
{ "url": "#privacy", "text": "Privacy Policy" }
]
},
"about": {
"title": "Red Hat buuld of HawtIO Management Console",
"description": "A Red Hat buuld of HawtIO reimplementation based on TypeScript + React.",
"imgSrc": "hawtio-logo.svg",
"productInfo": [
{ "name": "ABC", "value": "1.2.3" },
{ "name": "XYZ", "value": "7.8.9" }
],
"copyright": "© Red Hat buuld of HawtIO project"
},
"disabledRoutes": [
"/disabled"
]
}
3.5.1. hawtconfig.json中的配置选项 复制链接链接已复制到粘贴板!
在 hawtconfig.json 的顶部提供了以下选项:
顶级配置选项
| 选项 | Descriptiom |
|---|---|
|
| 控制台的品牌选项。 |
|
| 登录页面配置。 |
|
| 关于模态配置。 |
|
| 应该在控制台中隐藏的插件列表。 |
|
| JMX 插件配置。 |
|
| Red Hat Buld of HawtIO 在线配置。 |
3.5.1.1. 品牌 复制链接链接已复制到粘贴板!
品牌 配置提供了定制控制台品牌的选项,如应用程序名称、徽标、风格和 favicon。
品牌配置选项
| 选项 | default | 描述 |
|---|---|---|
|
|
| 自定义控制台的应用程序名称。名称用于浏览器标题标题,也可选择在控制台页面的标头中使用。 |
|
|
| 在控制台页面的标头中显示应用名称。 |
|
|
| 使用 URL 替换应用程序徽标。 |
|
|
| 使用 URL 替换公司徽标。 |
|
| 提供要应用到控制台的自定义 CSS。 | |
|
| 使用 URL 替换 favicon。 |
以下是 品牌 配置如何出现在 hawtconfig.json 中:
"branding": {
"appName": "Red Hat buuld of HawtIO Management Console",
"showAppName": false,
"appLogoUrl": "hawtio-logo.svg",
"companyLogoUrl": "hawtio-logo.svg",
"css": "",
"favicon": "favicon.ico"
}
3.5.1.2. 登录 复制链接链接已复制到粘贴板!
登录 配置提供了自定义在 Red Hat buuld of HawtIO 登录页面中显示的信息的选项。
登录配置选项
| 选项 | default | 描述 |
|---|---|---|
|
| 设置登录页面中显示的文本。 | |
|
| [ ] |
提供登录页面底部的链接。该值应该是带有 |
以下是 登录 配置如何在 hawtconfig.json 中查找:
"login": {
"description": "Login page for Red Hat buuld of HawtIO Management Console.",
"links": [
{ "url": "#terms", "text": "Terms of Use" },
{ "url": "#help", "text": "Help" },
{ "url": "#privacy", "text": "Privacy Policy" }
]
}
3.5.1.3. 关于 复制链接链接已复制到粘贴板!
关于 配置提供了自定义在 Red Hat buuld of HawtIO About modal 中显示的信息的选项。
关于配置选项
| 选项 | default | 描述 |
|---|---|---|
|
|
| 自定义关于模态的标题。 |
|
| 为 About 模态提供描述文本。 | |
|
|
| 使用 URL 替换 About 模态中的徽标镜像。 |
|
| [ ] |
提供有关控制台中使用的其他组件的名称和版本信息。该值应该是带有 |
|
| 在 About 模态中设置版权信息。 |
以下是配置 如何在 hawtconfig.json 中查找:
"about":
{
"title": "Red Hat buuld of HawtIO Management Console",
"description": "A Red Hat buuld of HawtIO reimplementation based on TypeScript + React.",
"imgSrc": "hawtio-logo.svg",
"productInfo": [
{ "name": "ABC", "value": "1.2.3" },
{ "name": "XYZ", "value": "7.8.9" }
],
"copyright": "© Red Hat buuld of HawtIO project"
}
3.5.1.4. 禁用的路由 复制链接链接已复制到粘贴板!
disabledRoutes 配置提供了从控制台隐藏插件的选项。
选项的值应当是字符串数组,代表应隐藏的插件的路径。
以下是 disabledRoutes 配置如何在 hawtconfig.json 中查找:
"disabledRoutes": [
"/disabled"
]
3.5.1.5. JMX 插件 复制链接链接已复制到粘贴板!
JMX 插件可通过 hawtconfig.json 中的 jmx 配置自定义。
默认情况下,Red Hat buuld of HawtIO 通过 JMX 插件将所有 MBeans 加载到工作区中。有时,您的 Red Hat buuld of HawtIO 控制台可能只希望加载一部分 MBeans 来减少应用程序的负载。jmx 配置提供了一个选项,用于限制将 MBeans 加载到工作区中。
JMX 插件配置选项
| 选项 | default | 描述 |
|---|---|---|
|
| 指定应加载到 JMX 插件工作区的 MBean 域和对象名称列表。 |
这个选项可以通过设置 false 来完全禁用工作区,或者以以下格式指定 MBean 路径数组:
<domain>/<prop1>=<value1>,<prop2>=<value2>,...
为了微调 MBeans 加载到工作空间。
禁用工作区还应停用依赖于工作区提供的 MBeans 的所有插件。
以下是 jmx 配置在 hawtconfig.json 中查找的方式:
"jmx": {
"workspace": [
"hawtio",
"java.lang/type=Memory",
"org.apache.camel",
"no.such.domain"
]
}
3.5.1.6. Red Hat Buld of HawtIO Online 复制链接链接已复制到粘贴板!
Red Hat Buld of HawtIO Online 的前端 方面可以通过 hawtconfig.json 中的 在线 配置进行配置。
Red Hat Buld of HawtIO 在线配置选项
| 选项 | default | 描述 |
|---|---|---|
|
|
设置用于监视项目的选择器。只有在 Red Hat uld of HawtIO 部署类型等于 | |
|
|
配置 OpenShift Web 控制台链接。当 Red Hat buuld of HawtIO 部署等同于 |
ConsoleLink 配置选项
| 选项 | default | 描述 |
|---|---|---|
|
| 设置链接的文本显示。 | |
|
|
设置应当在其中显示链接的应用程序菜单的部分。只有在 Red Hat uld of HawtIO 部署类型等于 | |
|
|
为应用程序菜单中链接前面的图标设置相对于 Red Hat buuld of HawtIO 状态 URL 的路径。只有在 |
以下是 Red Hat Buld of HawtIO 在线配置的看法 如何出现在 hawtconfig.json 中:
"online": {
"projectSelector": "myproject",
"consoleLink": {
"text": "Red Hat buuld of HawtIO Management Console",
"section": "Red Hat buuld of HawtIO",
"imageRelativePath": "/online/img/favicon.ico"
}
}
3.5.2. 部署 hawtconfig.json 复制链接链接已复制到粘贴板!
3.5.2.1. Quarkus 复制链接链接已复制到粘贴板!
对于 Quarkus 应用程序,hawt config.json 文件以及其他companion 静态资源(如 CSS 文件和镜像)应放在项目的 src/main/resources 目录中的 META-INF/resources/hawtio 下。
您可以在此处找到示例 Quarkus 项目。https://github.com/jboss-fuse/hawtio-examples/tree/rhbac-4.10/quarkus
3.5.2.2. Spring Boot 复制链接链接已复制到粘贴板!
对于 Spring Boot 应用程序,hawtconfig.json 文件以及其他companion 静态资源(如 CSS 文件和镜像)应放在项目的 src/main/resources 目录中的 hawtio-static 下。
您可以在此处找到一个 Spring Boot 项目示例。https://github.com/jboss-fuse/hawtio-examples/tree/rhbac-4.10/springboot-authentication
3.5.3. 插件自定义 复制链接链接已复制到粘贴板!
虽然插件无法直接为控制台提供 hawtconfig.json 文件本身,但它们可以在从主控制台应用程序加载该文件后自定义配置。
@hawtio/react NPM 软件包提供 configManager API。您可以在插件的 index.ts 中使用此 API 在加载插件过程中自定义 hawtconfig.json 的配置。
以下是如何从插件自定义 hawtconfig.json 配置的示例:
import
{
Red Hat buuld of HawtIOPlugin, configManager
} from '@hawtio/react'
...
/**
* The entry function of your plugin.
*/
export const plugin: Red Hat buuld of HawtIOPlugin = () =>
{
...
}
// Register the custom plugin version to Red Hat buuld of HawtIO
// See package.json "replace-version" script for how to replace the version placeholder with a real version
configManager.addProductInfo('Red Hat buuld of HawtIO Sample Plugin', '__PACKAGE_VERSION_PLACEHOLDER__')
/*
* This example also demonstrates how branding and styles can be customised from a WAR plugin.
*
* The Plugin API `configManager` provides `configure(configurer: (config: Hawtconfig) => void)` method
* and you can customise the `Hawtconfig` by invoking it from the plugin's `index.ts`.
*/
configManager.configure(config => {
// Branding & styles
config.branding =
{
appName: 'Red Hat buuld of HawtIO Sample WAR Plugin',
showAppName: true,
appLogoUrl: '/sample-plugin/branding/Logo-RedHat-A-Reverse-RGB.png',
css: '/sample-plugin/branding/app.css',
favicon: '/sample-plugin/branding/favicon.ico',
}
// Login page
config.login = {
description: 'Login page for Red Hat buuld of HawtIO Sample WAR Plugin application.',
links: [
{ url: '#terms', text: 'Terms of use' },
{ url: '#help', text: 'Help' },
{ url: '#privacy', text: 'Privacy policy' },
],
}
// About modal
if (!config.about) {
config.about = {}
}
config.about.title = 'Red Hat buuld of HawtIO Sample WAR Plugin'
config.about.description = 'About page for Red Hat buuld of HawtIO Sample WAR Plugin application.'
config.about.imgSrc = '/sample-plugin/branding/Logo-RedHat-A-Reverse-RGB.png'
if (!config.about.productInfo) {
config.about.productInfo = []
}
config.about.productInfo.push(
{ name: 'Red Hat buuld of HawtIO Sample Plugin - simple-plugin', value: '1.0.0' },
{ name: 'Red Hat buuld of HawtIO Sample Plugin - custom-tree', value: '1.0.0' },
)
// If you want to disable specific plugins, you can specify the paths to disable them.
//config.disabledRoutes = ['/simple-plugin']
})
您可以在此处找到一个 WAR 插件项目示例。https://github.com/hawtio/hawtio-sample-war-plugin-ts