mcp-golang-wasm-example

mcp-golang-wasm-example

An MCP server running in the browser via WebAssembly, providing tools like getCurrentTime and add for streamable HTTP communication.

Category
访问服务器

README

MCP Go WASM Server

A Model Context Protocol (MCP) server implementation in Go that runs in the browser via WebAssembly. This project demonstrates how to build an MCP server that can be executed client-side using WASM, enabling streamable HTTP communication without external dependencies.

🌟 Features

  • Pure Go Implementation: Built using Go's standard library with no external dependencies
  • WebAssembly Support: Runs entirely in the browser via WASM
  • MCP Protocol Compliant: Implements the Model Context Protocol specification (version 2024-11-05)
  1. Go WASM Module: Compiles to WebAssembly and exposes JavaScript functions
  2. JavaScript Bridge: Handles communication between the browser and WASM
  3. JSON-RPC Protocol: Standard request/response pattern for tool invocation
  4. MCP Compliance: Follows the Model Context Protocol specification

🚀 Quick Start

Prerequisites

  • Go 1.21 or higher
  • Python 3 (for local HTTP server)
  • Modern web browser with WebAssembly support
  • Or use the included Dev Container for a pre-configured environment

Using Dev Container (Recommended)

This project includes a Dev Container configuration for VS Code. You do not need to install Go or Python locally.

Steps:

  1. Open the project in VS Code.
  2. If prompted, "Reopen in Container" (or use the Command Palette: Dev Containers: Reopen in Container).
  3. The container will build with Go and Python pre-installed, and VS Code extensions for Go and Python enabled.
  4. Use the integrated terminal to run make build and make serve as described below.

This ensures a consistent development environment for all contributors.

Build and Run

# Build the WASM binary
make build

# Serve the application (builds automatically)
make serve

# Or combine both steps
make run

Then open your browser to http://localhost:8080

Manual Build

# Build WASM
GOOS=js GOARCH=wasm go build -o main.wasm main.go

# Copy the Go WASM runtime
cp "$(go env GOROOT)/misc/wasm/wasm_exec.js" .

# Serve with any HTTP server
python3 -m http.server 8080

📖 Usage

Using the Web Interface

  1. Initialize Server: Click "Initialize Server" to establish the MCP connection
  2. List Tools: View all available tools and their schemas
  3. Call Tool: Select a tool from the dropdown, enter parameters (space-separated), and execute the tool. For example, use add 2 3 to get the sum of 2 and 3, or select getCurrentTime with no parameters.

Programmatic Usage

// Send a JSON-RPC request to the MCP server
const request = {
    jsonrpc: "2.0",
    id: 1,
    method: "tools/call",
    params: {
        name: "add",
        arguments: { a: 2, b: 3 }
    }
};

const responseJSON = mcpHandleRequest(JSON.stringify(request));
const response = JSON.parse(responseJSON);
console.log(response.result);

🛠️ MCP Protocol Implementation

Supported Methods

Method Description
initialize Initialize the MCP server connection
tools/list List all available tools
tools/call Execute a specific tool

Example Tools

getCurrentTime

{
    "name": "getCurrentTime",
    "description": "Returns the current time in RFC3339 format",
    "inputSchema": {
        "type": "object",
        "properties": {},
        "required": []
    }
}

add

{
    "name": "add",
    "description": "Returns the sum of two numbers (a + b)",
    "inputSchema": {
        "type": "object",
        "properties": {
            "a": { "type": "number" },
            "b": { "type": "number" }
        },
        "required": ["a", "b"]
    }
}

🔧 Adding New Tools

🔧 Adding or Using Tools

To use a tool, select it from the dropdown in the UI and enter its parameters (space-separated). For example:

  • For add, enter: 2 3 (returns 5)
  • For getCurrentTime, no parameters are needed

To add a new tool to the server, define it in NewMCPServer() and implement its handler in handleToolCall(), then rebuild the WASM binary.

📁 Project Structure

.
├── main.go           # MCP server implementation
├── index.html        # Web interface
├── go.mod           # Go module definition
├── Makefile         # Build automation
└── README.md        # This file

🎨 Design Philosophy

This implementation prioritizes:

  • Simplicity: No external dependencies, pure Go standard library
  • Efficiency: Minimal overhead, direct JavaScript bridge
  • Idiomatic Go: Follows Go best practices and conventions
  • Browser-First: Designed specifically for WASM/browser environments
  • MCP Compliance: Adheres to the Model Context Protocol specification

🔍 Technical Details

WASM Bridge

The Go code exposes a single function to JavaScript:

js.Global().Set("mcpHandleRequest", js.FuncOf(func(this js.Value, args []js.Value) interface{} {
    requestJSON := args[0].String()
    response := server.HandleRequest(requestJSON)
    return response
}))

JSON-RPC 2.0

All communication follows the JSON-RPC 2.0 specification:

  • Request: { jsonrpc, id, method, params }
  • Response: { jsonrpc, id, result } or { jsonrpc, id, error }

Error Codes

Standard JSON-RPC error codes:

  • -32700: Parse error
  • -32601: Method not found
  • -32602: Invalid params

🧪 Testing

Test the server using the web interface or browser console:

// Initialize
mcpHandleRequest('{"jsonrpc":"2.0","id":1,"method":"initialize","params":{}}')

// List tools
mcpHandleRequest('{"jsonrpc":"2.0","id":2,"method":"tools/list"}')

// Call tool
mcpHandleRequest('{"jsonrpc":"2.0","id":3,"method":"tools/call","params":{"name":"getCurrentTime"}}')

📝 License

MIT License - feel free to use this in your own projects!

🤝 Contributing

Contributions are welcome! Feel free to:

  • Add new example tools
  • Improve the UI
  • Enhance error handling
  • Add tests
  • Improve documentation

🔗 Resources


Built with ❤️ using Go and WebAssembly

推荐服务器

Baidu Map

Baidu Map

百度地图核心API现已全面兼容MCP协议,是国内首家兼容MCP协议的地图服务商。

官方
精选
JavaScript
Playwright MCP Server

Playwright MCP Server

一个模型上下文协议服务器,它使大型语言模型能够通过结构化的可访问性快照与网页进行交互,而无需视觉模型或屏幕截图。

官方
精选
TypeScript
Audiense Insights MCP Server

Audiense Insights MCP Server

通过模型上下文协议启用与 Audiense Insights 账户的交互,从而促进营销洞察和受众数据的提取和分析,包括人口统计信息、行为和影响者互动。

官方
精选
本地
TypeScript
Magic Component Platform (MCP)

Magic Component Platform (MCP)

一个由人工智能驱动的工具,可以从自然语言描述生成现代化的用户界面组件,并与流行的集成开发环境(IDE)集成,从而简化用户界面开发流程。

官方
精选
本地
TypeScript
VeyraX

VeyraX

一个单一的 MCP 工具,连接你所有喜爱的工具:Gmail、日历以及其他 40 多个工具。

官方
精选
本地
Kagi MCP Server

Kagi MCP Server

一个 MCP 服务器,集成了 Kagi 搜索功能和 Claude AI,使 Claude 能够在回答需要最新信息的问题时执行实时网络搜索。

官方
精选
Python
graphlit-mcp-server

graphlit-mcp-server

模型上下文协议 (MCP) 服务器实现了 MCP 客户端与 Graphlit 服务之间的集成。 除了网络爬取之外,还可以将任何内容(从 Slack 到 Gmail 再到播客订阅源)导入到 Graphlit 项目中,然后从 MCP 客户端检索相关内容。

官方
精选
TypeScript
Exa MCP Server

Exa MCP Server

模型上下文协议(MCP)服务器允许像 Claude 这样的 AI 助手使用 Exa AI 搜索 API 进行网络搜索。这种设置允许 AI 模型以安全和受控的方式获取实时的网络信息。

官方
精选
mcp-server-qdrant

mcp-server-qdrant

这个仓库展示了如何为向量搜索引擎 Qdrant 创建一个 MCP (Managed Control Plane) 服务器的示例。

官方
精选
e2b-mcp-server

e2b-mcp-server

使用 MCP 通过 e2b 运行代码。

官方
精选