Add /strip endpoint and web UI for metadata removal

- POST /strip: accepts any image, strips all metadata (EXIF, GPS, IPTC, XMP),
  returns clean anonymous JPEG at original dimensions (quality 92)
- GET / now serves a minimal web UI with drag-and-drop upload
- Token prompt on first use, saved to localStorage
- Add CLAUDE.md with project context

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
2026-03-13 17:22:58 -07:00
parent 6e6beb9f8e
commit ba9feacd48
2 changed files with 214 additions and 1 deletions

162
server.js
View File

@@ -11,7 +11,6 @@ const libheif = libheifModule?.default ?? libheifModule;
const app = express();
app.use(express.raw({ type: "*/*", limit: "30mb" }));
app.get("/", (_req, res) => res.status(200).send("postconvert: ok"));
app.get("/health", (_req, res) => res.status(200).send("ok"));
/* ------------------------------------------------------------------ */
@@ -275,6 +274,167 @@ async function withConvertSingleFlight(req, res, fn) {
/* Routes */
/* ------------------------------------------------------------------ */
/* ------------------------------------------------------------------ */
/* Web UI */
/* ------------------------------------------------------------------ */
app.get("/", (_req, res) => {
res.setHeader("Content-Type", "text/html");
res.send(`<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>PostConvert Strip Metadata</title>
<style>
* { box-sizing: border-box; margin: 0; padding: 0; }
body { font-family: -apple-system, system-ui, sans-serif; background: #111; color: #eee;
display: flex; align-items: center; justify-content: center; min-height: 100vh; }
.wrap { max-width: 420px; width: 100%; padding: 2rem; }
h1 { font-size: 1.3rem; margin-bottom: 1.5rem; text-align: center; }
.drop { border: 2px dashed #444; border-radius: 12px; padding: 3rem 1.5rem; text-align: center;
cursor: pointer; transition: border-color .2s; }
.drop.over { border-color: #4a9eff; }
.drop p { color: #888; font-size: .95rem; }
.drop input { display: none; }
.status { margin-top: 1rem; text-align: center; font-size: .9rem; color: #888; }
.status.error { color: #f66; }
</style>
</head>
<body>
<div class="wrap">
<h1>Strip Photo Metadata</h1>
<div class="drop" id="drop">
<p>Drop a photo here or tap to choose</p>
<input type="file" id="file" accept="image/*">
</div>
<div class="status" id="status"></div>
</div>
<script>
(function() {
const KEY = "postconvert_token";
const drop = document.getElementById("drop");
const fileInput = document.getElementById("file");
const status = document.getElementById("status");
function getToken() {
let t = localStorage.getItem(KEY);
if (t) return t;
t = prompt("Enter your access token:");
if (!t) return null;
localStorage.setItem(KEY, t.trim());
return t.trim();
}
async function strip(file) {
const token = getToken();
if (!token) return;
status.className = "status";
status.textContent = "Stripping metadata…";
try {
const res = await fetch("/strip", {
method: "POST",
headers: {
"Authorization": "Bearer " + token,
"Content-Type": file.type || "image/jpeg",
},
body: file,
});
if (res.status === 401) {
localStorage.removeItem(KEY);
status.className = "status error";
status.textContent = "Bad token. Try again.";
return;
}
if (!res.ok) {
const err = await res.json().catch(() => ({}));
throw new Error(err.message || "Strip failed");
}
const blob = await res.blob();
const url = URL.createObjectURL(blob);
const a = document.createElement("a");
const name = (file.name || "photo").replace(/\\.[^.]+$/, "") + "_clean.jpg";
a.href = url;
a.download = name;
a.click();
URL.revokeObjectURL(url);
status.className = "status";
status.textContent = "Done — saved " + name;
} catch (e) {
status.className = "status error";
status.textContent = e.message;
}
}
drop.addEventListener("click", () => fileInput.click());
fileInput.addEventListener("change", () => { if (fileInput.files[0]) strip(fileInput.files[0]); });
drop.addEventListener("dragover", (e) => { e.preventDefault(); drop.classList.add("over"); });
drop.addEventListener("dragleave", () => drop.classList.remove("over"));
drop.addEventListener("drop", (e) => {
e.preventDefault();
drop.classList.remove("over");
if (e.dataTransfer.files[0]) strip(e.dataTransfer.files[0]);
});
})();
</script>
</body>
</html>`);
});
app.post("/strip", async (req, res) => {
res.setHeader("Connection", "close");
return withConvertSingleFlight(req, res, async () => {
try {
if (!requireAuth(req, res)) return;
if (!req.body?.length) {
return sendError(res, 400, "empty_body", "Empty body", req.requestId);
}
const opts = {
quality: clampInt(req.headers["x-jpeg-quality"], 40, 100, 92),
maxDim: 0,
withoutEnlargement: true,
};
let jpeg;
if (looksLikeHeic(req.body)) {
if (isAborted(req, res)) return;
jpeg = await heicToJpeg(req.body, opts);
} else {
await assertSupportedRaster(req.body);
if (isAborted(req, res)) return;
jpeg = await normalizeForVision(req.body, opts);
}
if (isAborted(req, res)) return;
res.setHeader("Content-Type", "image/jpeg");
return res.send(jpeg);
} catch (e) {
const status = e?.statusCode || 500;
const code = e?.code || "strip_failed";
console.error(JSON.stringify({ requestId: req.requestId, err: String(e?.stack || e) }));
return sendError(
res,
status,
code,
status === 415 ? "Unsupported media type" : "Metadata strip failed",
req.requestId
);
}
});
});
app.post("/convert", async (req, res) => {
res.setHeader("Connection", "close");