feat(dev,html-app): add Webhook HTML app

Author: azasypkin

README.md

@@ -34,15 +34,16 @@ Secutils.dev adheres to [open security principles](https://en.wikipedia.org/wiki
 
 A handful of focused, no-signup, browser-only tools is hosted at [tools.secutils.dev](https://tools.secutils.dev/). Every tool ships with a stable shareable URL (drop a link into a ticket, an MCP agent, or a postmortem) and an AI-agent skill at `/<slug>.md` so coding assistants can drive the tool directly from a `WebFetch` call.
 
-| Tool                                                              | What it does                                                       | AI-agent skill                                                |
-|-------------------------------------------------------------------|--------------------------------------------------------------------|---------------------------------------------------------------|
-| [JWT Debugger](https://tools.secutils.dev/jwt)                    | Decode, verify, and sign HMAC JSON Web Tokens                      | [`/jwt.md`](https://tools.secutils.dev/jwt.md)                |
-| [SAML Decoder](https://tools.secutils.dev/saml)                   | Inspect SAML responses, requests, and metadata                     | [`/saml.md`](https://tools.secutils.dev/saml.md)              |
-| [PEM Certificate Decoder](https://tools.secutils.dev/pem)         | Inspect PEM-encoded X.509 certificate chains                       | [`/pem.md`](https://tools.secutils.dev/pem.md)                |
-| [Markdown to HTML](https://tools.secutils.dev/md-to-html)         | Self-contained HTML and PDF export from Markdown                   | [`/md-to-html.md`](https://tools.secutils.dev/md-to-html.md)  |
-| [PDF Extractor](https://tools.secutils.dev/pdf)                   | Extract spatial text and structured JSON from PDFs, in-browser     | [`/pdf.md`](https://tools.secutils.dev/pdf.md)                |
-| [HTTP Echo / Mock Response](https://tools.secutils.dev/echo)      | Build a customizable HTTP response, served as a shareable URL      | [`/echo.md`](https://tools.secutils.dev/echo.md)              |
-| [Forecast](https://tools.secutils.dev/forecast)                   | Fit trendlines, forecast future values, spot anomalies             | [`/forecast.md`](https://tools.secutils.dev/forecast.md)      |
+| Tool                                                         | What it does                                                              | AI-agent skill                                               |
+|--------------------------------------------------------------|---------------------------------------------------------------------------|--------------------------------------------------------------|
+| [JWT Debugger](https://tools.secutils.dev/jwt)               | Decode, verify, and sign HMAC JSON Web Tokens                             | [`/jwt.md`](https://tools.secutils.dev/jwt.md)               |
+| [SAML Decoder](https://tools.secutils.dev/saml)              | Inspect SAML responses, requests, and metadata                            | [`/saml.md`](https://tools.secutils.dev/saml.md)             |
+| [PEM Certificate Decoder](https://tools.secutils.dev/pem)    | Inspect PEM-encoded X.509 certificate chains                              | [`/pem.md`](https://tools.secutils.dev/pem.md)               |
+| [Markdown to HTML](https://tools.secutils.dev/md-to-html)    | Self-contained HTML and PDF export from Markdown                          | [`/md-to-html.md`](https://tools.secutils.dev/md-to-html.md) |
+| [PDF Extractor](https://tools.secutils.dev/pdf)              | Extract spatial text and structured JSON from PDFs, in-browser            | [`/pdf.md`](https://tools.secutils.dev/pdf.md)               |
+| [HTTP Echo / Mock Response](https://tools.secutils.dev/echo) | Build a customizable HTTP response, served as a shareable URL             | [`/echo.md`](https://tools.secutils.dev/echo.md)             |
+| [Webhook Inspector](https://tools.secutils.dev/webhook)      | Ephemeral webhook URL that captures incoming HTTP requests, E2E-encrypted | [`/webhook.md`](https://tools.secutils.dev/webhook.md)       |
+| [Forecast](https://tools.secutils.dev/forecast)              | Fit trendlines, forecast future values, spot anomalies                    | [`/forecast.md`](https://tools.secutils.dev/forecast.md)     |
 
 The aggregate index of all skills (including specialized ones not listed above) is published at [tools.secutils.dev/llms.txt](https://tools.secutils.dev/llms.txt) following the [llmstxt.org](https://llmstxt.org/) convention. Source HTML for every tool lives in [`dev/tools/`](dev/tools/) (see [`dev/tools/AGENTS.md`](dev/tools/AGENTS.md) for the deploy/SEO recipe).
 

dev/tools/AGENTS.md

@@ -213,6 +213,21 @@ Rules and caveats:
   warning in the deploy log.
 - **Marker is opt-in**: most tools are static HTML and don't need this - leave it off and
   deploy ships the body alone.
+- **Path type is NOT deployed - configure it on the responder.** `deploy.ts` PUTs only
+  `settings` (body + script + headers); it never touches the responder's `location`, so the
+  responder's `pathType` is whatever it was created with. Tools that route on a **sub-path**
+  (e.g. `webhook.html` captures requests at `/webhook/<token>` while serving its configurator
+  at the bare `/webhook`) **require a prefix responder** (`location.pathType: "^"`). If such a
+  responder is created as an exact match (`pathType: "="`), the bare mount works but every
+  sub-path returns an empty server-level `404` (no body, no `Content-Type`) because no
+  responder matches - the request never reaches the script. Symptom to recognise: management
+  calls (`/webhook?t=…`) succeed, but `/webhook/<token>` 404s with an empty body. Fix by
+  switching the responder to prefix:
+  ```bash
+  curl -X PUT "$API/api/webhooks/responders/$RID" -H "Authorization: Bearer $KEY" \
+    -H 'Content-Type: application/json' \
+    -d '{"location":{"pathType":"^","path":"/webhook","subdomainPrefix":"tools"}}'
+  ```
 - **Composes with the auto-injected Markdown-negotiation prelude.** `deploy.ts` always
   wraps every HTML responder's script (whether opt-in or empty) with a ~250 B prelude
   that 302-redirects `Accept: text/markdown` requests to the `<slug>.md` sibling. Your

dev/tools/index.html

@@ -25,7 +25,7 @@
     <meta name="twitter:title" content="Free Developer &amp; Security Tools &mdash; Secutils.dev">
     <meta name="twitter:description" content="Free, no-signup single-page tools for developers and security engineers.">
     <meta name="twitter:image" content="https://secutils.dev/docs/img/og/og-index.png">
-    <script type="application/ld+json">{"@context":"https://schema.org","@type":"ItemList","name":"Secutils.dev Free Tools","url":"https://{{TOOLS_HOST}}/","itemListElement":[{"@type":"ListItem","position":1,"url":"https://{{TOOLS_HOST}}/jwt","name":"JWT Debugger"},{"@type":"ListItem","position":2,"url":"https://{{TOOLS_HOST}}/saml","name":"SAML Decoder"},{"@type":"ListItem","position":3,"url":"https://{{TOOLS_HOST}}/pem","name":"PEM Certificate Decoder"},{"@type":"ListItem","position":4,"url":"https://{{TOOLS_HOST}}/md-to-html","name":"Markdown to HTML"},{"@type":"ListItem","position":5,"url":"https://{{TOOLS_HOST}}/pdf","name":"PDF Extractor"},{"@type":"ListItem","position":6,"url":"https://{{TOOLS_HOST}}/echo","name":"HTTP Echo / Mock Response"},{"@type":"ListItem","position":7,"url":"https://{{TOOLS_HOST}}/forecast","name":"Forecast"}]}</script>
+    <script type="application/ld+json">{"@context":"https://schema.org","@type":"ItemList","name":"Secutils.dev Free Tools","url":"https://{{TOOLS_HOST}}/","itemListElement":[{"@type":"ListItem","position":1,"url":"https://{{TOOLS_HOST}}/jwt","name":"JWT Debugger"},{"@type":"ListItem","position":2,"url":"https://{{TOOLS_HOST}}/saml","name":"SAML Decoder"},{"@type":"ListItem","position":3,"url":"https://{{TOOLS_HOST}}/pem","name":"PEM Certificate Decoder"},{"@type":"ListItem","position":4,"url":"https://{{TOOLS_HOST}}/md-to-html","name":"Markdown to HTML"},{"@type":"ListItem","position":5,"url":"https://{{TOOLS_HOST}}/pdf","name":"PDF Extractor"},{"@type":"ListItem","position":6,"url":"https://{{TOOLS_HOST}}/echo","name":"HTTP Echo / Mock Response"},{"@type":"ListItem","position":7,"url":"https://{{TOOLS_HOST}}/webhook","name":"Webhook Inspector"},{"@type":"ListItem","position":8,"url":"https://{{TOOLS_HOST}}/forecast","name":"Forecast"}]}</script>
     <link rel="preconnect" href="https://fonts.googleapis.com">
     <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
     <link href="https://fonts.googleapis.com/css2?family=Inter:wght@300..700&family=Roboto+Mono:wght@400..700&display=swap" rel="stylesheet">
@@ -170,6 +170,10 @@ <h1 class="page-title">Developer Tools</h1>
                 <div class="tool-name">Echo <span class="tool-path">/echo</span> <span class="arrow">&rarr;</span></div>
                 <div class="tool-desc">Build a fully customizable HTTP response (status, headers, body) and serve it as a shareable URL.</div>
             </a>
+            <a class="tool-card" href="/webhook">
+                <div class="tool-name">Webhook Inspector <span class="tool-path">/webhook</span> <span class="arrow">&rarr;</span></div>
+                <div class="tool-desc">Get a unique, ephemeral webhook URL and watch incoming HTTP requests arrive live in a grid. End-to-end encrypted, browser-only, no signup.</div>
+            </a>
             <a class="tool-card" href="/forecast">
                 <div class="tool-name">Forecast <span class="tool-path">/forecast</span> <span class="arrow">&rarr;</span></div>
                 <div class="tool-desc">Fit trendlines, forecast future values, smooth noisy data, and spot anomalies in any numeric series. WASM-powered, single-page, shareable.</div>