Detect networking problems and server errors, and display error messages to user. Also check size of payload before attempting to send.

This commit is contained in:
Marsell Kukuljevic 2026-01-16 10:27:38 +00:00
parent 3177477267
commit 5762306ea2

View File

@ -84,6 +84,7 @@
<body>
<div class="card" id="main">
<div id="input-view">
<h2 id="send-status" style="margin-bottom: 0"></h2>
<textarea
id="text"
placeholder="Type or paste your secret here..."
@ -151,6 +152,9 @@
</div>
<script>
// Make sure this matches MAX_SIZE_BYTES in server.js
const MAX_SIZE_BYTES = 10 * 1024 * 1024; // 10MB
// Check for existing link in URL on load
window.onload = () => {
if (window.location.hash.includes("id=")) initDecryption();
@ -177,10 +181,26 @@
// 3. Upload Blob (IV + Ciphertext)
const blob = new Blob([iv, encrypted]);
const res = await fetch("/api/secret", {
if (blob.size > MAX_SIZE_BYTES) {
setErrorMessage("send-status", "message too large");
return;
}
let res;
try {
res = await fetch("/api/secret", {
method: "POST",
body: blob,
});
if (!res.ok) throw new Error(res.statusText);
// We need this catch since res.ok only works with some errors
} catch (e) {
let msg = e.message.replace("NetworkError", "networking problem");
setErrorMessage("send-status", msg);
return;
}
const { id } = await res.json();
// 4. Create Hash-Link (Key stays in hash, never sent to server)
@ -255,15 +275,18 @@
// Wipe hash from URL immediately for safety
window.history.replaceState(null, null, " ");
} catch (e) {
statusEl.innerText = "❌ Error";
statusEl.style.color = "#ff4444";
setErrorMessage("read-status", e.message);
const content = document.getElementById("content");
contentContainer.classList.remove("hidden");
content.innerText = e.message;
content.style.color = "#ff8888";
}
}
function setErrorMessage(id, msg) {
const statusEl = document.getElementById(id);
statusEl.innerText = `❌ Error: ${msg}`;
statusEl.style.color = "#ff4444";
}
function copyDecryptedText() {
const text = document.getElementById("content").innerText;
navigator.clipboard.writeText(text);