diff --git a/webui/src/main.tsx b/webui/src/main.tsx
index ed79c7668..009052602 100644
--- a/webui/src/main.tsx
+++ b/webui/src/main.tsx
@@ -5,6 +5,22 @@ import App from "./App";
 import "./globals.css";
 import "./i18n";
 
+// `crypto.randomUUID` is only defined in secure contexts (HTTPS or localhost).
+// LAN access over plain HTTP leaves it undefined, which crashes components that
+// generate client-side message IDs. Shim a v4-ish fallback so call sites stay
+// uniform across secure and non-secure contexts.
+if (typeof globalThis.crypto !== "undefined" && !("randomUUID" in globalThis.crypto)) {
+  Object.defineProperty(globalThis.crypto, "randomUUID", {
+    value: () =>
+      "xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx".replace(/[xy]/g, (c) => {
+        const r = (Math.random() * 16) | 0;
+        const v = c === "x" ? r : (r & 0x3) | 0x8;
+        return v.toString(16);
+      }),
+    configurable: true,
+  });
+}
+
 const root = document.getElementById("root");
 if (!root) throw new Error("root element missing");