feat: requests logs and timestamps

Author: pietrozullo

packages/mcp-use/src/server/logging.ts

@@ -0,0 +1,50 @@
+import type { Request, Response, NextFunction } from 'express'
+
+/**
+ * Request logging middleware with timestamp, colored status codes, and MCP method info
+ * 
+ * Logs all HTTP requests with:
+ * - Timestamp in HH:MM:SS.mmm format
+ * - HTTP method and endpoint in bold
+ * - MCP method name in brackets for POST requests to /mcp
+ * - Color-coded status codes (green 2xx, yellow 3xx, red 4xx, magenta 5xx)
+ * 
+ * @param req - Express request object
+ * @param res - Express response object  
+ * @param next - Express next function
+ */
+export function requestLogger(req: Request, res: Response, next: NextFunction): void {
+  const timestamp = new Date().toISOString().substring(11, 23)
+  const method = req.method
+  const url = req.url
+  
+  // Override res.end to capture status code
+  const originalEnd = res.end.bind(res)
+  res.end = function(chunk?: any, encoding?: any, cb?: any) {
+    const statusCode = res.statusCode
+    let statusColor = ''
+    
+    if (statusCode >= 200 && statusCode < 300) {
+      statusColor = '\x1b[32m' // Green for 2xx
+    } else if (statusCode >= 300 && statusCode < 400) {
+      statusColor = '\x1b[33m' // Yellow for 3xx
+    } else if (statusCode >= 400 && statusCode < 500) {
+      statusColor = '\x1b[31m' // Red for 4xx
+    } else if (statusCode >= 500) {
+      statusColor = '\x1b[35m' // Magenta for 5xx
+    }
+    
+    // Add MCP method info for POST requests to /mcp
+    let logMessage = `[${timestamp}] ${method} \x1b[1m${url}\x1b[0m`
+    if (method === 'POST' && url === '/mcp' && req.body?.method) {
+      logMessage += ` \x1b[1m[${req.body.method}]\x1b[0m`
+    }
+    logMessage += ` ${statusColor}${statusCode}\x1b[0m`
+    
+    console.log(logMessage)
+    
+    return originalEnd(chunk, encoding, cb)
+  }
+  
+  next()
+}

packages/mcp-use/src/server/mcp-server.ts

@@ -9,6 +9,7 @@ import { z } from 'zod'
 import express, { type Express } from 'express'
 import { existsSync, readdirSync } from 'node:fs'
 import { join } from 'node:path'
+import { requestLogger } from './logging.js'
 
 export class McpServer {
   private server: OfficialMcpServer
@@ -45,6 +46,9 @@ export class McpServer {
       next()
     })
 
+    // Request logging middleware
+    this.app.use(requestLogger)
+
     // Setup default widget serving routes
     this.setupWidgetRoutes()
 
@@ -237,21 +241,16 @@ export class McpServer {
 
     // GET endpoint for SSE streaming
     this.app.get(endpoint, async (req, res) => {
-      console.log(`[MCP] GET ${endpoint}`)
       await httpTransport.handleRequest(req, res)
     })
 
     // POST endpoint for messages
     this.app.post(endpoint, express.json(), async (req, res) => {
-      const method = req.body?.method || 'unknown'
-      const id = req.body?.id || 'no-id'
-      console.log(`[MCP] POST ${endpoint} → ${method} (id: ${id})`)
       await httpTransport.handleRequest(req, res, req.body)
     })
 
     // DELETE endpoint for session cleanup
     this.app.delete(endpoint, async (req, res) => {
-      console.log(`[MCP] DELETE ${endpoint}`)
       await httpTransport.handleRequest(req, res)
     })