Skip to content

Add splash page for MCP Everything Server #6

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
wants to merge 3 commits into
base: main
Choose a base branch
from
Open

Add splash page for MCP Everything Server #6

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
3e81ec4
Add splash page for MCP Everything Server
jerome3o-anthropic Aug 19, 2025
9df5df3
Potential fix for code scanning alert no. 5: Missing rate limiting
jerome3o-anthropic Aug 22, 2025
6c4b45d
Fix package-lock.json sync issue with express-rate-limit@8.0.1
jerome3o-anthropic Aug 22, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
36 changes: 32 additions & 4 deletions package-lock.json
View file
Open in desktop

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

3 changes: 2 additions & 1 deletion package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -32,7 +32,8 @@
"cors": "^2.8.5",
"dotenv": "^16.4.7",
"express": "^4.21.2",
"raw-body": "^3.0.0"
"raw-body": "^3.0.0",
"express-rate-limit": "^8.0.1"
},
"overrides": {
"@types/express": "^5.0.0",
Expand Down
14 changes: 14 additions & 0 deletions src/index.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,7 @@ import { BearerAuthMiddlewareOptions, requireBearerAuth } from "@modelcontextpro
import { AuthRouterOptions, getOAuthProtectedResourceMetadataUrl, mcpAuthRouter } from "@modelcontextprotocol/sdk/server/auth/router.js";
import cors from "cors";
import express from "express";
import rateLimit from "express-rate-limit";
import path from "path";
import { fileURLToPath } from "url";
import { EverythingAuthProvider } from "./auth/provider.js";
Expand All @@ -15,6 +16,13 @@ import { logger } from "./utils/logger.js";

const app = express();

// Rate limiter for splash page
const splashLimiter = rateLimit({
windowMs: 15 * 60 * 1000, // 15 minutes
max: 100, // limit each IP to 100 requests per windowMs
standardHeaders: true, // Return rate limit info in the `RateLimit-*` headers
legacyHeaders: false, // Disable the `X-RateLimit-*` headers
});
// Get the directory of the current module
const __filename = fileURLToPath(import.meta.url);
const __dirname = path.dirname(__filename);
Expand Down Expand Up @@ -167,6 +175,12 @@ app.get("/mcp-logo.png", (req, res) => {
res.sendFile(logoPath);
});

// Splash page
app.get("/", splashLimiter, (req, res) => {
const splashPath = path.join(__dirname, "static", "index.html");
res.sendFile(splashPath);
});

// Upstream auth routes
app.get("/fakeupstreamauth/authorize", cors(corsOptions), handleFakeAuthorize);
app.get("/fakeupstreamauth/callback", cors(corsOptions), handleFakeAuthorizeRedirect);
Expand Down
280 changes: 280 additions & 0 deletions src/static/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,280 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>MCP Everything Server</title>
<style>
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}

body {
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
background: #ffffff;
color: #000000;
min-height: 100vh;
display: flex;
flex-direction: column;
}

.container {
max-width: 1200px;
margin: 0 auto;
padding: 2rem;
flex: 1;
}

header {
display: flex;
align-items: center;
gap: 2rem;
margin-bottom: 3rem;
padding-bottom: 2rem;
border-bottom: 2px solid #000000;
}

.logo {
width: 80px;
height: 80px;
}

h1 {
font-size: 2.5rem;
font-weight: 700;
letter-spacing: -0.02em;
}

.tagline {
font-size: 1.25rem;
color: #666666;
margin-bottom: 3rem;
line-height: 1.6;
}

.features {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
gap: 2rem;
margin-bottom: 3rem;
}

.feature-card {
border: 2px solid #000000;
padding: 1.5rem;
background: #ffffff;
transition: all 0.2s ease;
}

.feature-card:hover {
background: #000000;
color: #ffffff;
transform: translateY(-2px);
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
}

.feature-card h3 {
font-size: 1.25rem;
margin-bottom: 0.75rem;
font-weight: 600;
}

.feature-card p {
line-height: 1.6;
opacity: 0.9;
}

.endpoints {
background: #f5f5f5;
border: 2px solid #000000;
padding: 2rem;
margin-bottom: 3rem;
}

.endpoints h2 {
font-size: 1.75rem;
margin-bottom: 1.5rem;
font-weight: 600;
}

.endpoint-list {
display: flex;
flex-direction: column;
gap: 1rem;
}

.endpoint {
font-family: 'Courier New', monospace;
background: #ffffff;
padding: 0.75rem 1rem;
border: 1px solid #000000;
display: flex;
align-items: center;
gap: 1rem;
}

.method {
font-weight: bold;
min-width: 80px;
}

.method.get { color: #0066cc; }
.method.post { color: #009900; }
.method.delete { color: #cc0000; }

.links {
display: flex;
gap: 2rem;
flex-wrap: wrap;
margin-bottom: 3rem;
}

.link-button {
display: inline-flex;
align-items: center;
gap: 0.5rem;
padding: 1rem 2rem;
background: #000000;
color: #ffffff;
text-decoration: none;
font-weight: 600;
transition: all 0.2s ease;
border: 2px solid #000000;
}

.link-button:hover {
background: #ffffff;
color: #000000;
}

.link-button.secondary {
background: #ffffff;
color: #000000;
}

.link-button.secondary:hover {
background: #000000;
color: #ffffff;
}

footer {
background: #000000;
color: #ffffff;
padding: 2rem;
text-align: center;
}

footer a {
color: #ffffff;
text-decoration: underline;
}

@media (max-width: 768px) {
h1 {
font-size: 2rem;
}

header {
flex-direction: column;
align-items: flex-start;
gap: 1rem;
}

.logo {
width: 60px;
height: 60px;
}
}
</style>
</head>
<body>
<div class="container">
<header>
<img src="/mcp-logo.png" alt="MCP Logo" class="logo">
<h1>MCP Everything Server</h1>
</header>

<p class="tagline">
A comprehensive reference implementation of the Model Context Protocol (MCP) server
demonstrating all protocol features with full authentication support and horizontal scalability.
</p>

<div class="features">
<div class="feature-card">
<h3>Complete MCP Support</h3>
<p>All MCP features including tools, resources, prompts, sampling, completions, and logging with full protocol compliance.</p>
</div>
<div class="feature-card">
<h3>Multiple Transports</h3>
<p>Streamable HTTP (SHTTP) and Server-Sent Events (SSE) transports for flexible client integration.</p>
</div>
<div class="feature-card">
<h3>OAuth 2.0 Authentication</h3>
<p>Complete OAuth flow with PKCE support and a built-in fake provider for testing and development.</p>
</div>
<div class="feature-card">
<h3>Horizontal Scalability</h3>
<p>Redis-backed session management enables multi-instance deployments with automatic load distribution.</p>
</div>
<div class="feature-card">
<h3>7 Demo Tools</h3>
<p>Echo, add, long-running operations, LLM sampling, image handling, annotations, and resource references.</p>
</div>
<div class="feature-card">
<h3>100+ Resources</h3>
<p>Example resources with pagination, templates, subscriptions, and real-time update notifications.</p>
</div>
</div>

<div class="endpoints">
<h2>API Endpoints</h2>
<div class="endpoint-list">
<div class="endpoint">
<span class="method post">POST</span>
<span>/mcp - Initialize sessions or send messages (Streamable HTTP)</span>
</div>
<div class="endpoint">
<span class="method get">GET</span>
<span>/mcp - Establish SSE streams (Streamable HTTP)</span>
</div>
<div class="endpoint">
<span class="method delete">DELETE</span>
<span>/mcp - Terminate sessions (Streamable HTTP)</span>
</div>
<div class="endpoint">
<span class="method get">GET</span>
<span>/sse - Legacy SSE transport endpoint</span>
</div>
<div class="endpoint">
<span class="method post">POST</span>
<span>/message - Legacy message endpoint for SSE transport</span>
</div>
</div>
</div>

<div class="links">
<a href="https://github.com/modelcontextprotocol/example-remote-server" class="link-button">
<svg width="20" height="20" viewBox="0 0 24 24" fill="currentColor">
<path d="M12 0c-6.626 0-12 5.373-12 12 0 5.302 3.438 9.8 8.207 11.387.599.111.793-.261.793-.577v-2.234c-3.338.726-4.033-1.416-4.033-1.416-.546-1.387-1.333-1.756-1.333-1.756-1.089-.745.083-.729.083-.729 1.205.084 1.839 1.237 1.839 1.237 1.07 1.834 2.807 1.304 3.492.997.107-.775.418-1.305.762-1.604-2.665-.305-5.467-1.334-5.467-5.931 0-1.311.469-2.381 1.236-3.221-.124-.303-.535-1.524.117-3.176 0 0 1.008-.322 3.301 1.23.957-.266 1.983-.399 3.003-.404 1.02.005 2.047.138 3.006.404 2.291-1.552 3.297-1.23 3.297-1.23.653 1.653.242 2.874.118 3.176.77.84 1.235 1.911 1.235 3.221 0 4.609-2.807 5.624-5.479 5.921.43.372.823 1.102.823 2.222v3.293c0 .319.192.694.801.576 4.765-1.589 8.199-6.086 8.199-11.386 0-6.627-5.373-12-12-12z"/>
</svg>
GitHub Repository
</a>
<a href="https://modelcontextprotocol.io" class="link-button secondary">
MCP Documentation
</a>
<a href="https://modelcontextprotocol.io/specification" class="link-button secondary">
Protocol Specification
</a>
</div>
</div>

<footer>
<p>
Built by the <a href="https://modelcontextprotocol.io">Model Context Protocol</a> team
as a reference implementation for the MCP ecosystem.
</p>
</footer>
</body>
</html>
Loading