AI导哈

图像生成工具

一个基于MCP框架的图像生成工具，使用Templated.io API根据模板生成图像。

  • by Lucker631
  • TypeScript
  • 本地部署
  • 更新于
在 GitHub 查看 lucker631/mcp-templateio

使用说明

MCP TemplateIO-图像生成工具

使用MCP框架构建的模型上下文协议（MCP）服务器，该框架使用Templated.io提供图像生成工具。

概述

此模板为使用自定义工具构建MCP服务器提供了一个起点。它包括一个示例工具以及如何添加更多工具、开发它们并将其发布到npm的说明。本自述文件将指导您完成设置、开发和部署自己的MCP服务器的过程。

快速开始

# Install dependencies
npm install

# Build the project
npm run build

项目结构

mcp-templateio/
├── src/
│   ├── tools/        # MCP Tools
│   │   ├── ExampleTool.ts
│   │   └── TemplatedImageTool.ts # Image generation tool
│   └── index.ts      # Server entry point
├── package.json
└── tsconfig.json

可用工具

模板化图像生成器

该工具使用Templated.io API，在给定文本和图像URL的情况下，基于模板生成图像。

输入参数：

  • templateId：要使用的Templated.io模板的ID
  • photoBgImageUrl：要放置在“照片bg”层中的图像的URL。
  • bgYellowImageUrl：要放置在“bg yellow”层中的图像的URL。
  • buildText：“构建”文本层的文本内容。

工具开发

工具结构示例：

import { MCPTool } from "mcp-framework";
import { z } from "zod";

interface MyToolInput {
  message: string;
}

class MyTool extends MCPTool<MyToolInput> {
  name = "my_tool";
  description = "Describes what your tool does";

  schema = {
    message: {
      type: z.string(),
      description: "Description of this input parameter",
    },
  };

  async execute(input: MyToolInput) {
    // Your tool logic here
    return `Processed: ${input.message}`;
  }
}

export default MyTool;

添加组件

该项目附带了一个示例工具 src/tools/ExampleTool.ts 和那个 TemplatedImageTool.ts。您可以使用CLI添加更多工具：

# Add a new tool
mcp add tool my-tool

# Example tools you might create:
mcp add tool data-processor
mcp add tool api-client
mcp add tool file-handler

发布到npm

  1. 更新你的package.json：

    • 确保 name 是唯一的，遵循npm命名约定
    • 设置适当 version
    • 添加 description, author, license等等。
    • 检查 bin 指向正确的条目文件

  2. 在本地构建和测试：

    npm run build
npm link
mcp-templateio  # Test your CLI locally

  3. 登录npm（必要时创建帐户）：

    npm login

  4. 发布您的包：

    npm publish

发布后，用户可以将其添加到他们的claude桌面客户端（见下文）或使用npx运行它

与Claude Desktop一起使用

地方发展

将此配置添加到您的Claude Desktop配置文件中：

MacOS: ~/Library/Application Support/Claude/claude_desktop_config.json 视窗: %APPDATA%/Claude/claude_desktop_config.json

{
  "mcpServers": {
    "mcp-templateio": {
      "command": "node",
      "args": ["/absolute/path/to/mcp-templateio/dist/index.js"]
    }
  }
}

发布后

在此处获取您的API密钥：https://app.templated.io/api-integration?template=4ae9a86b-4ecd-44ee-aebd-7c5a49c16969

将此配置添加到您的Claude Desktop配置文件中：

MacOS: ~/Library/Application Support/Claude/claude_desktop_config.json 视窗: %APPDATA%/Claude/claude_desktop_config.json

{
  "mcpServers": {
    "mcp-templateio": {
      "command": "node",
      "args": [
        "C:\\Users\\alex0\\Documents\\AA_CodeAndScripts\\modelcontextprotocol\\mcp-templateio\\dist\\index.js"
      ],
      "env": {"TEMPLATED_API_KEY":"YOUR-API-KEY-HERE"}
    },
  }
}

建造和测试

  1. 对工具进行更改
  2. 跑 npm run build 编写
  3. 服务器将在启动时自动加载您的工具

了解更多

相关 MCP