AI导哈

TODO应用服务器

一个基于Cloudflare Workers的TODO应用服务器，集成了静态网站、REST API和Model Context Protocol服务器，使用Stytch进行用户和客户端身份管理。

  • by jiancui-research
  • TypeScript
  • 本地部署
  • 更新于
在 GitHub 查看 jiancui-research/mcp-stytch-consumer-todo-list

使用说明

Workers + Stytch TODO 应用 MCP 服务器

这是一个由三个功能组成的Workers服务器：

用户和客户端身份通过使用（某种方法或系统）进行管理 Stytch综上所述，这三个特性展示了如何将传统的全栈应用程序扩展以供AI代理使用。

这个演示使用了 Stytch Consumer（可译为“Stytch消费者服务”或根据具体语境简化为“Stytch用户服务”） 这款产品是专为满足消费者SaaS（软件即服务）认证需求而设计的。 如果你对Stytch更感兴趣的话 B2B（Business-to-Business，即企业对企业） 产品，请参见 这个演示 相反。

设置

按照以下步骤操作，使用您自己的Stytch凭据使此应用程序完全功能化并运行起来。

在Stytch仪表板中

  1. 创建一个 Stytch 账户 在注册流程中选择 消费者身份验证 作为您感兴趣的认证类型。一旦您的账户设置完成，将会为您自动创建一个名为“我的第一个项目”的项目。

  2. 导航至 前端SDK（软件开发工具包） 在测试环境中启用前端SDK

  3. 导航至 连接的应用程序 以启用动态客户端注册，并将您的授权URL配置为 http://localhost:3000/oauth/authorize。

  4. 导航至 项目设置 查看您的项目域、项目ID和API密钥。稍后您将需要这些值。

在你的机器上

在你的终端中克隆项目并安装依赖项：

git clone https://github.com/cloudflare/ai.git
cd ai
npm i
cd demos/mcp-stytch-consumer-todo-list

接下来，创建一个 .env.local 通过运行以下命令来复制文件内容，该命令如下： .env.template。

cp .env.template .env.local

开放 .env.local 在你选择的文本编辑器中，使用（相应的工具或方法）设置环境变量 public_token 和 project domain 发现于 项目设置。

# This is what a completed .env.local file will look like
VITE_STYTCH_PUBLIC_TOKEN=public-token-test-abc123-abcde-1234-0987-0000-abcd1234
VITE_STYTCH_DOMAIN=random-domain-name.customers.stytch.dev

创建一个 .dev.vars 通过运行以下命令来复制文件内容，该命令如下： .dev.vars.template

cp .dev.vars.template .dev.vars

开放 .dev.vars 在你选择的文本编辑器中，使用以下方法设置环境变量： Project ID 并且 Secret 发现于 项目设置。

// This is what a completed .dev.vars file will look like
STYTCH_PROJECT_ID=project-test-6c20cd16-73d5-44f7-852c-9a7e7b2ccf62

本地运行

完成上述所有设置步骤后，可以使用以下命令运行应用程序：

npm run dev

该应用程序将在 http://localhost:3000 并且MCP服务器将在 http://localhost:3000/sse。

使用（以下方法）测试您的MCP服务器 MCP 检测器

npx @modelcontextprotocol/inspector@latest

部署到 Cloudflare Workers

点击按钮 - 初始部署后，您需要配置环境变量。

或者，如果你想手动执行这些步骤：

  1. 为TODO应用创建一个KV命名空间以供使用
wrangler kv namespace create TODOS
  1. 更新KV命名空间ID wrangler.jsonc 使用您收到的ID：
"kv_namespaces": [
   {
      "binding": "TODOS",
      "id": "your-kv-namespace-id"
   }
]
  1. 上传您的Stytch环境变量以供工作节点使用
npx wrangler secret bulk .dev.vars
  1. 部署工作节点
npm run deploy
  1. 授予您的部署权限访问您的Stytch项目。假设您的Stytch项目已部署在 https://mcp-stytch-consumer-todo-list.$YOUR_ACCOUNT_NAME.workers.dev:
    1. 添加 https://mcp-stytch-consumer-todo-list.$YOUR_ACCOUNT_NAME.workers.dev/authenticate 作为被允许的 重定向URL
    2. 添加 https://mcp-stytch-consumer-todo-list.$YOUR_ACCOUNT_NAME.workers.dev 作为被允许的授权应用程序 前端SDK（软件开发工具包） 配置

寻求帮助并加入社区

:speech_balloon: Stytch 社区 Slack（或：Stytch 社群 Slack）

加入讨论，提出问题，并在我们的平台建议新功能 Slack社区！

相关 MCP