Build an MCP Client in TypeScript That Connects to Multiple Tool Servers

pnpm install @modelcontextprotocol/sdk @anthropic-ai/sdk zod

// src/mcp/server-connection.ts
import { Client } from '@modelcontextprotocol/sdk/client/index.js'
import { StdioClientTransport } from '@modelcontextprotocol/sdk/client/stdio.js'
import type { Tool } from '@modelcontextprotocol/sdk/types.js'

export type ServerConfig = {
    name: string
    command: string
    args: string[]
    env?: Record<string, string>
}

export class ServerConnection {
    private client: Client
    private transport: StdioClientTransport
    private connected = false
    public tools: Tool[] = []

    constructor(public readonly config: ServerConfig) {
        this.client = new Client(
            { name: 'multi-mcp-client', version: '1.0.0' },
            { capabilities: {} }
        )
        this.transport = new StdioClientTransport({
            command: config.command,
            args: config.args,
            env: { ...process.env, ...config.env } as Record<string, string>,
        })
    }

    async connect(): Promise<void> {
        await this.client.connect(this.transport)
        const { tools } = await this.client.listTools()
        this.tools = tools
        this.connected = true
    }

    async callTool(name: string, args: Record<string, unknown>) {
        if (!this.connected) throw new Error(`${this.config.name} not connected`)
        return this.client.callTool({ name, arguments: args })
    }

    async close(): Promise<void> {
        if (this.connected) {
            await this.client.close()
            this.connected = false
        }
    }
}

// src/mcp/multi-client.ts
import { ServerConnection, ServerConfig } from './server-connection'
import type { Tool } from '@modelcontextprotocol/sdk/types.js'

export type NamespacedTool = Tool & {
    server: string
    originalName: string
}

export class MultiMCPClient {
    private servers = new Map<string, ServerConnection>()

    async addServer(config: ServerConfig): Promise<void> {
        if (this.servers.has(config.name)) {
            throw new Error(`Server "${config.name}" already registered`)
        }
        const conn = new ServerConnection(config)
        try {
            await conn.connect()
            this.servers.set(config.name, conn)
        } catch (err) {
            await conn.close().catch(() => {})
            throw new Error(
                `Failed to connect to ${config.name}: ${(err as Error).message}`
            )
        }
    }

    listTools(): NamespacedTool[] {
        const all: NamespacedTool[] = []
        for (const [serverName, conn] of this.servers) {
            for (const tool of conn.tools) {
                all.push({
                    ...tool,
                    name: `${serverName}__${tool.name}`,
                    server: serverName,
                    originalName: tool.name,
                })
            }
        }
        return all
    }

    async callTool(namespacedName: string, args: Record<string, unknown>) {
        const [serverName, ...rest] = namespacedName.split('__')
        const originalName = rest.join('__')
        const conn = this.servers.get(serverName)
        if (!conn) throw new Error(`No server registered: ${serverName}`)
        return conn.callTool(originalName, args)
    }

    async closeAll(): Promise<void> {
        const closings = [...this.servers.values()].map((c) =>
            c.close().catch((e) => console.error(`Close failed: ${e.message}`))
        )
        await Promise.all(closings)
        this.servers.clear()
    }
}

// src/agent/run.ts
import Anthropic from '@anthropic-ai/sdk'
import { MultiMCPClient } from '../mcp/multi-client'

const anthropic = new Anthropic()

export async function runAgent(mcp: MultiMCPClient, userMessage: string) {
    const tools = mcp.listTools().map((t) => ({
        name: t.name,
        description: t.description ?? '',
        input_schema: t.inputSchema as Anthropic.Tool.InputSchema,
    }))

    const messages: Anthropic.MessageParam[] = [
        { role: 'user', content: userMessage },
    ]

    while (true) {
        const response = await anthropic.messages.create({
            model: 'claude-sonnet-4-6',
            max_tokens: 4096,
            tools,
            messages,
        })

        messages.push({ role: 'assistant', content: response.content })

        if (response.stop_reason !== 'tool_use') {
            const textBlock = response.content.find((b) => b.type === 'text')
            return textBlock?.type === 'text' ? textBlock.text : ''
        }

        const toolResults: Anthropic.ToolResultBlockParam[] = []
        for (const block of response.content) {
            if (block.type !== 'tool_use') continue
            try {
                const result = await mcp.callTool(
                    block.name,
                    block.input as Record<string, unknown>
                )
                toolResults.push({
                    type: 'tool_result',
                    tool_use_id: block.id,
                    content: JSON.stringify(result.content),
                })
            } catch (err) {
                toolResults.push({
                    type: 'tool_result',
                    tool_use_id: block.id,
                    content: `Error: ${(err as Error).message}`,
                    is_error: true,
                })
            }
        }

        messages.push({ role: 'user', content: toolResults })
    }
}

// src/index.ts
import { MultiMCPClient } from './mcp/multi-client'
import { runAgent } from './agent/run'

async function main() {
    const mcp = new MultiMCPClient()

    await mcp.addServer({
        name: 'db',
        command: 'node',
        args: ['./servers/db-server.js'],
        env: { DATABASE_URL: process.env.DATABASE_URL! },
    })

    await mcp.addServer({
        name: 'fs',
        command: 'npx',
        args: ['-y', '@modelcontextprotocol/server-filesystem', './workspace'],
    })

    await mcp.addServer({
        name: 'search',
        command: 'node',
        args: ['./servers/search-server.js'],
        env: { BRAVE_API_KEY: process.env.BRAVE_API_KEY! },
    })

    try {
        const answer = await runAgent(
            mcp,
            'Find all customers who signed up last week, save the list to customers.csv, and look up news about our top three accounts.'
        )
        console.log(answer)
    } finally {
        await mcp.closeAll()
    }
}

main().catch((err) => {
    console.error(err)
    process.exit(1)
})