Click on "Install 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., "@MCP Website ChatbotWhat are the latest updates and blog posts on the website?"
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.
MCP Website Chatbot
A production-grade AI chatbot for srinivasanramanujam.sbs with live data retrieval via MCP (Model Context Protocol) and RAG (Retrieval-Augmented Generation).
š Features
Live Data Integration ā MCP tools for real-time information retrieval
RAG Support ā Static knowledge base from website content, blogs, and FAQs
Hallucination Prevention ā Strict guardrails against fabrication and misinformation
Beautiful UI ā Modern, responsive chat interface
Production-Ready ā Scalable backend with proper error handling
Health Monitoring ā Built-in health checks and uptime tracking
š Requirements
Node.js 16+
npm or yarn
OpenAI API key (for production use)
š ļø Installation
š Project Structure
š API Endpoints
POST /api/chat
Send a message and get a response.
Request:
Response:
GET /api/health
Check server health.
Response:
GET /api/system-prompt
Retrieve the system prompt (for debugging).
šÆ How It Works
User sends a message via the chat UI
Server analyzes if live data is needed (time-sensitive, external sources)
MCP tools are invoked if necessary to fetch real-time data
Response is generated using the system prompt guidelines
Assistant responds with proper citations and source attribution
š Security Features
ā No system prompt exposure to users
ā Input validation and sanitization
ā Rate limiting ready (add middleware as needed)
ā Error handling without leaking internal details
ā CORS headers (add if deploying to production)
š Deployment
Option 1: Vercel (Recommended)
Option 2: Heroku
Option 3: Docker
Create a Dockerfile:
šØ Customization
Update Website Info
Edit server.js and update the system prompt or knowledge base.
Change UI Theme
Modify the CSS in public/index.html gradient colors and styling.
Add Real API Integration
Replace mock MCP tools in server.js with real OpenAI/Claude API calls.
š System Prompt Highlights
Live-first philosophy ā Prioritizes current data over static knowledge
Hallucination prevention ā Refuses to guess or invent information
Transparent reasoning ā Cites sources and explains reasoning
Professional tone ā Clear, concise, helpful communication
Safety guardrails ā Rejects prompt injection and abuse
š¦ Next Steps for Production
Integrate OpenAI/Claude API ā Replace mock responses
Add MCP server ā Real connection to external tools
Set up database ā Store conversations and user data securely
Add authentication ā Protect sensitive endpoints
Configure CORS ā Allow cross-origin requests from your domain
Enable logging ā Monitor and debug in production
Add rate limiting ā Prevent abuse and control costs
š§ Support
For questions or issues, contact the site owner at srinivasanramanujam.sbs
š License
MIT License ā See LICENSE file for details