Skip to content

Add browser tunnel demo page#7

Closed
mmkal wants to merge 3 commits into
mainfrom
mmkal/26/05/19/browser-demo-page
Closed

Add browser tunnel demo page#7
mmkal wants to merge 3 commits into
mainfrom
mmkal/26/05/19/browser-demo-page

Conversation

@mmkal
Copy link
Copy Markdown
Contributor

@mmkal mmkal commented May 19, 2026

Summary

Adds a static browser demo page for Captun:

  • docs/browser-demo.html is a no-build, GitHub-Pages-friendly tool surface.
  • Users enter a Captun server URL and tunnel name, edit an in-page fetch handler, connect from the browser session, and see the public tunnel URL.
  • The page includes a built-in probe client plus connection/request/response/error logs.
  • The browser client is intentionally tiny and imports pinned capnweb@0.8.0 from esm.sh because the package does not currently publish a browser demo bundle.

Browser WebSocket APIs cannot send bearer headers, so the README now documents deploying a throwaway no-secret Worker with Wrangler for this demo. The page and docs also warn that editable handler source runs as first-party JavaScript and is saved locally.

Verification

  • node --check docs/browser-demo.js && node --check docs/browser-demo-client.js
  • pnpm run check
  • pnpm test
  • Served docs/ locally and tested against a local Captun Worker on http://localhost:8788
  • Browser smoke test connected, exposed the public URL, sent /health, and got 200 OK JSON from the editable browser fetch handler
  • Desktop and mobile browser layout checks after review fixes

Note

Low Risk
Low risk since changes are confined to docs/static assets; main risk is user confusion/security from running arbitrary handler code in-page (mitigated by explicit warning and no-secret requirement).

Overview
Adds a static browser-based tunnel demo under docs/browser-demo.html (plus JS/CSS) that can connect to a Captun Worker, expose the public tunnel URL, run an editable in-page fetch handler for incoming requests, and show request/response/error logs (with a built-in probe sender).

Updates README.md with instructions to serve the demo locally, calls out the browser WebSocket Authorization header limitation (so it requires a Worker without CAPTUN_SECRET), and includes a warning that the handler source executes as first-party JS and is stored in localStorage.

Reviewed by Cursor Bugbot for commit 0fa0fe0. Bugbot is set up for automated code reviews on this repo. Configure here.

@pkg-pr-new
Copy link
Copy Markdown

pkg-pr-new Bot commented May 19, 2026

Open in StackBlitz

npm i https://pkg.pr.new/iterate/captun@7

commit: 0fa0fe0

Copy link
Copy Markdown

@cursor cursor Bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Cursor Bugbot has reviewed your changes and found 1 potential issue.

Fix All in Cursor

❌ Bugbot Autofix is OFF. To automatically fix reported issues with cloud agents, enable autofix in the Cursor dashboard.

Reviewed by Cursor Bugbot for commit 9cb9180. Configure here.

close() {
disposeSession(session);
},
};
Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Dropped socket still shows connected

Medium Severity

After the tunnel opens successfully, neither the browser client nor the demo listens for WebSocket close or RPC breakage. If the Worker or network drops the session, the UI can stay on Connected with a stale public URL while inbound requests stop working.

Additional Locations (1)
Fix in Cursor Fix in Web

Reviewed by Cursor Bugbot for commit 9cb9180. Configure here.

@mmkal
Copy link
Copy Markdown
Contributor Author

mmkal commented May 20, 2026

worth waiting for #3 and also adding an alt auth mechanism that works with browser WebSocket

@mmkal mmkal closed this May 20, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant