From 7bac84642c612ee05ff338e37aac88235fbb5442 Mon Sep 17 00:00:00 2001 From: mueller-ma Date: Fri, 16 Feb 2024 08:22:54 +0000 Subject: [PATCH] Add custom html code to head With this PR a new text field will be added that allows setting custom html code to the `` of a status page. The implementation will be similar to https://github.com/louislam/uptime-kuma/pull/2567/files, but with a multi-line text field and without escaping any special chars. For security reasons the env var `UPTIME_KUMA_ALLOW_CUSTOM_HTML` must be set to `1` to enable this feature. This will allow tracking with most analytic platforms and has been requested several times. Closes #2818 --- .../2023-10-13-1200-add-custom-html.js | 14 ++++++++++++++ server/model/status_page.js | 6 ++++++ .../socket-handlers/status-page-socket-handler.js | 1 + src/lang/en.json | 3 +++ src/pages/StatusPage.vue | 9 +++++++++ 5 files changed, 33 insertions(+) create mode 100644 db/knex_migrations/2023-10-13-1200-add-custom-html.js diff --git a/db/knex_migrations/2023-10-13-1200-add-custom-html.js b/db/knex_migrations/2023-10-13-1200-add-custom-html.js new file mode 100644 index 00000000..2e031524 --- /dev/null +++ b/db/knex_migrations/2023-10-13-1200-add-custom-html.js @@ -0,0 +1,14 @@ +exports.up = function (knex) { + // Insert column for custom HTML code + return knex.schema + .alterTable("status_page", function (table) { + table.text("custom_html").nullable().defaultTo(null); + }); +}; + +exports.down = function (knex) { + return knex.schema + .alterTable("status_page", function (table) { + table.dropColumn("custom_html"); + }); +}; diff --git a/server/model/status_page.js b/server/model/status_page.js index 06fa7a68..aa7697db 100644 --- a/server/model/status_page.js +++ b/server/model/status_page.js @@ -66,6 +66,10 @@ class StatusPage extends BeanModel { head.append($(escapedGoogleAnalyticsScript)); } + if (process.env.UPTIME_KUMA_ALLOW_CUSTOM_HTML === "1") { + head.append(statusPage.customHtml); + } + // OG Meta Tags let ogTitle = $("").attr("content", statusPage.title); head.append(ogTitle); @@ -246,6 +250,7 @@ class StatusPage extends BeanModel { showPoweredBy: !!this.show_powered_by, googleAnalyticsId: this.google_analytics_tag_id, showCertificateExpiry: !!this.show_certificate_expiry, + customHtml: this.custom_html }; } @@ -268,6 +273,7 @@ class StatusPage extends BeanModel { showPoweredBy: !!this.show_powered_by, googleAnalyticsId: this.google_analytics_tag_id, showCertificateExpiry: !!this.show_certificate_expiry, + customHtml: this.custom_html }; } diff --git a/server/socket-handlers/status-page-socket-handler.js b/server/socket-handlers/status-page-socket-handler.js index ee1c68d3..bb378b55 100644 --- a/server/socket-handlers/status-page-socket-handler.js +++ b/server/socket-handlers/status-page-socket-handler.js @@ -166,6 +166,7 @@ module.exports.statusPageSocketHandler = (socket) => { statusPage.show_certificate_expiry = config.showCertificateExpiry; statusPage.modified_date = R.isoDateTime(); statusPage.google_analytics_tag_id = config.googleAnalyticsId; + statusPage.custom_html = config.customHtml; await R.store(statusPage); diff --git a/src/lang/en.json b/src/lang/en.json index 0f59e62a..37d20143 100644 --- a/src/lang/en.json +++ b/src/lang/en.json @@ -752,6 +752,9 @@ "wayToGetClickSendSMSToken": "You can get API Username and API Key from {0} .", "Custom Monitor Type": "Custom Monitor Type", "Google Analytics ID": "Google Analytics ID", + "Custom HTML": "Custom HTML", + "customHtmlEnvVar1": "The environment variable", + "customHtmlEnvVar2": "must be set to", "Edit Tag": "Edit Tag", "Server Address": "Server Address", "Learn More": "Learn More", diff --git a/src/pages/StatusPage.vue b/src/pages/StatusPage.vue index af2f028d..95f463ae 100644 --- a/src/pages/StatusPage.vue +++ b/src/pages/StatusPage.vue @@ -96,6 +96,15 @@ + +
+
{{ $t("Custom HTML") }}
+ +
+ {{ $t("customHtmlEnvVar1") }} UPTIME_KUMA_ALLOW_CUSTOM_HTML {{ $t("customHtmlEnvVar2") }} 1. +
+
+