Skip to main content
Glama

/ Spikes

AI 辅助构建的反馈闭环

MIT License Widget Size Free + Pro

AI 可以在一个小时内构建出原型。 将反馈转化为行动仍然是最慢的部分。

快速开始 · CLI 参考 · 组件文档 · 托管仪表盘 · 自托管


这是什么?

Spikes 是一款面向 AI 辅助开发的反馈工具。它让审阅者可以直接在网页上留下针对性反馈——无需截图,不用“那边的按钮”,不会丢失上下文。

点击任意元素。评分。评论。Spikes 会捕获精确的 CSS 选择器、边界框和页面上下文。你的 AI 代理会得到可立即执行的结构化 JSON。

无需账户。无需构建步骤。适用于 file://、localhost、任何地方。


Related MCP server: Aceto

快速开始

1. 安装 CLI

curl -fsSL https://spikes.sh/install.sh | sh
# Or: cargo install spikes

2. 初始化项目

spikes init                     # Defaults to hosted spikes.sh
# spikes init --self-host       # Opt out — scaffold a self-hosted config instead

spikes init 会创建 .spikes/config.toml,其中包含一个 [remote] 配置段,默认指向 https://spikes.sh。传入 --self-host(或在提示时回答 s)可跳过托管默认值。

3. 将组件添加到你的 HTML

spikes inject ./mockups/        # Injects widget script tag (uses configured endpoint)
spikes serve                    # http://localhost:3847

4. 收集并使用反馈

spikes list                     # See all feedback
spikes list --json              # Feed to your agent
spikes list --rating no         # Find problems
spikes hotspots                 # Elements with most feedback
spikes resolve <id>             # Mark items done

CLI 命令

命令

描述

spikes init

创建包含配置的 .spikes/ 目录(默认托管;--self-host 可退出)

spikes list

列出反馈(--json--page--reviewer--rating--unresolved

spikes show <id>

显示单条 spike 详情

spikes export

导出为 JSON/CSV/JSONL/Cursor/Claude 上下文

spikes hotspots

获得最多反馈的元素

spikes reviewers

列出所有审阅者

spikes inject <dir>

在 HTML 文件中添加/移除组件(--endpoint <url> 覆盖已配置的端点)

spikes serve

本地开发服务器(--port--marked--cors-allow-origin

spikes mcp serve

启动 MCP 服务器,用于 AI 代理集成

spikes pull/push/sync

与远程端点同步

spikes share <dir>

上传到 spikes.sh 以即时共享

spikes login/logout/whoami

身份验证管理

spikes upgrade/billing

通过 Stripe 订阅 Pro 版

spikes deploy cloudflare

搭建自托管 Worker + D1

所有命令都支持 --json 以便脚本化使用。查看 完整 CLI 参考

查看托管项目的 spikes:

托管仪表盘位于 https://spikes.sh/dashboard,列出你拥有的每个项目,并可深入查看单条 spike(按页面、评分、已解决状态筛选,内联切换 resolved)。直接在浏览器中登录:点击 登录,打开验证页面,然后通过发送到你邮箱的魔法链接确认——无需 CLI。

你也可以使用你的 bearer token(来自 spikes login$SPIKES_TOKEN)直接调用 JSON API:

# GET /me/projects
# List all projects you own (with spike_count + last_activity)
curl -H "Authorization: Bearer $SPIKES_TOKEN" \
  https://spikes.sh/me/projects

# GET /me/projects/:key/spikes
# List spikes for one of your projects (paginated, filterable: page, per_page,
# filter_page, filter_rating, filter_resolved)
curl -H "Authorization: Bearer $SPIKES_TOKEN" \
  "https://spikes.sh/me/projects/my-project/spikes?page=1&per_page=50"

# PATCH /me/projects/:key/spikes/:id
# Toggle the `resolved` flag on one spike
curl -X PATCH -H "Authorization: Bearer $SPIKES_TOKEN" \
  -H "Content-Type: application/json" \
  -d '{"resolved": true}' \
  https://spikes.sh/me/projects/my-project/spikes/<spike_id>

# POST /projects
# Create a new project (user bearer only)
curl -X POST -H "Authorization: Bearer $SPIKES_TOKEN" \
  -H "Content-Type: application/json" \
  -d '{"key": "my-project", "allowed_origins": ["https://example.com"]}' \
  https://spikes.sh/projects

# Single-line variant (copy-paste friendly)
curl -H "Authorization: Bearer $SPIKES_TOKEN" https://spikes.sh/me/projects

所有 /me/* 端点均按用户隔离:你只能看到自己拥有的项目和 spikes。跨租户请求会返回 404 PROJECT_NOT_FOUND(防枚举)。

安全说明: API 密钥(sk_spikes_*)和管理员 SPIKES_TOKEN 适用于 /me/* 端点或 POST /projects——这些需要来自 spikes login 的用户 bearer token。POST /spikes 收集端点会强制执行每项目来源允许列表和每项目速率限制;被拒绝的组件请求会以组件按钮上的小红点 #spikes-error-dot 指示器显示(404 / 403 / 429)。


AI 代理集成

Spikes 原生支持代理。你的 AI 编程助手无需离开其工作流,即可读取、写入和管理反馈。

npx spikes-mcp            # Zero-install MCP server — just works
# or: spikes mcp serve    # If you have the CLI installed

MCP 服务器 — 9 个工具

spikes mcp serve 会启动一个 Model Context Protocol 服务器,暴露 9 个工具:

工具

用途

get_spikes

列出带筛选条件的反馈(页面、评分、未解决)

get_element_feedback

获取特定 CSS 选择器的反馈

get_hotspots

查找获得最多反馈的元素

submit_spike

以编程方式创建反馈

resolve_spike

将反馈标记为已处理

delete_spike

删除一条 spike

create_share

上传文件,获取可共享 URL

list_shares

查看你的有效共享

get_usage

查看使用统计、限制和花费

支持 stdioHTTP 传输方式,以及 本地远程 数据模式:

spikes mcp serve                              # stdio, local JSONL
spikes mcp serve --remote                     # stdio, hosted API
spikes mcp serve --transport http --port 3848 # HTTP for sandboxed agents

API 密钥

代理拥有自己的身份。无需电子邮件、无需魔法链接、无需人工步骤:

spikes auth create-key --name "my-agent"   # → sk_spikes_...
spikes auth list-keys                       # See all keys
spikes auth revoke-key <key_id>            # Revoke

密钥支持读取/写入/完全作用域,并可设置可选的预算上限。

代理级计费

面向代理规模使用量的按量计费。按 spike 付费,而非按席位付费:

spikes usage    # See current spend and limits

当达到上限时,预算强制执行会返回 429 BUDGET_EXCEEDED——代理可以在消耗之前进行检查。

上下文导出

导出为适合代理消费的结构化 Markdown:

spikes export --format cursor-context > cursor-feedback.md
spikes export --format claude-context > claude-feedback.md

发现

  • llms.txt — 全部 9 个 MCP 工具、参数、代理快速入门

  • agents.md — 面向代理的机器可读落地页

  • Smithery — 已列入 MCP 服务器注册表

  • spikes mcp install — 为 Claude Desktop / Cursor 生成配置

完整详情: llms.txt · agents.md


GitHub Action

使用反馈质量来把关 CI。当未解决的负面反馈超过你的阈值时,spikes-action 会让构建失败。

name: CI
on: [push, pull_request]

jobs:
  feedback-gate:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v4
      - uses: bierlingm/spikes/action@v0.3.1
        with:
          threshold: 0           # Fail if any blocking spikes
          ignore-paths: ""     # Optional: pages to ignore
          require-resolution: false

查看 action/README.md 获取完整文档。


组件属性

简单设置 — 只需添加你的项目密钥,即可开始收集反馈:

<script src="https://spikes.sh/spikes.js" data-project="my-app"></script>

当你设置 data-project 后,反馈会自动同步到 https://spikes.sh/spikes。除非你正在自托管,否则无需配置端点。

完整配置 — 所有可用属性:

<script src="https://spikes.sh/spikes.js"
  data-project="my-app"
  data-position="bottom-right"
  data-color="#e74c3c"
  data-theme="dark"
  data-reviewer="Pat"
  data-collect-email="true"
  data-admin="true">
</script>

自托管 — 指向你自己的后端:

<script src="/spikes.js"
  data-project="my-app"
  data-endpoint="https://my-worker.workers.dev/spikes">
</script>

属性

描述

默认

data-project

按项目密钥对反馈分组

location.hostname

data-position

按钮角位置:bottom-rightbottom-lefttop-righttop-left

bottom-right

data-color

强调色(任何 CSS 颜色)

#e74c3c

data-theme

弹窗主题:darklight

dark

data-reviewer

预设审阅者名称

(提示用户)

data-endpoint

用于多审阅者同步的后端 URL。可选——设置 data-project 后默认为 https://spikes.sh/spikes

https://spikes.sh/spikes(设置了 data-project 时)、/spikes(本地开发)

data-collect-email

在提示中显示电子邮件字段

false

data-admin

启用审阅模式功能

false

data-offset-x/y

按钮距边缘的偏移量

查看 组件属性参考 获取完整文档。


架构

Spikes 有三个可协同工作或独立使用的组件:

┌─────────────┐     ┌─────────────┐     ┌─────────────┐
│   CLI       │────▶│   Widget    │◄────│   Worker    │
│  (Rust)     │     │  (Vanilla   │     │ (Cloudflare │
│             │     │    JS)      │     │  + D1)      │
└─────────────┘     └─────────────┘     └─────────────┘
     │                                            │
     │          spikes.sh (hosted)                │
     └────────────────────────────────────────────┘

CLI — Rust 二进制文件,用于本地开发、spike 管理和部署。将 spikes 存储在 ~/.local/share/spikes/

组件 — 14KB gzip 压缩的原生 JS。捕获元素选择器、边界框、评分和评论。通过 localStorage 支持离线使用。

Worker — 可选的 Cloudflare Worker + D1 后端,用于多审阅者同步、共享和托管部署。位于 spikes-hosted/


开发

CLI

cd cli
cargo build --release
cargo test              # 160+ tests
cargo run -- --help

组件

cd widget
# Edit src/spikes.js
# Test by running: spikes serve from the project root

组件回归测试

CI 套件,用于捕获静默数据丢失类错误(例如,组件在非允许来源上加载时无法同步,但未显示错误):

cd tests/widget
npm install
npx playwright install chromium    # one-time
npm test                           # 23 tests: marker checks + happy/reverse/boundary specs (<60s)

也已接入本地 agent-ci:

npx agent-ci run --workflow workflows-local/widget.yml

Worker

Worker 后端位于私有 spikes-hosted 仓库中。要测试它:

cd ../spikes-hosted/worker
npm test              # Worker test suite (vitest)
npx wrangler dev

自托管

想要自己的后端?一条命令:

spikes deploy cloudflare    # Creates spikes-worker/ directory
cd spikes-worker && npx wrangler deploy

查看 自托管指南 了解包含 D1 数据库、身份验证和 Stripe 计费集成的完整设置。

Share 与 Deploy Cloudflare:如何选择?

当你希望无需任何设置即可即时共享时,请使用 spikes share——文件会上传到 spikes.sh 并从我们的基础设施提供。非常适合快速审阅、客户反馈,或者当你不想管理后端时。

当你需要数据隔离(反馈保留在你的 Cloudflare 账户中)、自定义域名,或希望完全控制基础设施时,请使用 spikes deploy cloudflare。自托管需要 Cloudflare 账户和一次性部署设置。


更新内容(近期全面重构)

  • 安全:PBKDF2 密码哈希、路径遍历修复、XSS 防护

  • 身份验证:魔法链接验证(无需记住密码)

  • 计费:集成 Stripe,支持 Pro 版

  • 测试:CLI 测试套件(Rust)+ Worker 测试套件(位于 ../spikes-hosted/worker)

  • 架构:模块化 worker,关注点清晰分离

  • CI/CD:自动化测试和部署流水线


详细文档


为什么选择 Spikes

零摩擦

一个脚本标签,无需注册,无需构建步骤

随处可用

file://localhost、任意域名

精准

基于精确 CSS 选择器的元素级反馈

Agent 原生

处处 JSON、管道、可查询的 CLI

你的基础设施

自托管或使用托管版——由你选择

小巧

Widget 仅 14KB(gzip 后)

隐私

无追踪,你的数据始终属于你


定价

永远免费。需要更多就升级 Pro。

无需注册即可开始。需要 Pro 功能时再登录。

免费

Pro

价格

永久 $0

随心支付

共享数

5

无限

每个共享的 Spikes 数

1,000

无限

Widget + CLI

完整

完整

自托管

支持

支持

密码保护

支持

Webhooks

支持

徽章移除

支持

MIT 许可。付费是赞赏,而非访问条件。

准备好后运行 spikes upgrade。没有压力。


网站 · 文档 · GitHub · 问题

MIT 许可证 · 为与 AI 协作的构建者打造。

A
license - permissive license
Not graded
quality - not tested
B
maintenance

Maintenance

Maintainers
8dResponse time
2wRelease cycle
5Releases (12mo)
Commit activity

Resources

Unclaimed servers have limited discoverability.

Looking for Admin?

If you are the server author, to access and configure the admin panel.

Related MCP Servers

  • A
    license
    Not graded
    quality
    D
    maintenance
    A local dev server with MCP interface for building HTML mockups together with an AI agent, enabling live collaborative editing through element selection and live preview.
    5
    MIT
  • A
    license
    Not graded
    quality
    A
    maintenance
    A self-hosted MCP server and gallery for AI-generated mockups, enabling AI tools to send mockups via MCP tool calls for storage and browsing in a clean web gallery.
    2
    MIT
  • F
    license
    Not graded
    quality
    C
    maintenance
    An MCP server that establishes feedback-oriented development workflows with a Web UI and desktop app, allowing users to provide interactive feedback to AI models through prompts, images, and session tracking.

View all related MCP servers

Related MCP Connectors

  • Hosted MCP for creating, checking, deploying, and hosting static sites for AI agents.

  • AI Reasoning Cache & Consensus Layer with 11 MCP tools via Streamable HTTP.

  • Hosted MCP endpoint with realistic fake data for prototyping agents. 12 tools, no setup.

View all MCP Connectors

Latest Blog Posts

MCP directory API

We provide all the information about MCP servers via our MCP API.

curl -X GET 'https://glama.ai/api/mcp/v1/servers/bierlingm/spikes'

If you have feedback or need assistance with the MCP directory API, please join our Discord server