From 08d8278a755b5b7308865d92e0e70dbcbf65fbde Mon Sep 17 00:00:00 2001 From: Anurag Ekkati Date: Sat, 3 Jan 2026 23:42:03 -0800 Subject: [PATCH] fix(monitor): Addressing review comments for PR #6577 --- src/lang/en.json | 5 +++++ src/pages/EditMonitor.vue | 39 +++++++++++++++++++++++---------------- src/util-frontend.js | 17 ----------------- 3 files changed, 28 insertions(+), 33 deletions(-) diff --git a/src/lang/en.json b/src/lang/en.json index c75f38660..2f74267cc 100644 --- a/src/lang/en.json +++ b/src/lang/en.json @@ -276,6 +276,11 @@ "mqttWebsocketPathExplanation": "WebSocket path for MQTT over WebSocket connections (e.g., /mqtt)", "mqttWebsocketPathInvalid": "Please use a valid WebSocket Path format", "mqttHostnameTip": "Please use this format {hostnameFormat}", + "hostnameCannotBeIP": "DNS hostname cannot be an IP. Did you mean to use the resolver field?", + "invalidHostnameOrIP": "Invalid hostname or IP. Hostname must be a valid FQDN. Cannot use wildcard. Can have underscore, or end with a dot.", + "invalidDNSHostname": "Invalid hostname. Hostname must be a valid FQDN. Can be a wildcard, have underscore or end with a dot.", + "wildcardOnlyForDNS": "Wildcard hostnames are only supported for DNS monitors.", + "invalidURL": "Invalid URL", "successKeyword": "Success Keyword", "successKeywordExplanation": "MQTT Keyword that will be considered as success", "recent": "Recent", diff --git a/src/pages/EditMonitor.vue b/src/pages/EditMonitor.vue index 1cf7b8c0e..d9d9167d6 100644 --- a/src/pages/EditMonitor.vue +++ b/src/pages/EditMonitor.vue @@ -326,7 +326,6 @@ v-model="monitor.hostname" type="text" class="form-control" - :pattern="monitor.type === 'mqtt' ? mqttIpOrHostnameRegexPattern : (monitor.type === 'dns' ? null : ipOrHostnameRegexPattern)" required data-testid="hostname-input" > @@ -1329,7 +1328,7 @@ import { MIN_INTERVAL_SECOND, sleep, } from "../util.ts"; -import { hostNameRegexPattern, timeDurationFormatter } from "../util-frontend"; +import { timeDurationFormatter } from "../util-frontend"; import isFQDN from "validator/lib/isFQDN"; import isIP from "validator/lib/isIP"; import HiddenInput from "../components/HiddenInput.vue"; @@ -1419,8 +1418,6 @@ export default { acceptedWebsocketCodeOptions: [], dnsresolvetypeOptions: [], kafkaSaslMechanismOptions: [], - ipOrHostnameRegexPattern: hostNameRegexPattern(), - mqttIpOrHostnameRegexPattern: hostNameRegexPattern(true), gameList: null, connectionStringTemplates: { "sqlserver": "Server=,;Database=;User Id=;Password=;Encrypt=;TrustServerCertificate=;Connection Timeout=", @@ -2085,32 +2082,42 @@ message HealthCheckResponse { } } - // Validate the DNS Monitor hostname input - if (this.monitor.type === "dns" && this.monitor.hostname) { + // Validate hostname field input for various monitors + if (this.monitor.hostname && [ "mqtt", "dns", "port", "ping", "steam", "gamedig", "radius", "tailscale-ping", "smtp", "snmp" ].includes(this.monitor.type)) { let hostname = this.monitor.hostname.trim(); - if (isIP(hostname)) { - toast.error("DNS hostname cannot be an IP. Did you mean to use the resolver field?"); + if (this.monitor.type === "mqtt") { + hostname = hostname.replace(/^(mqtt|ws)s?:\/\//, ""); + } + + if (this.monitor.type === "dns" && isIP(hostname)) { + toast.error(this.$t("hostnameCannotBeIP")); return false; } + // Wildcard is allowed only for DNS if (!isFQDN(hostname, { - allow_wildcard: true, + allow_wildcard: this.monitor.type === "dns", require_tld: false, allow_underscores: true, allow_trailing_dot: true, - })) { - toast.error("Invalid hostname. Must be a FQDN, wildcard, underscore, or end with a dot."); + }) && !isIP(hostname)) { + if(this.monitor.type === "dns") { + toast.error(this.$t("invalidDNSHostname")); + } else { + toast.error(this.$t("invalidHostnameOrIP")); + } return false; } } - // Validate URL field input + // Validate URL field input for various monitors if ((this.monitor.type === "http" || this.monitor.type === "keyword" || this.monitor.type === "json-query" || this.monitor.type === "websocket-upgrade" || this.monitor.type === "real-browser") && this.monitor.url) { try { const url = new URL(this.monitor.url); - if (url.hostname.includes("*")) { - toast.error("Wildcard hostnames are only supported for DNS monitors."); + // Browser can encode *.hostname.com to %2A.hostname.com + if (url.hostname.includes("*") || url.hostname.includes("%2A")) { + toast.error(this.$t("wildcardOnlyForDNS")); return false; } if (!isFQDN(url.hostname, { @@ -2118,11 +2125,11 @@ message HealthCheckResponse { allow_underscores: true, allow_trailing_dot: true, }) && !isIP(url.hostname)) { - toast.error("Invalid hostname"); + toast.error(this.$t("invalidHostnameOrIP")); return false; } } catch (err) { - toast.error("Invalid URL"); + toast.error(this.$t("invalidURL")); return false; } } diff --git a/src/util-frontend.js b/src/util-frontend.js index 66aabd75b..5912620b5 100644 --- a/src/util-frontend.js +++ b/src/util-frontend.js @@ -108,23 +108,6 @@ export function getDevContainerServerHostname() { return CODESPACE_NAME + "-3001." + GITHUB_CODESPACES_PORT_FORWARDING_DOMAIN; } -/** - * Regex pattern for identifying hostnames and IP addresses - * @param {boolean} mqtt whether or not the regex should take into - * account the fact that it is an mqtt uri - * @returns {string} The requested regex string - */ -export function hostNameRegexPattern(mqtt = false) { - // mqtt, mqtts, ws and wss schemes accepted by mqtt.js (https://github.com/mqttjs/MQTT.js/#connect) - const mqttSchemeRegexPattern = "((mqtt|ws)s?:\\/\\/)?"; - // Source: https://digitalfortress.tech/tips/top-15-commonly-used-regex/ - const ipRegexPattern = `((^${mqtt ? mqttSchemeRegexPattern : ""}((([0-9]|[1-9][0-9]|1[0-9]{2}|2[0-4][0-9]|25[0-5])\\.){3}([0-9]|[1-9][0-9]|1[0-9]{2}|2[0-4][0-9]|25[0-5]))$)|(^((([0-9A-Fa-f]{1,4}:){7}([0-9A-Fa-f]{1,4}|:))|(([0-9A-Fa-f]{1,4}:){6}(:[0-9A-Fa-f]{1,4}|((25[0-5]|2[0-4]\\d|1\\d\\d|[1-9]?\\d)(\\.(25[0-5]|2[0-4]\\d|1\\d\\d|[1-9]?\\d)){3})|:))|(([0-9A-Fa-f]{1,4}:){5}(((:[0-9A-Fa-f]{1,4}){1,2})|:((25[0-5]|2[0-4]\\d|1\\d\\d|[1-9]?\\d)(\\.(25[0-5]|2[0-4]\\d|1\\d\\d|[1-9]?\\d)){3})|:))|(([0-9A-Fa-f]{1,4}:){4}(((:[0-9A-Fa-f]{1,4}){1,3})|((:[0-9A-Fa-f]{1,4})?:((25[0-5]|2[0-4]\\d|1\\d\\d|[1-9]?\\d)(\\.(25[0-5]|2[0-4]\\d|1\\d\\d|[1-9]?\\d)){3}))|:))|(([0-9A-Fa-f]{1,4}:){3}(((:[0-9A-Fa-f]{1,4}){1,4})|((:[0-9A-Fa-f]{1,4}){0,2}:((25[0-5]|2[0-4]\\d|1\\d\\d|[1-9]?\\d)(\\.(25[0-5]|2[0-4]\\d|1\\d\\d|[1-9]?\\d)){3}))|:))|(([0-9A-Fa-f]{1,4}:){2}(((:[0-9A-Fa-f]{1,4}){1,5})|((:[0-9A-Fa-f]{1,4}){0,3}:((25[0-5]|2[0-4]\\d|1\\d\\d|[1-9]?\\d)(\\.(25[0-5]|2[0-4]\\d|1\\d\\d|[1-9]?\\d)){3}))|:))|(([0-9A-Fa-f]{1,4}:){1}(((:[0-9A-Fa-f]{1,4}){1,6})|((:[0-9A-Fa-f]{1,4}){0,4}:((25[0-5]|2[0-4]\\d|1\\d\\d|[1-9]?\\d)(\\.(25[0-5]|2[0-4]\\d|1\\d\\d|[1-9]?\\d)){3}))|:))|(:(((:[0-9A-Fa-f]{1,4}){1,7})|((:[0-9A-Fa-f]{1,4}){0,5}:((25[0-5]|2[0-4]\\d|1\\d\\d|[1-9]?\\d)(\\.(25[0-5]|2[0-4]\\d|1\\d\\d|[1-9]?\\d)){3}))|:)))(%.+)?$))`; - // Source: https://stackoverflow.com/questions/106179/regular-expression-to-match-dns-hostname-or-ip-address - const hostNameRegexPattern = `^${mqtt ? mqttSchemeRegexPattern : ""}([a-zA-Z0-9])?(([a-zA-Z0-9_]|[a-zA-Z0-9_][a-zA-Z0-9\\-_]*[a-zA-Z0-9_])\\.)*([A-Za-z0-9_]|[A-Za-z0-9_][A-Za-z0-9\\-_]*[A-Za-z0-9_])(\\.)?$`; - - return `${ipRegexPattern}|${hostNameRegexPattern}`; -} - /** * Get the tag color options * Shared between components