DEV Community

VANSH ARORA
VANSH ARORA

Posted on

How We Built an Authenticated Local Loopback Bridge for Browser AI Chats

If you use web interfaces like ChatGPT, Claude.ai, or Gemini for complex engineering tasks, keeping the model informed of your repository state is cumbersome. You either upload messy zip files or copy-paste dozens of files manually.

To solve this securely, we built the TokenCap Local Loopback Bridge (tokencap serve) and paired Chrome Companion extension.

The Bridge Security Architecture

Browser extensions cannot access local disk storage. To pass structured repository context without compromising security, we defined Bridge Contract v1:

  1. Binding: The HTTP daemon binds strictly to loopback 127.0.0.1:4545. No public interfaces are exposed.
  2. Pairing Token: When starting tokencap serve, an ephemeral cryptographic token is generated.
  3. Origin Allowlists: Pre-flight CORS checks block arbitrary web pages. Only approved local companion origins can query the bridge.
  4. Pre-Warm Cache: While pairing occurs, the daemon builds graph, memory, and diff snapshots in background memory so first-click generation is instant.

CLI and Extension Workflow

Start the bridge in your project directory:

tokencap serve --daemon
Enter fullscreen mode Exit fullscreen mode

Output:

TokenCap bridge on http://127.0.0.1:4545
Pair the companion: http://127.0.0.1:4545/?pair=7f9a12c8b04e
Bridge context pre-warmed in 340ms.
Serving intelligence for: /Users/dev/projects/my-api
Enter fullscreen mode Exit fullscreen mode

Open ChatGPT or Claude in Chrome, open the TokenCap Companion popup, type your task (for example: "refactor billing controller"), and click "Inject Into Chat".

The companion fetches the model-budgeted context pack directly from your local bridge and populates the prompt input.

Read the bridge contract and setup guide at tokencap.vansharora.app

Top comments (0)