sncro.net MCP Server

offiziell

Live-Browser-Debugging für KI-Assistenten — DOM, Konsole, Netzwerk via MCP.

Dokumentation

sncro-relay

Open-Source-Komponenten von sncro — das MCP-Relay, der browser-seitige Agent und die Framework-Plugins, die KI-Coding-Assistenten die Untersuchung eines Live-Browsers ermöglichen.

Was dieses Repo enthält

Pfad	Inhalt
`relay/`	FastAPI-App, die einen MCP-Server sowie Long-Poll-Endpunkte für agent.js bereitstellt
`relay/static/agent.js`	Browser-seitiges Skript, das von der Middleware injiziert wird; überträgt Konsolen- und DOM-Daten an das Relay
`middleware/sncro_middleware.py`	FastAPI-/Starlette-Plugin — Drop-in-Middleware für FastAPI-Apps
`middleware/sncro_flask.py`	Flask-Plugin — Drop-in-Middleware für Flask-Apps
`trysncro/`	`try.sncro.net` — eine absichtlich fehlerhafte Demo-App zum Testen von sncro von Ende zu Ende

Funktionsweise

 ┌──────────────┐    MCP     ┌──────────┐   long-poll   ┌─────────────┐
 │ Claude Code  │──tools────▶│  relay   │◀──────────────│  agent.js   │
 │ (or other    │            │ (relay/) │   snapshots   │ (injected   │
 │  MCP client) │◀──results──│          │──────────────▶│  by plugin) │
 └──────────────┘            └──────────┘               └─────────────┘
                                                              ▲
                                                              │ same-origin
                                                              │ cookies
                                                       ┌─────────────┐
                                                       │  your app   │
                                                       │ (plugin is  │
                                                       │  installed) │
                                                       └─────────────┘

Claude ruft create_session (MCP-Tool) auf → Relay gibt einen 9-stelligen Sitzungsschlüssel + URL zurück
Benutzer besucht die URL im Browser, in dem seine App läuft → bestätigt mit „Allow sncro debugging?“
Das Plugin setzt ein Cookie, agent.js wird in nachfolgende HTML-Antworten auf diesem Origin injiziert
agent.js überträgt Basisdaten (Konsole, Fehler) und führt Long-Polling für On-Demand-Abfragen durch (query_element, get_page_snapshot usw.)

sncro verwenden

Die meisten Benutzer müssen das Relay nicht selbst betreiben — die gehostete Version unter relay.sncro.net ist Free-Tier-freundlich. Registrieren Sie Ihr Projekt auf sncro.net und holen Sie sich Ihren Projektschlüssel.

FastAPI: Fügen Sie middleware/sncro_middleware.py in Ihr Projekt ein, dann:

from middleware.sncro_middleware import SncroMiddleware, sncro_routes

app = FastAPI(debug=True)  # sncro only loads when debug=True
if app.debug:
    app.include_router(sncro_routes)
    app.add_middleware(SncroMiddleware, relay_url="https://relay.sncro.net")

Flask: Fügen Sie middleware/sncro_flask.py in Ihr Projekt ein, dann:

from sncro_flask import init_sncro

app = Flask(__name__)
if app.debug:
    init_sncro(app, relay_url="https://relay.sncro.net")

Beide Middlewares werden nur im Debug-Modus aktiviert — kein Overhead in der Produktion.

Mitwirken

Wir freuen uns über neue Framework-Plugins. CONTRIBUTING.md enthält die vollständige Spezifikation, was ein Plugin leisten muss — Cookies, Routen, Sicherheitsheader — sowie die Testvorlage. Django, Rails, Express, Next.js, ASP.NET, Go — alle willkommen.

Fehlerberichte und Sicherheitsprobleme: siehe SECURITY.md.

Lizenz

MIT. Siehe LICENSE.

Das Dashboard auf sncro.net (Projektverwaltung, Abrechnung, Administration) befindet sich in einem separaten proprietären Repo.