image-viewer

@OguntolaIbrahim/image-viewer

Hosted

0 Stars 10 次浏览 OguntolaIbrahim 更新于 2026-08-23

InChat Image Viewer MCP - View images inline in AI chat by just providing the file path

开发者工具

MCP 服务配置

复制以下 JSON 到 OPClaw 或其他 MCP 客户端的配置文件中即可使用

{
  "mcpServers": {
    "inchat-image-viewer-mcp": {
      "args": [
        "inchat-image-viewer-mcp@1.0.1"
      ],
      "command": "npx"
    }
  }
}

可用工具（5 个）

该服务在 MCP 协议中暴露的工具，AI 可按需调用

tavily_search 14 个参数需填 1 项 Search the web for current information on any topic. Use for news, facts, or data beyond your knowledge cutoff. Returns snippets and source URLs.

Search the web for current information on any topic. Use for news, facts, or data beyond your knowledge cutoff. Returns snippets and source URLs.

必填参数：query

tavily_extract 6 个参数需填 1 项 Extract content from URLs. Returns raw page content in markdown or text format.

Extract content from URLs. Returns raw page content in markdown or text format.

必填参数：urls

tavily_crawl 11 个参数需填 1 项 Crawl a website starting from a URL. Extracts content from pages with configurable depth and breadth.

Crawl a website starting from a URL. Extracts content from pages with configurable depth and breadth.

必填参数：url

tavily_map 8 个参数需填 1 项 Map a website's structure. Returns a list of URLs found starting from the base URL.

Map a website's structure. Returns a list of URLs found starting from the base URL.

必填参数：url

tavily_research 2 个参数需填 1 项 Perform comprehensive research on a given topic or question. Use this tool when you need to gather information from multiple sources to answer a question or complete a task. Returns a detailed response based on the research findings.

Perform comprehensive research on a given topic or question. Use this tool when you need to gather information from multiple sources to answer a question or complete a task. Returns a detailed response based on the research findings.

必填参数：input

服务介绍

InChat Image Viewer MCP

The Problem: GitHub Copilot Chat can't see images from file paths—only drag-and-drop works, breaking your workflow.

The Solution: Give AI the file path in plain text, and it sees the image instantly using this MCP.

# Why This Exists

# # What DOESN'T Work in VS Code Copilot Chat

❌ Plain file paths → AI can't see them

Show me C:\screenshots\bug.png

Result: AI sees text, not the image

❌ # file: references → Unreliable for images

# file:screenshot.png

Result: Empty <attachments> - AI sees nothing

✅ Drag-and-drop → Works, but manual and disruptive
Result: AI sees image as base64 attachment, but you have to manually drag every single image

# # What This MCP Solves

✅ Plain file paths with MCP → AI sees images instantly

# image-viewer Show me C:\screenshots\bug.png

Result: AI calls view_image tool and displays the image inline—no manual steps

# How It Works: Before vs After

# # WITHOUT InChat Image Viewer MCP

You: "Analyze C:\test-results\failure-screenshot.png"

AI receives:

<attachments></attachments>  <!- - Empty! - ->

Just sees the text path—no image data.

What you have to do: Stop, drag the file into chat, drop it, then ask again.

# # WITH InChat Image Viewer MCP

You: "# image-viewer Analyze C:\test-results\failure-screenshot.png"

AI receives:

{
  "content": [
    {
      "type": "text",
      "text": "Image: failure-screenshot.png (124,433 bytes)"
    },
    {
      "type": "image",
      "data": "iVBORw0KGgoAAAANSUhEUgAAB4AAAAQ4CAIAAABnsVYU...",
      "mimeType": "image/png"
    }
  ]
}

AI sees the full image inline automatically.

What you do: Nothing extra—just type naturally with # image-viewer.

# Features

📸 Path-to-image: Type the path, AI sees the image
🖼️ Multi-format: PNG, JPEG, GIF, BMP, WebP
⚡ Zero-config: npx inchat-image-viewer-mcp just works
🔌 Works with: VS Code Copilot Chat, Claude Desktop

# Quick Start

# # 1. Install (Optional)

npm install -g inchat-image-viewer-mcp
#  or use npx (no install needed)

# # 2. Add to Your AI Tool

VS Code Copilot Chat – mcp.json:

{
  "servers": {
    "image-viewer": {
      "command": "npx",
      "args": ["inchat-image-viewer-mcp"]
    }
  }
}

Claude Desktop – Config file (%APPDATA%\Claude\claude_desktop_config.json on Windows):

{
  "mcpServers": {
    "image-viewer": {
      "command": "npx",
      "args": ["inchat-image-viewer-mcp"]
    }
  }
}

# # 3. Restart

Reload VS Code or restart Claude Desktop to load the MCP server.

# Usage Examples

# image-viewer What's in C:\Users\me\screenshot.png?

# image-viewer Compare before.jpg and after.jpg in the results folder

# image-viewer Debug this error screenshot: D:\projects\test-failures\2026-01-20.png

The AI automatically uses the view_image tool—no manual attachment needed.

# Supported Formats

PNG · JPEG · GIF · BMP · WebP

# License

MIT

Made with 🤖 by Ibrahim Oguntola

查看源码项目主页