31:[] 2f:{"title":"Networking Tools: Realtime Request log","cells":[{"id":0,"value":"# Networking Tools: Realtime Request log\n\nLog who is calling an endpoint and the headers used.\n\nThis notebook hosts an endpoint that reflects back the incoming metadata, and logs it, so you can use it to probe remote services that are not under your control. This utility was used to develop the [onPublish](https://observablehq.com/@tomlarkworthy/onpublish) notebook hook. A similar service to [hookbin.com](https://hookbin.com/)\n\nTry it out, \n\nhttps://webcode.run/observablehq.com/@endpointservices/realtime-request-log\n\n

 \n    curl https://webcode.run/observablehq.com/@endpointservices/realtime-request-log \n

\n\nIf you append an additional URL path, this is logged as /url so you can tag your requests for ease of identification.\n\n\n\n","pinned":false,"hidden":false,"mode":"md"},{"id":201,"value":"### Requests timeline","pinned":false,"hidden":false,"mode":"md"},{"id":174,"value":"Plot.plot({\n marks: [Plot.ruleX(requests, { x: (r) => r.time })]\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":206,"value":"### Header Counts","pinned":false,"hidden":false,"mode":"md"},{"id":263,"value":"viewof header = Inputs.select(Object.keys(headers[0]), { value: \"user-agent\" })","pinned":false,"hidden":false,"mode":"ojs"},{"id":229,"value":"Plot.plot({\n width,\n marginBottom: 100,\n x: {\n tickRotate: 10\n },\n marks: [Plot.barY(headers, Plot.groupX({ y: \"count\" }, { x: header }))]\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":126,"value":"Inputs.table(requests, {\n columns: [\"time\", \"method\", \"url\", \"headers\"],\n height: \"500px\",\n width: {\n method: \"5%\",\n url: \"20%\",\n headers: \"50%\"\n },\n format: {\n headers: (headers) =>\n htl.html`\n ${Object.entries(headers).map(\n ([header, value]) => htl.html.fragment`\n \n \n \n \n `\n )}\n

${header}

${value}

`\n }\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":289,"value":"### Data prep","pinned":false,"hidden":false,"mode":"md"},{"id":286,"value":"requests = requestsRaw\n .slice()\n .reverse()\n .map((r) => ({ ...r, time: new Date(r.time) }))","pinned":false,"hidden":false,"mode":"ojs"},{"id":435,"value":"JSON.parse(requests[0].body)","pinned":true,"hidden":false,"mode":"ojs"},{"id":224,"value":"headers = requests.map((r) => r.headers)","pinned":false,"hidden":false,"mode":"ojs"},{"id":354,"value":"viewof requestsRaw = {\n const holder = Inputs.input([]);\n const unsubscribe = database.onValue(\n database.query(ref, database.limitToLast(100)),\n (snap) => {\n holder.value = Object.values(snap.val());\n holder.dispatchEvent(new Event(\"input\", { bubbles: true }));\n }\n );\n invalidation.then(unsubscribe);\n return holder;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":293,"value":"### Server","pinned":false,"hidden":false,"mode":"md"},{"id":8,"value":"import { endpoint } from \"@endpointservices/webcode\"","pinned":false,"hidden":false,"mode":"ojs"},{"id":19,"value":"viewof url = endpoint(\"default\", async (req, res) => {\n const data = {\n ...req,\n ip: \"redacted\",\n time: { \".sv\": \"timestamp\" }\n };\n database.push(ref, data);\n res.json(data);\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":298,"value":"### Database","pinned":false,"hidden":false,"mode":"md"},{"id":318,"value":"FIREBASE_VERSION = \"9.1.3\"","pinned":false,"hidden":false,"mode":"ojs"},{"id":59,"value":"firebaseConfig = ({\n apiKey: \"AIzaSyBN4bxw6d0cM0CGPNzRrkRlBqwFQnPLdN4\",\n databaseURL:\n \"https://larkworthy-dfb11-default-rtdb.europe-west1.firebasedatabase.app\",\n projectId: \"larkworthy-dfb11\",\n appId: \"1:786910701676:web:8d7dd002acf3b78c74d049\"\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":311,"value":"app = {\n const app = await import(\n `https://www.gstatic.com/firebasejs/${FIREBASE_VERSION}/firebase-app.js`\n );\n return app.initializeApp(\n firebaseConfig,\n \"@endpointservices/realtime-request-log\"\n );\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":109,"value":"database = await import(\n `https://www.gstatic.com/firebasejs/${FIREBASE_VERSION}/firebase-database.js`\n)","pinned":false,"hidden":false,"mode":"ojs"},{"id":336,"value":"ref = database.ref(\n database.getDatabase(app),\n \"@endpointservices/realtime-request-log\"\n)","pinned":false,"hidden":false,"mode":"ojs"},{"id":396,"value":"import { footer } from \"@endpointservices/footer-with-backups\"","pinned":false,"hidden":false,"mode":"ojs"},{"id":401,"value":"footer","pinned":false,"hidden":false,"mode":"ojs"}],"files":"$W31","stdlib":"1","titling":"auto"}