@dytsou/shorten-url 2.3.1 → 2.4.2

package/docs/index.html

@@ -29,13 +29,9 @@
 
       h1 {
         text-align: center;
-        color: #333;
+        color: #3730a3;
         margin-bottom: 30px;
         font-size: 2.5em;
-        background: linear-gradient(45deg, #667eea, #764ba2);
-        -webkit-background-clip: text;
-        -webkit-text-fill-color: transparent;
-        background-clip: text;
       }
 
       .form-group {
@@ -100,7 +96,7 @@
       button {
         width: 100%;
         padding: 15px;
-        background: linear-gradient(45deg, #667eeac3, #764ba2ba);
+        background: linear-gradient(45deg, #4338ca, #6b21a8);
         color: white;
         border: none;
         border-radius: 10px;
@@ -169,7 +165,7 @@
 
       .copy-btn {
         padding: 10px 20px;
-        background: #28a745;
+        background: #157347;
         color: white;
         border: none;
         border-radius: 5px;
@@ -182,7 +178,7 @@
       }
 
       .copy-btn:hover {
-        background: #218838;
+        background: #0f5132;
         transform: translateY(-1px);
       }
 
@@ -215,7 +211,7 @@
       }
 
       .error {
-        color: #dc3545;
+        color: #842029;
         background: #f8d7da;
         border: 1px solid #f5c6cb;
         padding: 10px;
@@ -244,6 +240,18 @@
         margin-top: 5px;
       }
 
+      .sr-only {
+        position: absolute;
+        width: 1px;
+        height: 1px;
+        padding: 0;
+        margin: -1px;
+        overflow: hidden;
+        clip: rect(0, 0, 0, 0);
+        white-space: nowrap;
+        border: 0;
+      }
+
       @media (max-width: 768px) {
         .container {
           margin: 20px auto;
@@ -353,6 +361,7 @@
       <div class="result" id="result">
         <h3>Your shortened URL:</h3>
         <div class="shortened-url">
+          <label for="shortUrlOutput" class="sr-only">Shortened URL</label>
           <input type="text" id="shortUrlOutput" readonly />
           <button class="copy-btn" onclick="copyToClipboard()">Copy</button>
         </div>
@@ -559,6 +568,7 @@
             document.getElementById("error").classList.add("show");
           }
         } catch (error) {
+          console.error("Network error:", error);
           // Hide loading
           document.getElementById("loading").classList.remove("show");
 
@@ -573,10 +583,10 @@
         const shortUrlInput = document.getElementById("shortUrlOutput");
         const copyBtn = document.querySelector(".copy-btn");
         const originalText = copyBtn.textContent;
-        const originalBg = copyBtn.style.backgroundColor || "#28a745";
+        const originalBg = copyBtn.style.backgroundColor || "#157347";
 
         if (!shortUrlInput.value) {
-          showCopyFeedback(copyBtn, "No URL!", "#dc3545", originalText, originalBg);
+          showButtonFeedback(copyBtn, "No URL!", "#dc3545", originalText, originalBg);
           return;
         }
 
@@ -584,12 +594,12 @@
           // Try modern Clipboard API first
           if (navigator.clipboard && window.isSecureContext) {
             await navigator.clipboard.writeText(shortUrlInput.value);
-            showCopyFeedback(copyBtn, "Copied!", "#28a745", originalText, originalBg);
+            showButtonFeedback(copyBtn, "Copied!", "#28a745", originalText, originalBg);
           } else {
             // Fallback: ask user to copy manually
             shortUrlInput.select();
             shortUrlInput.focus();
-            showCopyFeedback(copyBtn, "Select & Copy", "#ffc107", originalText, originalBg, 3000);
+            showButtonFeedback(copyBtn, "Select & Copy", "#ffc107", originalText, originalBg, 3000);
           }
         } catch (err) {
           console.error("Failed to copy: ", err);
@@ -597,12 +607,19 @@
           // Final fallback - show the URL and ask user to copy manually
           shortUrlInput.select();
           shortUrlInput.focus();
-          showCopyFeedback(copyBtn, "Select & Copy", "#ffc107", originalText, originalBg, 3000);
+          showButtonFeedback(copyBtn, "Select & Copy", "#ffc107", originalText, originalBg, 3000);
         }
       }
 
-      // Helper function for copy feedback
-      function showCopyFeedback(button, text, bgColor, originalText, originalBg, duration = 2000) {
+      // Helper function for button feedback
+      function showButtonFeedback(
+        button,
+        text,
+        bgColor,
+        originalText,
+        originalBg,
+        duration = 2000
+      ) {
         button.textContent = text;
         button.style.backgroundColor = bgColor;
         button.style.transform = "scale(0.95)";
@@ -624,12 +641,12 @@
 
         // Validate URL input
         if (!longUrl) {
-          showGotoFeedback(gotoBtn, "Enter URL first!", "#dc3545", originalText, originalBg);
+          showButtonFeedback(gotoBtn, "Enter URL first!", "#dc3545", originalText, originalBg);
           return;
         }
 
         // Show processing state
-        showGotoFeedback(gotoBtn, "Shortening...", "#ffc107", originalText, originalBg, 10000);
+        showButtonFeedback(gotoBtn, "Shortening...", "#ffc107", originalText, originalBg, 10000);
 
         try {
           // Prepare the request payload
@@ -661,7 +678,7 @@
             window.open(shortUrl, "_blank", "noopener,noreferrer");
 
             // Show success feedback
-            showGotoFeedback(gotoBtn, "Opened!", "#28a745", originalText, originalBg);
+            showButtonFeedback(gotoBtn, "Opened!", "#28a745", originalText, originalBg);
 
             // Reset form
             document.getElementById("urlForm").reset();
@@ -687,31 +704,18 @@
               response.status,
               "Unable to shorten URL. Please verify the URL and try again."
             );
-            showGotoFeedback(gotoBtn, "Error!", "#dc3545", originalText, originalBg);
+            showButtonFeedback(gotoBtn, "Error!", "#dc3545", originalText, originalBg);
             document.getElementById("error").textContent = errorMsg;
             document.getElementById("error").classList.add("show");
           }
         } catch (error) {
           console.error("Network error:", error);
-          showGotoFeedback(gotoBtn, "Network Error!", "#dc3545", originalText, originalBg);
+          showButtonFeedback(gotoBtn, "Network Error!", "#dc3545", originalText, originalBg);
           document.getElementById("error").textContent = "Network error. Please try again.";
           document.getElementById("error").classList.add("show");
         }
       }
 
-      // Helper function for goto feedback
-      function showGotoFeedback(button, text, bgColor, originalText, originalBg, duration = 2000) {
-        button.textContent = text;
-        button.style.backgroundColor = bgColor;
-        button.style.transform = "scale(0.95)";
-
-        setTimeout(() => {
-          button.textContent = originalText;
-          button.style.backgroundColor = originalBg;
-          button.style.transform = "scale(1)";
-        }, duration);
-      }
-
       // Custom slug validation
       document.getElementById("customSlug").addEventListener("input", function (e) {
         const value = e.target.value;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dytsou/shorten-url",
-  "version": "2.3.1",
+  "version": "2.4.2",
   "description": "A modern, fast URL shortener built with Cloudflare Workers and a responsive web interface",
   "type": "module",
   "main": "src/worker.js",
@@ -22,16 +22,18 @@
   },
   "homepage": "https://github.com/dytsou/shorten-url#readme",
   "engines": {
-    "node": ">=18.0.0"
+    "node": ">=24.0.0"
   },
   "devDependencies": {
     "prettier": "^3.7.4",
-    "vitest": "^4.0.16",
-    "wrangler": "^4.58.0"
+    "vite": "7.3.6",
+    "vitest": "^4.1.10",
+    "wrangler": "^4.120.0"
   },
   "files": [
     "src/worker.js",
     "src/worker.example.js",
+    "src/lib/",
     "config/",
     "docs/",
     "README.md",
@@ -40,6 +42,7 @@
   "scripts": {
     "dev": "wrangler dev",
     "deploy": "wrangler deploy",
+    "logs": "wrangler tail",
     "preview": "wrangler dev",
     "publish:npmjs": "pnpm publish --registry https://registry.npmjs.org",
     "publish:github": "pnpm publish --registry https://npm.pkg.github.com",

package/src/lib/access.js

@@ -0,0 +1,5 @@
+export function hasPassedAccess(request) {
+  const jwt = request.headers.get("Cf-Access-Jwt-Assertion");
+  const email = request.headers.get("Cf-Access-Authenticated-User-Email");
+  return Boolean(jwt && email);
+}

package/src/lib/constants.js

@@ -0,0 +1,2 @@
+export const SLUG_PATTERN = /^[a-zA-Z0-9\-_]+$/;
+export const URL_PATTERN = /http(s)?:\/\/([\w-]+\.)+[\w-]+(\/[\w- ./?%&=]*)?/;

package/src/lib/crypto.js

@@ -0,0 +1,18 @@
+export function randomString(worker, len = worker.min_random_key_length) {
+  const chars = worker.random_chars;
+  const bytes = new Uint8Array(len);
+  crypto.getRandomValues(bytes);
+  let result = "";
+  for (let i = 0; i < len; i++) {
+    result += chars.charAt(bytes[i] % chars.length);
+  }
+  return result;
+}
+
+export async function sha512(text) {
+  const data = new TextEncoder().encode(text);
+  const digest = await crypto.subtle.digest("SHA-512", data);
+  return Array.from(new Uint8Array(digest))
+    .map((b) => b.toString(16).padStart(2, "0"))
+    .join("");
+}

package/src/lib/endpoints.js

@@ -0,0 +1,12 @@
+/** Build hosted page URLs from a frontend config object. */
+export function endpointsFromFrontend(frontend) {
+  const pagesBase = frontend.pagesBase || frontend.url;
+  return {
+    shortenPage: frontend.url,
+    notFoundPage: new URL("404.html", pagesBase).href,
+    errorPage: new URL("error.html", pagesBase).href,
+    safeBrowsingWarning: new URL("safe-browsing-warning.html", pagesBase).href,
+    noRefPage: new URL("no-ref-page.html", pagesBase).href,
+    safeBrowsing: "https://safebrowsing.googleapis.com/v4/threatMatches:find",
+  };
+}

package/src/lib/kv.js

@@ -0,0 +1,49 @@
+import { randomString, sha512 } from "./crypto.js";
+import { logError, traceSpan } from "./observability.js";
+
+export function createKvStore({ worker, kv }) {
+  async function saveUrl(url, customSlug = null) {
+    return traceSpan("kv.save", async (span) => {
+      if (span.isTraced) span.setAttribute("kv.custom_slug", Boolean(customSlug));
+      try {
+        const key = customSlug || randomString(worker);
+        const existing = await kv.get(key);
+
+        if (existing === null) {
+          await kv.put(key, url);
+          return [undefined, key];
+        }
+        if (customSlug) {
+          return ["CUSTOM_SLUG_EXISTS", null];
+        }
+        return saveUrl(url);
+      } catch (error) {
+        logError("kv.save_failed", error);
+        return ["KV_ERROR", null];
+      }
+    });
+  }
+
+  async function findUrlKeyByHash(urlHash) {
+    return (await kv.get(urlHash)) || null;
+  }
+
+  async function resolveShortKey(longUrl, customSlug) {
+    return traceSpan("kv.resolve", async (span) => {
+      if (span.isTraced) span.setAttribute("kv.unique_link", worker.unique_link);
+      if (worker.unique_link && !customSlug) {
+        const urlHash = await sha512(longUrl);
+        const existingKey = await findUrlKeyByHash(urlHash);
+        if (existingKey) {
+          return [undefined, existingKey];
+        }
+        const [errorCode, key] = await saveUrl(longUrl);
+        if (errorCode === undefined) await kv.put(urlHash, key);
+        return [errorCode, key];
+      }
+      return saveUrl(longUrl, customSlug);
+    });
+  }
+
+  return { saveUrl, findUrlKeyByHash, resolveShortKey };
+}

package/src/lib/observability.js

@@ -0,0 +1,86 @@
+import { tracing } from "cloudflare:workers";
+
+/** Structured JSON log for Workers Logs indexing. */
+export function log(level, event, fields = {}) {
+  console.log({ level, event, ts: new Date().toISOString(), ...fields });
+}
+
+export function logError(event, error, fields = {}) {
+  console.error({
+    level: "error",
+    event,
+    ts: new Date().toISOString(),
+    error:
+      error instanceof Error
+        ? { message: error.message, name: error.name }
+        : { message: String(error) },
+    ...fields,
+  });
+}
+
+export function requestFields(request) {
+  const url = new URL(request.url);
+  return {
+    http: {
+      method: request.method,
+      path: url.pathname,
+      ...(url.search ? { query: url.search } : {}),
+    },
+    ...(request.cf?.colo || request.cf?.country
+      ? {
+          client: {
+            ...(request.cf.colo ? { colo: request.cf.colo } : {}),
+            ...(request.cf.country ? { country: request.cf.country } : {}),
+          },
+        }
+      : {}),
+  };
+}
+
+function setRequestSpanAttributes(span, request) {
+  if (!span.isTraced) return;
+  const url = new URL(request.url);
+  span.setAttribute("http.request.method", request.method);
+  span.setAttribute("url.path", url.pathname);
+  if (request.cf?.colo) span.setAttribute("cf.colo", request.cf.colo);
+  if (request.cf?.country) span.setAttribute("cf.country", request.cf.country);
+}
+
+/** Wrap a Worker fetch handler with request-level spans and structured logs. */
+export function withFetchObservability(handler) {
+  async function observedFetch(request, env, ctx) {
+    return tracing.enterSpan("fetch", async (span) => {
+      const fields = requestFields(request);
+      setRequestSpanAttributes(span, request);
+      log("info", "request.start", fields);
+
+      try {
+        const response = await handler(request, env, ctx);
+        const status = response.status;
+        if (span.isTraced) span.setAttribute("http.response.status_code", status);
+        log("info", "request.complete", {
+          ...fields,
+          http: { ...fields.http, status },
+        });
+        return response;
+      } catch (error) {
+        logError("request.error", error, fields);
+        throw error;
+      }
+    });
+  }
+
+  return { fetch: observedFetch };
+}
+
+/** Run async work inside a named custom span. */
+export function traceSpan(name, fn, attributes = {}) {
+  return tracing.enterSpan(name, async (span) => {
+    if (span.isTraced) {
+      for (const [key, value] of Object.entries(attributes)) {
+        if (value !== undefined) span.setAttribute(key, value);
+      }
+    }
+    return fn(span);
+  });
+}

package/src/lib/responses.js

@@ -0,0 +1,63 @@
+import { wantsJson } from "./validate.js";
+
+async function fetchHostedPage(url, status = 200) {
+  const upstream = await fetch(url, { redirect: "follow" });
+  return new Response(await upstream.text(), {
+    status,
+    headers: { "content-type": "text/html;charset=UTF-8" },
+  });
+}
+
+async function fetchInterstitial(url, destination) {
+  const upstream = await fetch(url);
+  const html = (await upstream.text()).replace(/{Replace}/gm, destination);
+  return new Response(html, { headers: { "content-type": "text/html;charset=UTF-8" } });
+}
+
+export function createResponses({ worker, endpoints }) {
+  function corsHeaders() {
+    if (worker.cors !== "on") return {};
+    return {
+      "Access-Control-Allow-Origin": "*",
+      "Access-Control-Allow-Methods": "POST, GET, OPTIONS",
+    };
+  }
+
+  function htmlHeaders() {
+    return { "content-type": "text/html;charset=UTF-8", ...corsHeaders() };
+  }
+
+  function jsonHeaders() {
+    return { "content-type": "application/json;charset=UTF-8", ...corsHeaders() };
+  }
+
+  function jsonResponse(payload, status) {
+    return new Response(JSON.stringify(payload), { status, headers: jsonHeaders() });
+  }
+
+  async function errorResponse(message, code, request) {
+    if (wantsJson(request) || !endpoints.errorPage) {
+      return jsonResponse({ status: code, message }, code);
+    }
+    const url = `${endpoints.errorPage}?message=${encodeURIComponent(message)}&code=${encodeURIComponent(code)}`;
+    return fetchHostedPage(url, code);
+  }
+
+  function notFound() {
+    if (!endpoints.notFoundPage) {
+      return jsonResponse({ status: 404, message: "URL not found" }, 404);
+    }
+    return fetchHostedPage(endpoints.notFoundPage, 404);
+  }
+
+  return {
+    corsHeaders,
+    htmlHeaders,
+    jsonHeaders,
+    jsonResponse,
+    fetchHostedPage,
+    fetchInterstitial,
+    errorResponse,
+    notFound,
+  };
+}

package/src/lib/safety.js

@@ -0,0 +1,28 @@
+import { traceSpan } from "./observability.js";
+
+export async function isUrlSafe(url, worker, endpoints) {
+  return traceSpan("safe_browsing.check", async () => {
+    const body = JSON.stringify({
+      client: { clientId: "Url-Shorten-Worker", clientVersion: "1.0.7" },
+      threatInfo: {
+        threatTypes: [
+          "MALWARE",
+          "SOCIAL_ENGINEERING",
+          "POTENTIALLY_HARMFUL_APPLICATION",
+          "UNWANTED_SOFTWARE",
+        ],
+        platformTypes: ["ANY_PLATFORM"],
+        threatEntryTypes: ["URL"],
+        threatEntries: [{ url }],
+      },
+    });
+
+    const response = await fetch(`${endpoints.safeBrowsing}?key=${worker.safe_browsing_api_key}`, {
+      method: "POST",
+      body,
+      redirect: "follow",
+    });
+    const result = await response.json();
+    return Object.keys(result).length === 0;
+  });
+}

package/src/lib/shortener.js

@@ -0,0 +1,119 @@
+import { hasPassedAccess } from "./access.js";
+import { createKvStore } from "./kv.js";
+import { log, logError, traceSpan } from "./observability.js";
+import { createResponses } from "./responses.js";
+import { isUrlSafe } from "./safety.js";
+import { isValidCustomSlug, isValidUrl } from "./validate.js";
+
+export function createShortener({ worker, endpoints, kv }) {
+  const responses = createResponses({ worker, endpoints });
+  const kvStore = createKvStore({ worker, kv });
+  const reservedSlugSet = new Set(worker.reserved_slugs.map((s) => s.toLowerCase()));
+  const { jsonResponse, fetchInterstitial, errorResponse, notFound } = responses;
+  const { resolveShortKey } = kvStore;
+
+  function respondToSaveError(errorCode, request) {
+    if (errorCode === "CUSTOM_SLUG_EXISTS") {
+      return errorResponse("Custom slug already exists", 400, request);
+    }
+    if (errorCode === "KV_ERROR") {
+      return errorResponse("Database error occurred", 500, request);
+    }
+    return errorResponse("Error: Reach the KV write limitation", 500, request);
+  }
+
+  async function validateShortenPayload(body, request) {
+    const longUrl = body.url;
+    if (!longUrl) return { error: await errorResponse("URL is required", 400, request) };
+    if (!isValidUrl(longUrl)) {
+      return { error: await errorResponse("Invalid URL format", 400, request) };
+    }
+
+    const customSlug = body.custom_slug || null;
+    if (!customSlug) return { longUrl, customSlug: null };
+
+    if (!worker.custom_link) {
+      return { error: await errorResponse("Custom URLs are disabled", 400, request) };
+    }
+    if (!isValidCustomSlug(customSlug, worker, reservedSlugSet)) {
+      return { error: await errorResponse("Invalid custom slug format", 400, request) };
+    }
+    return { longUrl, customSlug };
+  }
+
+  async function handleShorten(
+    request,
+    requestURL,
+    { apiPath = "/", allowedApiPaths = ["/"], requireAccess = true } = {}
+  ) {
+    return traceSpan("shorten", async (span) => {
+      if (span.isTraced) span.setAttribute("api.path", apiPath);
+
+      const allowedPaths =
+        allowedApiPaths instanceof Set ? allowedApiPaths : new Set(allowedApiPaths);
+      if (!allowedPaths.has(apiPath)) {
+        return jsonResponse({ status: 404, message: "Invalid API path" }, 404);
+      }
+
+      if (requireAccess && !hasPassedAccess(request)) {
+        log("warn", "shorten.access_denied", { api: { path: apiPath } });
+        return errorResponse("You must use WARP to shorten the URL", 403, request);
+      }
+
+      let body;
+      try {
+        body = await request.json();
+      } catch (error) {
+        logError("shorten.invalid_json", error, { api: { path: apiPath } });
+        return errorResponse("Invalid JSON format", 400, request);
+      }
+
+      const validated = await validateShortenPayload(body, request);
+      if (validated.error) return validated.error;
+
+      const [errorCode, key] = await resolveShortKey(validated.longUrl, validated.customSlug);
+      if (errorCode === undefined) {
+        log("info", "shorten.created", {
+          key,
+          custom_slug: Boolean(validated.customSlug),
+        });
+        return jsonResponse({ short_url: `${requestURL.origin}/${key}` }, 201);
+      }
+      log("warn", "shorten.save_failed", { error_code: errorCode });
+      return respondToSaveError(errorCode, request);
+    });
+  }
+
+  async function handleShortUrlRedirect(path, params, suffix = null) {
+    return traceSpan("redirect", async (span) => {
+      const key = suffix ? `${path}/${suffix}` : path;
+      if (span.isTraced) span.setAttribute("shortlink.key", key || "");
+
+      if (!key) return notFound();
+
+      const value = await kv.get(key);
+      if (!value) {
+        log("info", "redirect.not_found", { key });
+        return notFound();
+      }
+
+      const destination = params ? value + params : value;
+
+      if (worker.safe_browsing_api_key && !(await isUrlSafe(destination, worker, endpoints))) {
+        log("warn", "redirect.unsafe_url", { key });
+        return fetchInterstitial(endpoints.safeBrowsingWarning, destination);
+      }
+      if (worker.no_ref === "on") {
+        return fetchInterstitial(endpoints.noRefPage, destination);
+      }
+      log("info", "redirect.success", { key });
+      return Response.redirect(destination, 302);
+    });
+  }
+
+  return {
+    ...responses,
+    handleShorten,
+    handleShortUrlRedirect,
+  };
+}

package/src/lib/validate.js

@@ -0,0 +1,24 @@
+import { SLUG_PATTERN, URL_PATTERN } from "./constants.js";
+
+export function isValidUrl(url) {
+  return typeof url === "string" && url.startsWith("h") && URL_PATTERN.test(url);
+}
+
+export function isValidCustomSlug(slug, worker, reservedSlugs = worker.reserved_slugs) {
+  const reserved =
+    reservedSlugs instanceof Set
+      ? reservedSlugs
+      : new Set(reservedSlugs.map((s) => s.toLowerCase()));
+  return (
+    SLUG_PATTERN.test(slug) &&
+    slug.length >= 1 &&
+    slug.length <= worker.max_custom_slug_length &&
+    !reserved.has(slug.toLowerCase())
+  );
+}
+
+export function wantsJson(request) {
+  const accept = request.headers.get("accept") || "";
+  const contentType = request.headers.get("content-type") || "";
+  return accept.includes("application/json") || contentType.includes("application/json");
+}

package/src/worker.example.js

@@ -1,376 +1,65 @@
+/**
+ * URL Shortener — Cloudflare Worker (template)
+ *
+ * Copy this file to `src/worker.js` and wire in your config (see README).
+ * Requires a KV namespace bound as `LINKS`.
+ *
+ * Routes:
+ *   OPTIONS *                -> CORS preflight
+ *   POST    /                -> create short URL (protected by Cloudflare Access / WARP)
+ *   GET     /                -> serve the shortener frontend
+ *   GET     /<key>           -> redirect a stored short link
+ */
+
+import { createShortener } from "./lib/shortener.js";
+import { endpointsFromFrontend } from "./lib/endpoints.js";
+import { withFetchObservability } from "./lib/observability.js";
+
+// ============================================================================
+// Configuration
+// ============================================================================
+
 let config;
 
 try {
-  // In a real deployment, you might want to fetch this from KV storage
-  // or use environment variables for sensitive data
   if (typeof importConfig !== "undefined") {
     config = { ...defaultConfig, ...importConfig };
-  }
-} catch (e) {
-  console.log("Error importing config");
-  throw e;
-  exit();
-}
-
-let response_header = {
-  "content-type": "text/html;charset=UTF-8",
-};
-
-if (config.worker.cors == "on") {
-  response_header = {
-    "content-type": "text/html;charset=UTF-8",
-    "Access-Control-Allow-Origin": "*",
-    "Access-Control-Allow-Methods": "POST",
-  };
-}
-
-// Check whether this request has passed Cloudflare Access (Zero Trust / WARP)
-function requireAccess(request) {
-  const jwt = request.headers.get("Cf-Access-Jwt-Assertion");
-  const email = request.headers.get("Cf-Access-Authenticated-User-Email");
-
-  console.log("Access headers:", {
-    jwtPresent: !!jwt,
-    email,
-  });
-
-  // Defensive check: if Access is misconfigured, block unauthenticated traffic
-  if (!jwt || !email) {
-    return false;
-  }
-
-  // If you want to restrict to specific accounts, you can check email here:
-  // const allowed = ["you@nycu.edu.tw", "xxx@example.com"];
-  // if (!allowed.includes(email)) return false;
-
-  return true;
-}
-
-// Create JSON error response
-function createJsonErrorResponse(message, code) {
-  return new Response(JSON.stringify({ status: code, message: message }), {
-    status: code,
-    headers: {
-      ...response_header,
-      "content-type": "application/json;charset=UTF-8",
-    },
-  });
-}
-
-// Generate random string for short URLs
-async function randomString(len) {
-  len = len || config.worker.min_random_key_length;
-  let $chars = config.worker.random_chars; // Configurable character set
-  let maxPos = $chars.length;
-  let result = "";
-  for (i = 0; i < len; i++) {
-    result += $chars.charAt(Math.floor(Math.random() * maxPos));
-  }
-  return result;
-}
-
-// Generate SHA512 hash for URL
-async function sha512(url) {
-  url = new TextEncoder().encode(url);
-
-  const url_digest = await crypto.subtle.digest(
-    {
-      name: "SHA-512",
-    },
-    url // The data you want to hash as an ArrayBuffer
-  );
-  const hashArray = Array.from(new Uint8Array(url_digest)); // convert buffer to byte array
-  const hashHex = hashArray.map((b) => b.toString(16).padStart(2, "0")).join("");
-  return hashHex;
-}
-
-// Validate URL format
-async function checkURL(URL) {
-  let str = URL;
-  let Expression = /http(s)?:\/\/([\w-]+\.)+[\w-]+(\/[\w- .\/?%&=]*)?/;
-  let objExp = new RegExp(Expression);
-  if (objExp.test(str) == true) {
-    if (str[0] == "h") return true;
-    else return false;
   } else {
-    return false;
+    throw new TypeError(
+      "Worker config is missing. Copy config/config.example.js to config/config.js and import it when building worker.js."
+    );
   }
+} catch (error) {
+  console.error("Failed to load worker config:", error);
+  throw error;
 }
 
-// Validate custom slug format
-async function validateCustomSlug(slug) {
-  // Check format - only allow letters, numbers, hyphens, and underscores
-  const slugRegex = /^[a-zA-Z0-9\-_]+$/;
-  if (!slugRegex.test(slug)) {
-    return false;
-  }
-
-  // Check length using config
-  if (slug.length < 1 || slug.length > config.worker.max_custom_slug_length) {
-    return false;
-  }
-
-  // Check reserved words from config
-  if (config.worker.reserved_slugs.includes(slug.toLowerCase())) {
-    return false;
-  }
-
-  return true;
-}
-
-// Save URL with random or custom key
-async function save_url(URL, customSlug = null) {
-  try {
-    let random_key;
-
-    if (customSlug) {
-      // Use custom slug if provided
-      random_key = customSlug;
-    } else {
-      // Generate random key
-      random_key = await randomString();
-    }
-
-    let is_exist = await LINKS.get(random_key);
-    console.log(is_exist);
-
-    if (is_exist == null) {
-      await LINKS.put(random_key, URL);
-      return [undefined, random_key];
-    } else if (customSlug) {
-      // If custom slug already exists, return error
-      return ["CUSTOM_SLUG_EXISTS", null];
-    } else {
-      // If random key exists, try again
-      return save_url(URL);
-    }
-  } catch (error) {
-    console.error("Error in save_url:", error);
-    return ["KV_ERROR", null];
-  }
-}
-
-// Check if URL exists in database
-async function is_url_exist(url_sha512) {
-  let is_exist = await LINKS.get(url_sha512);
-  console.log(is_exist);
-  if (is_exist == null) {
-    return false;
-  } else {
-    return is_exist;
-  }
-}
-
-// Check URL safety using Google Safe Browsing API
-async function is_url_safe(url) {
-  let raw = JSON.stringify({
-    client: {
-      clientId: "Url-Shorten-Worker",
-      clientVersion: "1.0.7",
-    },
-    threatInfo: {
-      threatTypes: [
-        "MALWARE",
-        "SOCIAL_ENGINEERING",
-        "POTENTIALLY_HARMFUL_APPLICATION",
-        "UNWANTED_SOFTWARE",
-      ],
-      platformTypes: ["ANY_PLATFORM"],
-      threatEntryTypes: ["URL"],
-      threatEntries: [{ url: url }],
-    },
-  });
-
-  let requestOptions = {
-    method: "POST",
-    body: raw,
-    redirect: "follow",
-  };
-
-  let result = await fetch(
-    "https://safebrowsing.googleapis.com/v4/threatMatches:find?key=" +
-      config.worker.safe_browsing_api_key,
-    requestOptions
-  );
-  result = await result.json();
-  console.log(result);
-  if (Object.keys(result).length === 0) {
-    return true;
-  } else {
-    return false;
-  }
+function getEndpoints() {
+  return endpointsFromFrontend(config.frontend);
 }
 
-// Handle short URL redirect
-async function handleShortUrlRedirect(path, params) {
-  if (!path) {
-    const html404 = await fetch("https://dytsou.github.io/404.html");
-    return new Response(await html404.text(), {
-      headers: {
-        "content-type": "text/html;charset=UTF-8",
-      },
-      status: 404,
-    });
-  }
-
-  const value = await LINKS.get(path);
-  let location;
-
-  if (params) {
-    location = value + params;
-  } else {
-    location = value;
-  }
-  console.log(value);
-
-  if (location) {
-    if (config.worker.safe_browsing_api_key) {
-      if (!(await is_url_safe(location))) {
-        let warning_page = safeBrowsingWarning.replace(/{Replace}/gm, location);
-        return new Response(warning_page, {
-          headers: {
-            "content-type": "text/html;charset=UTF-8",
-          },
-        });
-      }
-    }
-
-    if (config.worker.no_ref == "on") {
-      let no_ref = noRefPage.replace(/{Replace}/gm, location);
-      return new Response(no_ref, {
-        headers: {
-          "content-type": "text/html;charset=UTF-8",
-        },
-      });
-    } else {
-      return Response.redirect(location, 302);
-    }
-  }
-
-  // If request not in kv, return 404
-  const html404 = await fetch("https://dytsou.github.io/404.html");
-  return new Response(await html404.text(), {
-    headers: {
-      "content-type": "text/html;charset=UTF-8",
-    },
-    status: 404,
+async function exampleFetchHandler(request, env) {
+  const shortener = createShortener({
+    worker: config.worker,
+    endpoints: getEndpoints(),
+    kv: env.LINKS,
   });
-}
-
-// Handle GET requests
-async function handleGetRequest(requestURL) {
-  const path = requestURL.pathname.split("/")[1];
-  const params = requestURL.search;
-  console.log(path);
-  return await handleShortUrlRedirect(path, params);
-}
-
-// Handle POST requests (URL shortening)
-async function handlePostRequest(request, requestURL, pathname) {
-  // Only allow shortening via the /shorten endpoint
-  if (pathname !== "/shorten") {
-    return createJsonErrorResponse("Invalid API path", 404);
-  }
-
-  // Enforce Cloudflare Access / WARP for this API
-  if (!requireAccess(request)) {
-    return createJsonErrorResponse("You must use WARP to shorten the URL", 403);
-  }
-
-  let req;
-  try {
-    req = await request.json();
-    console.log(req["url"]);
-  } catch (error) {
-    console.error("Error parsing JSON:", error);
-    return createJsonErrorResponse("Invalid JSON format", 400);
-  }
-
-  // Validate URL
-  if (!req["url"]) {
-    return createJsonErrorResponse("URL is required", 400);
-  }
-
-  if (!(await checkURL(req["url"]))) {
-    return createJsonErrorResponse("Invalid URL format", 400);
-  }
-
-  let stat, random_key;
-  let customSlug = req["custom_slug"] || null;
-
-  // Validate custom slug if provided
-  if (customSlug) {
-    if (!config.worker.custom_link) {
-      return createJsonErrorResponse("Custom URLs are disabled", 400);
-    }
-
-    if (!(await validateCustomSlug(customSlug))) {
-      return createJsonErrorResponse("Invalid custom slug format", 400);
-    }
-  }
-
-  if (config.worker.unique_link && !customSlug) {
-    let url_sha512 = await sha512(req["url"]);
-    let url_key = await is_url_exist(url_sha512);
-    if (url_key) {
-      random_key = url_key;
-    } else {
-      [stat, random_key] = await save_url(req["url"], customSlug);
-      if (typeof stat == "undefined") {
-        console.log(await LINKS.put(url_sha512, random_key));
-      }
-    }
-  } else {
-    [stat, random_key] = await save_url(req["url"], customSlug);
-  }
-
-  console.log(stat);
-
-  if (stat === "CUSTOM_SLUG_EXISTS") {
-    return createJsonErrorResponse("Custom slug already exists", 400);
-  }
-
-  if (stat === "KV_ERROR") {
-    return createJsonErrorResponse("Database error occurred", 500);
-  }
-
-  if (typeof stat == "undefined") {
-    const shortUrl = `${requestURL.origin}/${random_key}`;
-    return new Response(JSON.stringify({ short_url: shortUrl }), {
-      status: 201,
-      headers: {
-        ...response_header,
-        "content-type": "application/json;charset=UTF-8",
-      },
-    });
-  }
-
-  return createJsonErrorResponse("Error: Reach the KV write limitation", 500);
-}
-
-// Main request handler
-async function handleRequest(request) {
-  console.log(request);
 
   const requestURL = new URL(request.url);
-  const pathname = requestURL.pathname;
+  const [, path] = requestURL.pathname.split("/");
+  const params = requestURL.search;
 
-  // CORS preflight
   if (request.method === "OPTIONS") {
-    return new Response("", {
-      status: 204,
-      headers: response_header,
-    });
+    return new Response(null, { status: 204, headers: shortener.htmlHeaders() });
   }
-
   if (request.method === "POST") {
-    return await handlePostRequest(request, requestURL, pathname);
+    return shortener.handleShorten(request, requestURL, {
+      apiPath: requestURL.pathname,
+      allowedApiPaths: ["/"],
+    });
   }
-
-  // Handle GET requests (and any other methods)
-  return await handleGetRequest(requestURL);
+  if (!path) return shortener.fetchHostedPage(getEndpoints().shortenPage);
+  return shortener.handleShortUrlRedirect(path, params);
 }
 
-addEventListener("fetch", async (event) => {
-  event.respondWith(handleRequest(event.request));
-});
+export default withFetchObservability(exampleFetchHandler);

package/config/config.js

@@ -1,101 +0,0 @@
-/**
- * URL Shortener Configuration
- * 
- * This file contains all configurable settings for the URL shortener.
- * Copy this file from config.example.js and modify the values as needed.
- */
-
-const config = {
-  // Frontend Configuration
-  frontend: {
-    // URL where your frontend is hosted (used by worker to serve the main page)
-    url: "https://dytsou.github.io/shorten-url/",
-
-    // Domain displayed in the custom slug input prefix
-    // If null, will use the current domain automatically
-    displayDomain: null,
-
-    // Default theme for the frontend
-    theme: "", // Use empty string for default theme, or "theme/urlcool" for urlcool theme
-  },
-
-  // Worker Configuration
-  worker: {
-    // Control the HTTP referrer header
-    // Set to "on" to create anonymous links that hide the HTTP Referer header
-    no_ref: "off",
-
-    // Allow Cross-origin resource sharing for API requests
-    cors: "on",
-
-    // If true, the same long URL will be shortened into the same short URL
-    unique_link: true,
-
-    // Allow users to customize the short URL
-    custom_link: true,
-
-    // Google Safe Browsing API Key for URL safety check before redirect
-    // Leave empty to disable safety checking
-    safe_browsing_api_key: "",
-
-    // Maximum length for custom slugs
-    max_custom_slug_length: 50,
-
-    // Minimum length for generated random keys
-    min_random_key_length: 6,
-
-    // Characters used for random key generation (removed confusing characters)
-    random_chars: 'ABCDEFGHJKMNPQRSTWXYZabcdefhijkmnprstwxyz2345678',
-
-    // Reserved slugs that cannot be used as custom URLs
-    reserved_slugs: ['api', 'admin', 'www', 'mail', 'ftp', 'localhost', 'password', 'help', 'support', 'contact', 'about']
-  },
-
-  // KV Storage Configuration (Cloudflare Workers)
-  storage: {
-    // KV namespace binding name (must match wrangler.toml)
-    binding_name: "LINKS"
-  },
-
-  // Security Configuration
-  security: {
-    // Rate limiting (requests per minute per IP)
-    rate_limit: 10,
-
-    // Enable URL validation
-    validate_urls: true,
-
-    // Block suspicious domains
-    block_suspicious_domains: true,
-
-    // List of blocked domains (exact matches)
-    blocked_domains: [
-      "bit.ly",
-      "tinyurl.com",
-      "t.co",
-      "reurl.cc"
-    ]
-  },
-
-  // Analytics Configuration (optional)
-  analytics: {
-    // Enable click tracking
-    enable_tracking: false,
-
-    // Google Analytics tracking ID
-    ga_tracking_id: "",
-
-    // Custom analytics endpoint
-    analytics_endpoint: ""
-  }
-};
-
-// Export for use in other files
-if (typeof module !== 'undefined' && module.exports) {
-  module.exports = config;
-}
-
-// Make available globally for browser usage
-if (typeof window !== 'undefined') {
-  window.APP_CONFIG = config;
-}