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.py | FastAPI / Starlette 外掛 — 適用於 FastAPI 應用程式的即用型中介軟體 |
middleware/sncro_flask.py | Flask 外掛 — 適用於 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) │
└─────────────┘
- Claude 呼叫
create_session(MCP 工具)→ 中繼伺服器回傳一組 9 位數的 session 金鑰與網址 - 使用者在應用程式執行的瀏覽器中造訪該網址 → 透過「允許 sncro 除錯嗎?」進行確認
- 外掛會植入一個 cookie,後續來自該來源的 HTML 回應都會注入 agent.js
- agent.js 會推送基準資料(主控台、錯誤)並進行長輪詢以取得隨選查詢(
query_element、get_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 的儀表板(專案管理、帳單、管理功能)則存放在另一個專有儲存庫中。