About Client Demo
Client Demo is an MCP server published by yonaka15 in the AI category: a demo implementation of a Model Context Protocol (MCP) client using Web Workers and Server-Sent Events (SSE).
The repository has 8 stars and 3 forks, with the last commit a year ago. Six months or more without a commit doesn't mean the server is broken, but check the open issues before depending on it in production.
Install
git clone https://github.com/yonaka15/mcp-client-demoThis server has no ConduID identity, so agent calls to it are not receipted. Pin the version you install and review the source before granting it credentials.
Ask AI
Ask AI about Client Demo
Powered by Claude · Grounded in docs
Security checks
Static checks derived from the repository yesterday. Heuristics on the source, not an audit.
- ✓README presentThe repository ships documentation.
- !License declaredNo license file. Legally you have no right to use it in a product.
- !Tests presentNo tests found. Behaviour changes may go unnoticed between versions.
- ✓Dependencies pinnedA lockfile pins dependency versions.
- ✓No dynamic code executionSource scan found no eval, dynamic Function, or shell execution.
1 check has not been run yet.
README
MCP Client Demo
Note: This project is currently a work in progress (WIP). Features and implementations may change significantly.
A demo implementation of a Model Context Protocol (MCP) client using Web Workers and Server-Sent Events (SSE).
Features
- Web Worker-based MCP client implementation
- Server-Sent Events (SSE) transport
- Interactive testing UI
- Type-safe implementation with TypeScript
- Built with Vite + React
Getting Started
Prerequisites
- Node.js 18.x or later
- An MCP-compatible server running on
localhost:3020
Installation
- Clone the repository
- Install dependencies:
npm install
Development
Start the development server:
npm run dev
Testing the Worker
- Open
test.htmlin your browser - Click "Connect" to establish connection with the MCP server
- Use "List Tools" to see available tools
- Select a tool and provide input in JSON format
- Click "Execute Tool" to run the selected tool
Project Structure
src/
├── worker.ts # MCP client worker implementation
├── worker-test.ts # Worker test interface
├── types.ts # Type definitions
└── App.tsx # Main React application
Key Components
- worker.ts: Main Web Worker implementation of the MCP client
- worker-test.ts: Testing interface for the worker
- types.ts: Shared type definitions for worker commands and responses
Implementation Details
Worker Commands
The worker accepts the following commands:
connect: Establish connection with MCP serverdisconnect: Close the connectionlistTools: Get list of available toolscallTool: Execute a specific tool
Worker Responses
The worker sends responses in the following format:
type WorkerResponse =
| {
type: "status";
status: WorkerStatus;
}
| {
type: "result";
result: ListToolsResult | CallToolResult;
}
| {
type: "error";
error: string;
details?: Record<string, unknown>;
};
Development
Building
Build the project:
npm run build
Linting
Run ESLint:
npm run lint
Contributing
- Fork the repository
- Create your feature branch
- Commit your changes
- Push to the branch
- Create a new Pull Request
README fetched from the repository yesterday. The original is authoritative.