/** @jsxImportSource https://esm.sh/react */ import React from "https://esm.sh/react"; import { createRoot } from "https://esm.sh/react-dom/client"; // Middleware to track request counts function rateLimit(handler: (req: Request) => Promise) { const requestCounts: number[] = []; const LIMIT = 2000; const WINDOW = 60 * 1000; // 60 seconds in milliseconds return async (req: Request): Promise => { const now = Date.now(); // Remove old requests outside the 60-second window while (requestCounts.length > 0 && requestCounts[0] < now - WINDOW) { requestCounts.shift(); } // Add current request timestamp requestCounts.push(now); // Check if limit is exceeded if (requestCounts.length > LIMIT) { console.warn(`Alert: More than ${LIMIT} requests in the last 60 seconds!`); return new Response("Rate limit exceeded", { status: 429 }); } // Call the original handler return handler(req); }; } // Sample handler async function sampleHandler(req: Request): Promise { return new Response("Hello, World!"); } // Apply middleware to the sample handler const protectedHandler = rateLimit(sampleHandler); function App() { const [count, setCount] = React.useState(0); const handleClick = async () => { const response = await fetch(window.location.href); if (response.ok) { setCount(prev => prev + 1); } else { alert("Rate limit exceeded!"); } }; return (

Rate Limiter Demo

Requests made: {count}

); } function client() { createRoot(document.getElementById("root")).render(); } if (typeof document !== "undefined") { client(); } export default async function server(request: Request): Promise { if (request.method === "GET" && new URL(request.url).pathname === "/") { return new Response(` Rate Limiter Demo

`, { headers: { "content-type": "text/html" }, }); } return protectedHandler(request); } const css = ` body { font-family: system-ui, sans-serif; max-width: 800px; margin: 0 auto; padding: 20px; text-align: center; } button { font-size: 1rem; padding: 10px 20px; cursor: pointer; } `;

usageAlert

Version 0