img-src-io

img-src MCP 服务

面向 img-src.io 图片托管 API 的模型上下文协议（MCP）服务。

此服务可让 Claude 等 AI 助手通过自然语言与你的 img-src.io 账户交互，直接上传、搜索、列出和管理图片。

安装

pnpm add -g @img-src/mcp-server

也可以通过 pnpm dlx 直接运行：

pnpm dlx @img-src/mcp-server

配置

环境变量

变量	必填	说明
IMG_SRC_API_KEY	是	你的 img-src.io API 密钥（以 imgsrc_ 开头）
IMG_SRC_API_URL	否	API 基础 URL（默认值：https://api.img-src.io）

获取 API 密钥

1. 登录 img-src.io
2. 前往 Settings > API Keys
3. 创建新的 API 密钥
4. 复制密钥（以 imgsrc_ 开头）

在 Claude Desktop 中使用

将以下内容添加到 Claude Desktop 配置文件（macOS 上为 ~/Library/Application Support/Claude/claude_desktop_config.json）：

{
  "mcpServers": {
    "img-src": {
      "command": "npx",
      "args": ["@img-src/mcp-server"],
      "env": {
        "IMG_SRC_API_KEY": "imgsrc_your_api_key_here"
      }
    }
  }
}

在 Claude Code 中使用

将以下内容添加到项目的 .mcp.json（项目级）或 ~/.claude/mcp.json（全局）：

{
  "mcpServers": {
    "img-src": {
      "command": "npx",
      "args": ["@img-src/mcp-server"],
      "env": {
        "IMG_SRC_API_KEY": "imgsrc_your_api_key_here"
      }
    }
  }
}

也可以通过 CLI 添加：

claude mcp add img-src -- npx @img-src/mcp-server

然后在环境或 .env 文件中设置 API 密钥：

export IMG_SRC_API_KEY=imgsrc_your_api_key_here

在 Cursor 中使用

1. 打开 Cursor 设置（macOS 上按 Cmd+, / Windows/Linux 上按 Ctrl+,）

2. 前往 Features > MCP Servers

3. 点击 "Add new MCP server"

4. 输入以下配置：

   • Name：img-src
   • Type：command
   • Command：npx @img-src/mcp-server

5. 添加环境变量 IMG_SRC_API_KEY，并填入你的 API 密钥。

也可以在项目根目录中创建或编辑 .cursor/mcp.json：

{
  "mcpServers": {
    "img-src": {
      "command": "npx",
      "args": ["@img-src/mcp-server"],
      "env": {
        "IMG_SRC_API_KEY": "imgsrc_your_api_key_here"
      }
    }
  }
}

在 VS Code（GitHub Copilot）中使用

在工作区中创建 .vscode/mcp.json：

{
  "servers": {
    "img-src": {
      "type": "stdio",
      "command": "npx",
      "args": ["@img-src/mcp-server"],
      "env": {
        "IMG_SRC_API_KEY": "imgsrc_your_api_key_here"
      }
    }
  }
}

也可以通过 CLI 添加：

code --add-mcp '{"name":"img-src","command":"npx","args":["@img-src/mcp-server"],"env":{"IMG_SRC_API_KEY":"imgsrc_your_api_key_here"}}'

注意： VS Code 使用 "servers"（而非 "mcpServers"），并要求 "type": "stdio"。

在 Windsurf 中使用

将以下内容添加到 ~/.codeium/windsurf/mcp_config.json：

{
  "mcpServers": {
    "img-src": {
      "command": "npx",
      "args": ["@img-src/mcp-server"],
      "env": {
        "IMG_SRC_API_KEY": "imgsrc_your_api_key_here"
      }
    }
  }
}

在 Cline 中使用

在 VS Code 中打开 Cline 扩展，点击 MCP Servers 图标 > Configure MCP Servers，然后添加：

{
  "mcpServers": {
    "img-src": {
      "command": "npx",
      "args": ["@img-src/mcp-server"],
      "env": {
        "IMG_SRC_API_KEY": "imgsrc_your_api_key_here"
      }
    }
  }
}

在 Zed 中使用

将以下内容添加到 Zed 设置（~/.config/zed/settings.json）：

{
  "context_servers": {
    "img-src": {
      "command": "npx",
      "args": ["@img-src/mcp-server"],
      "env": {
        "IMG_SRC_API_KEY": "imgsrc_your_api_key_here"
      }
    }
  }
}

注意： Zed 使用 "context_servers" 作为键，并将其嵌入主 settings.json 文件中。

在 JetBrains IDE 中使用

在 IntelliJ IDEA、WebStorm、PyCharm 或其他 JetBrains IDE 中：

1. 前往 Settings > Tools > AI Assistant > Model Context Protocol (MCP)
2. 点击 +（添加）并粘贴：

{
  "mcpServers": {
    "img-src": {
      "command": "npx",
      "args": ["@img-src/mcp-server"],
      "env": {
        "IMG_SRC_API_KEY": "imgsrc_your_api_key_here"
      }
    }
  }
}

可用工具

upload_image

将本地文件、URL 或 base64 数据中的图片上传到你的 img-src.io 账户。

Upload ~/Photos/sunset.jpg to img-src as photos/vacation/sunset.jpg

参数：

• file_path（可选）：要上传的本地文件路径（大文件建议使用此参数）
• url（可选）：要上传的图片 URL
• data（可选）：Base64 编码的图片数据
• mimeType（可选）：图片的 MIME 类型（使用 data 时必填）
• target_path（可选）：用于整理图片的目标路径

注意：必须提供 file_path、url 或 data 中的一项。

list_images

列出账户中的图片，也可以指定文件夹。

List my img-src images in the photos/vacation folder

参数：

• folder（可选）：要列出的文件夹路径
• limit（可选）：返回的最大项目数（默认值：50）
• offset（可选）：分页时跳过的项目数

search_images

按文件名或路径搜索图片。

Search for img-src images containing "beach"

参数：

• query（必填）：搜索词
• limit（可选）：最大结果数（默认值：20）
• offset（可选）：要跳过的结果数

get_image

获取指定图片的详细元数据。

Get details for my img-src image at photos/vacation/sunset.jpg

参数：

• id（必填）：图片 ID（UUID）或文件路径

delete_image

永久删除图片。

Delete my img-src image at photos/old/unused.jpg

参数：

• id（必填）：要删除的图片 ID（UUID）或文件路径

get_usage

查看当前使用情况统计。

Show my img-src usage stats

get_settings

获取账户设置和配置。

What are my img-src account settings?

get_cdn_url

生成 CDN URL，可选择应用图像转换。

Generate an img-src CDN URL for john/photos/beach.jpg resized to 800x600

参数：

• username（必填）：图像所有者的用户名
• filepath（必填）：图像路径
• width（可选）：调整后的宽度
• height（可选）：调整后的高度
• fit（可选）：cover、contain、fill、scale-down
• quality（可选）：1–100（默认值：80）
• format（可选）：webp、avif、jpeg、png、jxl

资源

MCP 服务会将你的图像作为资源公开，Claude 可直接访问：

• URI 格式：imgsrc://images/{imageId}
• 内容：包含尺寸、格式和 CDN URL 的 JSON 元数据

Claude 可以列出并读取这些资源，以了解你拥有的图像及其属性。

提示词

适用于常见工作流的预置提示词：

upload-and-share

上传图像并获取可分享的 CDN URL。

• 参数：imageUrl（必填）、width（可选）

check-usage

检查账户用量和存储状态。

• 无需参数

find-images

按关键词搜索图像。

• 参数：query（必填）

对话示例

上传并分享图像

用户：将 ~/Photos/sunset.jpg 上传到 img-src，并给我一个调整尺寸后的 URL

Claude：我会上传这张图像，并为你生成 CDN URL。

[使用 upload_image 工具]

图像上传成功！这是调整尺寸后的 CDN URL： https://img-src.io/i/yourname/sunset.webp?w=1200&q=85

搜索并整理

用户：找到我所有的海滩照片

Claude：[使用 search_images，查询词为 "beach"]

找到 5 张海滩照片：

1. photos/vacation/beach-sunset.jpg
2. photos/summer/beach-party.png ...

检查用量

用户：我用了多少存储空间？

Claude：[使用 get_usage 工具]

你的 img-src.io 用量：

• 存储空间：245 MB / 500 MB（49%）
• 上传次数：本月 67 / 100 次
• 带宽：1.2 GB / 1 GB（120%——建议考虑升级！）

开发

# Install dependencies
pnpm install

# Build
pnpm build

# Run locally
IMG_SRC_API_KEY=imgsrc_xxx pnpm start

# Type check
pnpm type-check

# Run tests
pnpm test

许可证

MIT