mcpField
D
Dazzle - Agentic Streaming

Dazzle - Agentic Streaming

本地服务
dazzle.fm开发工具130 周前更新
代码仓库访问官网

关于 Dazzle - Agentic Streaming

Dazzle 是用于创建云端浏览器舞台的命令行工具和 MCP 服务，可渲染内容并用于直播。它面向 Agent 和直播工作流；沙盒客户端可用工作区文件工具，命令行则提供完整 Shell 访问。

主要功能

  1. 01创建和管理云端舞台
  2. 02同步内容并在变更时刷新
  3. 03截取舞台输出画面
  4. 04配置直播目的地
  5. 05编辑和管理舞台工作区文件
  6. 06向运行中的页面发送实时事件

适用场景

  1. 01为云端浏览器直播制作内容
  2. 02通过沙盒 MCP 客户端更新舞台
  3. 03用截图检查渲染结果
  4. 04将舞台连接到直播目的地

MCP 相关

stdio MCP 服务提供命令行操作、舞台工作区文件操作、同步、截图和使用指南，并提供两个文档资源。MCP 工作区工具不支持 Shell 执行。

#streaming#live-streaming#ai-agents#browser#twitch#kick#restream#broadcasting

配置

本地服务的配置在各客户端中通用，复制后粘贴到客户端的 MCP 配置文件即可。

mcp.json · 通用配置
{
  "mcpServers": {
    "cli-dazzle-labs": {
      "command": "npx",
      "args": [
        "-y",
        "@dazzle-labs/cli"
      ],
      "env": {
        "DAZZLE_STAGE": "<DAZZLE_STAGE>",
        "DAZZLE_API_KEY": "<DAZZLE_API_KEY>"
      }
    }
  }
}
启动命令npx -y @dazzle-labs/cli
需要配置的环境变量
DAZZLE_STAGEPin to a specific stage name or ID. If omitted, auto-selects when you have one stage.
DAZZLE_API_KEY密钥API key for headless/CI use. Alternative to interactive login.

本地服务需要在你的电脑上安装运行环境（如 Node.js 18+）。各客户端的配置文件位置不同，请参考客户端文档。

安装包
npm@dazzle-labs/cli0.7.1

工具

8

收录的工具列表 · 更新于 3 周前

参数类型必填说明
argsnull|array是必填，CLI 参数（例如 ["stage" "list"] 或 ["--help"]）。系统会自动添加 --json 标志。

详细介绍

dazzle

适用于 Dazzle 的官方 CLI 和 MCP 服务——为 AI Agent 和直播提供云端舞台。

一个二进制文件，两种接口：

  • CLI — 为编码 Agent（Claude Code、Cursor、终端）和自动化提供完整的 Shell 访问权限
  • MCP 服务（dazzle mcp）— 为沙盒客户端（Claude Desktop、VS Code，以及任何 MCP 宿主）提供 stdio 集成

Dazzle CLI 演示

安装

macOS / Linux
curl -sSL https://dazzle.fm/install.sh | sh
Windows（PowerShell）
irm https://dazzle.fm/install.ps1 | iex
其他选项
go install github.com/dazzle-labs/cli/cmd/dazzle@latest

macOS（arm64/amd64）、Linux（amd64/arm64）和 Windows（amd64/arm64）的预构建二进制文件可在发布页面获取。

快速开始（CLI）

dazzle login                              # authenticate (opens browser)
dazzle stage create my-stage              # create a stage
dazzle stage up                           # activate — starts streaming
dazzle stage sync ./my-app --watch        # push content, auto-refresh on changes
dazzle stage screenshot -o preview.png    # verify output
dazzle destination add                    # add Twitch/Kick/custom RTMP
dazzle destination attach my-destination  # go live

快速开始（MCP）

添加到 MCP 客户端配置中：

{
  "mcpServers": {
    "dazzle": {
      "command": "dazzle",
      "args": ["mcp"]
    }
  }
}

MCP 服务无需凭据即可启动——Agent 可以调用 guide 了解平台，并调用 cli ["login"] 进行身份验证。

MCP 工具

工具描述
cli运行 dazzle CLI 命令。使用 ["--help"] 发现可用命令。输出为 JSON。
edit_file通过精确字符串替换编辑舞台工作区中的文件。old_string 必须在文件中恰好匹配一次。先使用 read_file 查看当前内容。
guide获取完整的 Dazzle 参考资料——入门指南、CLI 命令、内容功能和直播设置。创建或修改舞台内容前请先阅读。
list_files列出舞台工作区（~/.dazzle/stages/{stage}/）中的所有文件。返回相对路径，每行一个。
read_file读取舞台工作区（~/.dazzle/stages/{stage}/{path}）中的文件。
screenshot截取舞台当前浏览器输出的屏幕截图。返回 PNG 图像。
sync将舞台工作区（~/.dazzle/stages/{stage}/）同步到线上舞台。写入文件后运行此命令以推送内容。等同于 'dazzle stage sync {workspace-dir}'。
write_file将文件写入舞台工作区（~/.dazzle/stages/{stage}/{path}）。按需创建父目录。使用此工具构建内容，然后同步到舞台。
工作区工具

工作区工具（write_file、read_file、edit_file、list_files、sync）会将文件存储在主机文件系统的 ~/.dazzle/stages/{stage-id}/ 中。这可以连接沙盒环境（例如 Claude Desktop）：在这些环境中，Agent 的 bash 在隔离容器内运行，无法与 CLI 进程共享文件。

工作流： write_file → edit_file（迭代）→ sync → screenshot（验证）

限制： 不支持 Shell/exec——无法在工作区中运行构建工具（npm、tailwind 等）。内容必须是预先构建好的 HTML/CSS/JS。拥有完整文件系统和 Shell 访问权限的 Agent（例如 Claude Code）应直接使用 dazzle stage sync，以获得完整体验。

MCP 资源
URI描述
https://dazzle.fm/llms-full.txt完整的 Dazzle 参考资料——入门指南、CLI 帮助和内容编写指南。
https://dazzle.fm/llms.txtDazzle 快速入门指南——平台概览、设置、CLI 基础知识和文档链接。

CLI 和 MCP——该选哪个？

CLIMCP
适用场景编码 Agent、终端、CI/CDClaude Desktop、VS Code、沙盒客户端
文件系统完整访问权限——可在任意位置写入、运行构建工具仅限工作区（~/.dazzle/stages/{id}/）
Shell支持——npm、tailwind 和任何工具链不支持——仅限预构建内容
内容同步dazzle stage sync ./dirwrite_file + sync
屏幕截图dazzle stage screenshot -o file.pngscreenshot 工具（返回 JPEG）
身份验证dazzle login 或 DAZZLE_API_KEY通过 MCP 调用 cli ["login"]

CLI 参考

Usage: dazzle <command> [flags]

Dazzle — cloud stages for streaming.

A stage is a cloud browser environment that renders and streams your content.
Sync a local directory (must contain an index.html) and everything visible in
the browser window is what gets streamed to viewers.

Your content runs in a real browser with full access to standard web APIs (DOM,
Canvas, WebGL, Web Audio, fetch, etc.). localStorage is persisted across stage
restarts — use it to store app state that should survive between sessions.

Workflow:
 1. dazzle login # authenticate (one-time)
 2. dazzle s new my-stage # create a stage
 3. dazzle s up # bring it up — starts streaming to Dazzle
 4. dazzle s sync ./my-app -w # sync + auto-refresh on changes
 5. dazzle s ss -o preview.png # take a screenshot to verify
 6. dazzle s down # stop streaming and shut down

Auth: dazzle login, or set DAZZLE_API_KEY for headless/CI use. Stage selection:
use -s <name>, DAZZLE_STAGE env, or auto-selected if only one.

https://dazzle.fm

Flags:
  -h, --help              Show context-sensitive help.
  -j, --json              Output as JSON.
  -s, --stage=STRING      Stage name or ID ($DAZZLE_STAGE).
      --api-url=STRING    API URL ($DAZZLE_API_URL).

Commands:
  version                          Print version information.
  update                           Update dazzle to the latest release.
  guide                            Show content authoring guide (rendering tips,
                                   performance, best practices).
  login                            Authenticate with Dazzle (opens browser).
  logout                           Clear stored credentials.
  whoami                           Show current user.
  stage (s) list (ls)              List stages.
  stage (s) create (new)           Create a stage.
  stage (s) delete (rm)            Delete a stage.
  stage (s) up                     Activate a stage.
  stage (s) down                   Deactivate a stage.
  stage (s) status (st)            Show stage status.
  stage (s) stats                  Show live pipeline stats.
  stage (s) preview                Show the shareable preview URL for a running
                                   stage.
  stage (s) sync (sy)              Sync a local directory to the stage. This is
                                   the primary way to push content — use --watch
                                   for live development.
  stage (s) refresh (r)            Reload the stage entry point.
  stage (s) event (ev) emit (e)    Push a named event with JSON data to
                                   the running page — dispatched as a DOM
                                   CustomEvent. Use this to send real-time data
                                   from external processes (other agents, APIs,
                                   etc.) without re-syncing or reloading.
  stage (s) logs (l)               Retrieve stage console logs.
  stage (s) screenshot (ss)        Capture a screenshot of the stage.
  stage (s) info                   Get current stream title and category.
  stage (s) title                  Set the stream title (not supported for
                                   Restream).
  stage (s) category               Set the stream category or game (not
                                   supported for Restream).
  stage (s) chat send              Send a message to live chat (not supported
                                   for Restream).
  destination (dest) list (ls)     List broadcast destinations.
  destination (dest) add (create,new)
                                   Add a broadcast destination.
  destination (dest) delete (rm)
                                   Remove a broadcast destination.
  destination (dest) attach (set)
                                   Attach a destination to a stage.
  destination (dest) detach (unset)
                                   Detach a destination from a stage.

Run "dazzle <command> --help" for more information on a command.
舞台子命令 
Usage: dazzle stage (s) <command> [flags]

Manage stages — create, sync content, screenshot, stream.

Flags:
  -h, --help              Show context-sensitive help.
  -j, --json              Output as JSON.
  -s, --stage=STRING      Stage name or ID ($DAZZLE_STAGE).
      --api-url=STRING    API URL ($DAZZLE_API_URL).

Commands:
  stage (s) list (ls)              List stages.
  stage (s) create (new)           Create a stage.
  stage (s) delete (rm)            Delete a stage.
  stage (s) up                     Activate a stage.
  stage (s) down                   Deactivate a stage.
  stage (s) status (st)            Show stage status.
  stage (s) stats                  Show live pipeline stats.
  stage (s) preview                Show the shareable preview URL for a running
                                   stage.
  stage (s) sync (sy)              Sync a local directory to the stage. This is
                                   the primary way to push content — use --watch
                                   for live development.
  stage (s) refresh (r)            Reload the stage entry point.
  stage (s) event (ev) emit (e)    Push a named event with JSON data to
                                   the running page — dispatched as a DOM
                                   CustomEvent. Use this to send real-time data
                                   from external processes (other agents, APIs,
                                   etc.) without re-syncing or reloading.
  stage (s) logs (l)               Retrieve stage console logs.
  stage (s) screenshot (ss)        Capture a screenshot of the stage.
  stage (s) info                   Get current stream title and category.
  stage (s) title                  Set the stream title (not supported for
                                   Restream).
  stage (s) category               Set the stream category or game (not
                                   supported for Restream).
  stage (s) chat send              Send a message to live chat (not supported
                                   for Restream).
stage sync 标志
Usage: dazzle stage (s) sync (sy) <dir> [flags]

Sync a local directory to the stage. This is the primary way to push content —
use --watch for live development.

Arguments:
  <dir>    Local directory to sync (must contain an index.html entry point).

Flags:
  -h, --help                  Show context-sensitive help.
  -j, --json                  Output as JSON.
  -s, --stage=STRING          Stage name or ID ($DAZZLE_STAGE).
      --api-url=STRING        API URL ($DAZZLE_API_URL).

  -w, --watch                 Watch for file changes and automatically re-sync.
      --entry="index.html"    HTML entry point file (default: index.html).
stage screenshot 标志
Usage: dazzle stage (s) screenshot (ss) [flags]

Capture a screenshot of the stage.

Flags:
  -h, --help              Show context-sensitive help.
  -j, --json              Output as JSON.
  -s, --stage=STRING      Stage name or ID ($DAZZLE_STAGE).
      --api-url=STRING    API URL ($DAZZLE_API_URL).

  -o, --out=STRING        Output file path (default: temp file).
#### `stage event` 子命令 
Usage: dazzle stage (s) event (ev) <command>

Send real-time data to the running page without reloading. Events are dispatched
as DOM CustomEvents — use this for async updates from subagents, APIs, or other
processes.

Flags:
  -h, --help              Show context-sensitive help.
  -j, --json              Output as JSON.
  -s, --stage=STRING      Stage name or ID ($DAZZLE_STAGE).
      --api-url=STRING    API URL ($DAZZLE_API_URL).

Commands:
  stage (s) event (ev) emit (e)    Push a named event with JSON data to
                                   the running page — dispatched as a DOM
                                   CustomEvent. Use this to send real-time data
                                   from external processes (other agents, APIs,
                                   etc.) without re-syncing or reloading.
目标子命令 
Usage: dazzle destination (dest) <command> [flags]

Manage broadcast destinations (Twitch, YouTube, etc).

Flags:
  -h, --help              Show context-sensitive help.
  -j, --json              Output as JSON.
  -s, --stage=STRING      Stage name or ID ($DAZZLE_STAGE).
      --api-url=STRING    API URL ($DAZZLE_API_URL).

Commands:
  destination (dest) list (ls)    List broadcast destinations.
  destination (dest) add (create,new)
                                  Add a broadcast destination.
  destination (dest) delete (rm)
                                  Remove a broadcast destination.
  destination (dest) attach (set)
                                  Attach a destination to a stage.
  destination (dest) detach (unset)
                                  Detach a destination from a stage.

阶段解析

对于限定阶段的命令，按以下顺序解析阶段：

  1. -s / --stage 标志或 DAZZLE_STAGE 环境变量
  2. 仅当只有一个阶段时才自动选择
dazzle stage sync ./app --stage my-stage   # explicit
export DAZZLE_STAGE=my-stage               # or set for your session

配置

环境变量（优先于配置文件和已存储的凭据）：

变量用途默认值
DAZZLE_API_KEYAPI 密钥 — 在 CI、脚本和一次性命令中跳过 dazzle login已存储的凭据
DAZZLE_API_URLAPI 基础 URLhttps://dazzle.fm
DAZZLE_STAGE阶段名称或 ID仅有一个阶段时自动选择

配置文件（~/.config/dazzle/，权限为 0600）：

config.json        # { "api_url": "..." }
credentials.json   # { "api_key": "dzl_...", "email": "..." }

安全性

  • API 密钥存储在 ~/.config/dazzle/credentials.json 中，权限为 0600
  • 仅通过 HTTPS 以 Bearer 令牌形式传输
  • 绝不记录、回显或发送给第三方
  • 不进行遥测 — 不收集使用数据、崩溃报告或分析数据
  • 所有源代码均为开源且可审查

许可证

Apache 2.0 — 参见 LICENSE

评论

支持 Markdown

第一次接触 MCP？

从协议是什么，到在客户端里装上第一个服务，这几条回答覆盖了大多数入门问题。

一个开放协议，规定了 AI 应用如何以统一方式连接外部工具与数据源。客户端负责与模型对话，MCP 服务负责提供工具、资源和提示模板，两者通过标准消息通信，同一个服务可以被不同客户端复用。