sncro.net MCP Server

官方

為AI助手提供即時瀏覽器除錯功能 — 透過MCP操作DOM、主控台與網路。

文件

sncro-relay

sncro 的開源元件 — 包含 MCP 中繼伺服器、瀏覽器端代理程式,以及讓 AI 程式輔助工具能檢查即時瀏覽器的框架外掛。

此儲存庫包含的內容

路徑說明
relay/FastAPI 應用程式,提供 MCP 伺服器以及供 agent.js 使用的長輪詢端點
relay/static/agent.js由中介軟體注入的瀏覽器端腳本;將主控台與 DOM 資料推送至中繼伺服器
middleware/sncro_middleware.pyFastAPI / Starlette 外掛 — 適用於 FastAPI 應用程式的即用型中介軟體
middleware/sncro_flask.pyFlask 外掛 — 適用於 Flask 應用程式的即用型中介軟體
trysncro/try.sncro.net — 一個刻意設計為有問題的示範應用程式,用於端對端測試 sncro

運作方式

 ┌──────────────┐    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) │
                                                       └─────────────┘
  1. Claude 呼叫 create_session(MCP 工具)→ 中繼伺服器回傳一組 9 位數的 session 金鑰與網址
  2. 使用者在應用程式執行的瀏覽器中造訪該網址 → 透過「允許 sncro 除錯嗎?」進行確認
  3. 外掛會植入一個 cookie,後續來自該來源的 HTML 回應都會注入 agent.js
  4. agent.js 會推送基準資料(主控台、錯誤)並進行長輪詢以取得隨選查詢(query_elementget_page_snapshot 等)

使用 sncro

大多數使用者不需要自行執行中繼伺服器 — relay.sncro.net 的託管版本對免費方案相當友善。請在 sncro.net 註冊您的專案並取得專案金鑰。

FastAPI:middleware/sncro_middleware.py 放入您的專案中,然後:

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:middleware/sncro_flask.py 放入您的專案中,然後:

from sncro_flask import init_sncro

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

兩種中介軟體都僅在除錯模式下啟用 — 在正式環境中完全不會有額外負擔。

貢獻

我們非常歡迎新的框架外掛。CONTRIBUTING.md 包含了外掛必須實作的完整規格 — cookies、路由、安全標頭 — 以及測試範本。Django、Rails、Express、Next.js、ASP.NET、Go — 全都歡迎。

錯誤回報與安全性問題:請參閱 SECURITY.md

授權

MIT。請參閱 LICENSE

位於 sncro.net 的儀表板(專案管理、帳單、管理功能)則存放在另一個專有儲存庫中。