MCP HTML Sync Server
About
A real-time HTML syncing server with hot reload capabilities, built using the Model Context Protocol (MCP)
Details
- Author
- yujiosaka
- Downloads
- 326
- Categories
- Other
Jump to
- Real-time HTML syncing with instant client updates
- WebSocket hot reload for connected browsers
- Script management via CDN URLs or inline content
- Stylesheet management via CDN URLs
- Built for AI agents using the Model Context Protocol
- Automatic page expiration after configurable time
- Configurable maximum page count with cleanup of oldest pages
- Lightweight with minimal dependencies
Setting up with Highlight
This MCP is not yet compatible with Highlight’s one-click setup. However, you can still use it with Highlight by following these steps:
- Download and install Highlight from highlightai.com/download
- Navigate to the plugins tab and select "Add Custom Plugin"
-
Configure the plugin with the settings below
Plugin Name
MCP HTML Sync ServerCommand (node, npx, python, etc.)Please refer to the README for specific instructions on how to obtain API keys or other required environment variables.
- Enable "Start Automatically" if you want the plugin to start when Highlight launches
From the repository
Install via Docker (docker pull yujiosaka/mcp-html-sync-server), npx (npx mcp-html-sync-server), or from source. Configure using environment variables or a .env file (SERVER_HOST, SERVER_PORT, BASE_URL, PAGE_MAX_AGE, PAGE_MAX_COUNT). Integrate with Claude Desktop or VS Code by adding an MCP server entry to their configuration JSON, and invoke the server’s tools (create_page, update_page, destroy_page) from an AI agent.
Claude Desktop / Cursor
Paste into your MCP client config file to install this server.
{
"mcpServers": {
"mcp html sync server": {
"mcp-html-sync-server": {
"command": "docker",
"args": [
"pull",
"yujiosaka/mcp-html-sync-server"
]
}
}
}
}McpServers
{
"mcp-html-sync-server": {
"command": "docker",
"args": [
"pull",
"yujiosaka/mcp-html-sync-server"
]
}
}MCP HTML Sync Server 
Code of Conduct | Contributing | Security
A real-time HTML syncing server with hot reload capabilities, built using the Model Context Protocol (MCP). This server enables AI agents to create, update, and destroy HTML pages dynamically, with all connected clients receiving updates in real-time.
Features
- Real-time HTML Syncing: Create and update HTML content with instant updates to all connected clients
- WebSocket Hot Reload: All connected browsers automatically refresh when content changes
- Script Management: Add JavaScript scripts to pages, either via CDN URLs or inline content
- Stylesheet Management: Add CSS stylesheets to pages via CDN URLs
- MCP Integration: Designed specifically for AI agents using the Model Context Protocol
- Page Lifecycle Management: Automatic expiration of pages after configurable time periods
- Connection Limits: Configurable maximum page count with automatic cleanup of oldest pages
- Simple API: Easy-to-use MCP tools for page creation, updating, and destruction
- Lightweight: Minimal dependencies and efficient resource usage
Architecture
flowchart LR
AI[AI Agent] -->|MCP Protocol| MCP[MCP HTML Sync Server]
MCP -->|Create/Update/Destroy/AddScripts/AddStylesheets| PM[Page Manager]
PM -->|Store| Pages[(HTML Pages, Scripts & Stylesheets)]
User[User Browser] -->|HTTP Request| HTTP[HTTP Server]
HTTP -->|Fetch Page, Scripts & Stylesheets| PM
User <-->|WebSocket| WS[WebSocket Server]
WS <-->|Real-time Updates| PM
Installation
Using Docker
docker pull yujiosaka/mcp-html-sync-server
docker run -p 3000:3000 yujiosaka/mcp-html-sync-server
Docker Environment Variables
Instead of using an .env file, you can pass environment variables directly to the Docker container at runtime:
docker run -p 3000:3000 \
-e SERVER_PORT=3000 \
-e BASE_URL=http://localhost:3000/ \
-e PAGE_MAX_AGE=1h \
-e PAGE_MAX_COUNT=1000 \
yujiosaka/mcp-html-sync-server
This approach is recommended for production deployments as it allows you to configure the server without modifying the container image.
Using NPX
NODE_ENV=production npx mcp-html-sync-server
From Source
```bash
Sign in to leave a review
Use Google, GitHub, or an email account so ratings stay tied to real people.
No reviews posted yet.
