live-preview-mcp
Allows starting and managing live previews of Angular applications through framework auto-detection.
Provides integration with Cloudflare tunnels to expose live previews via public URLs.
Enables running application previews in Docker containers with security hardening.
Allows starting and managing live previews of Expo projects through framework auto-detection.
Allows starting and managing live previews of Express applications through framework auto-detection.
Allows starting and managing live previews of Flutter projects through framework auto-detection.
Allows starting and managing live previews of Next.js projects through framework auto-detection.
Provides integration with ngrok tunnels to expose live previews via public URLs.
Allows starting and managing live previews of Vite projects through framework auto-detection.
Click on "Deploy Server".
Wait a few minutes for the server to deploy. Once ready, it will show a "Started" state.
In the chat, type
@followed by the MCP server name and your instructions, e.g., "@live-preview-mcpStart a live preview for my app and share the URL"
That's it! The server will respond to your query, and you can continue using it as needed.
Here is a step-by-step guide with screenshots.
Live Preview MCP Server
Version 1.1 (post red-team hardening) — Production-grade Model Context Protocol server that lets any MCP-capable AI assistant start, manage, and embed live application previews in an iframe.
Security Hardening (v1.1)
No shell injection: Docker and process spawn always use argument arrays (
shell: false).Safe environment: Only an explicit allow-list of env vars is passed; dangerous keys (
NODE_OPTIONS,LD_PRELOAD, etc.) are stripped.Symlink-safe path checks:
realpathSyncbefore allow-list validation.WebSocket rate limiting + per-preview connection caps.
Process-liveness readiness: readiness probe also verifies the child process is still alive.
Concurrent preview limit (default 10).
Docker:
CapDrop: ALL,no-new-privileges, non-root user where possible, AutoRemove + startup orphan reaper.Stronger log redaction (JWT, AWS keys, GitHub/Slack/OpenAI tokens, etc.).
Token length increased to 32 random bytes.
Related MCP server: Dynamic Code Executor MCP Server
Features
MCP Tools:
start_preview,stop_preview,get_preview_status,get_preview_logs,list_previews,reload_preview,update_preview_config,share_preview,get_mobile_qr,set_auth_tokenFramework Auto-Detection: Vite, Next.js, CRA, Vue, Angular, Express, static, Expo, Flutter
HTTP Dashboard + Reverse Proxy with framing headers removed
Optional Docker, Cloudflare/ngrok tunnels, mobile QR, token auth, Cloud-IDE awareness
Requirements
Node.js ≥ 18
Optional: Docker,
cloudflared,ngrok
Install & Build
cd live-preview-mcp
npm install
npm run buildRun
node dist/index.jsMCP Client Configuration
{
"mcpServers": {
"live-preview": {
"command": "node",
"args": ["/absolute/path/to/live-preview-mcp/dist/index.js"],
"env": {
"PORT": "9000",
"ALLOWED_DIRS": "/path/to/projects"
}
}
}
}License
MIT
This server cannot be deployed
Maintenance
Related MCP Connectors
Build and publish web apps from your AI client: live preview, Postgres, storage, public URL.
Your AI Agent's Infrastructure Layer. Connect Claude, Copilot, Codex, or ChatGPT to 200+ managed open source services. Start databases, pipelines, and applications through natural language.
- PebbleOAuthcom.shippebble
Host the tools your AI builds — small internal tools in isolated microVMs, live for your team.
Host apps built with AI: deploy to a live HTTPS URL, custom domains, secrets and backups.
Related MCP Servers
- FlicenseAqualityDmaintenanceEnables AI assistants to securely execute Python and JavaScript code in sandboxed environments, with file management and package installation.778 npm-
- AlicenseAqualityCmaintenanceEnables AI assistants to execute code in isolated sandboxes with support for Python, JavaScript, and TypeScript, featuring intelligent caching and semantic search for code reuse.9MIT
- AlicenseBqualityCmaintenanceEnables AI assistants to scaffold, edit, live-preview, and deploy full-stack apps with built-in database, email, and push notification capabilities through natural language.19MIT
- AlicenseAqualityBmaintenanceEnables AI coding agents to safely execute commands, run tests, and modify project files inside disposable, policy-enforced Docker sandboxes that are isolated from the host machine and its credentials.15MIT