MCP #34 | Connect Windsurf to a Remote MCP Server - Bearer Token Setup

Connect Windsurf Cascade to a remote MCP server over HTTPS using an ngrok tunnel and Bearer token authentication. Watch the complete workflow: configure the connection, discover 12 MCP tools, query live MySQL records, and compare the results with the web portal. This QuickFlow episode demonstrates a working remote MCP connection rather than a line-by-line coding tutorial. You'll see portfolio statistics and a Tokyo booking lookup, followed by an explanation of the request flow, backend code, and a copyable AI scaffold prompt. The demo exposes the QuickFlow backend through an HTTPS tunnel. Windsurf connects to the MCP endpoint; backend tools query the database and return records to Cascade. CHAPTERS 00:00 Connect Windsurf to remote MCP: what you'll see 00:11 Live preview: Cascade tools and database queries 01:20 Architecture: Windsurf, HTTPS tunnel, and MCP backend 01:47 Live workflow: MCP configuration, tool discovery, and data verification 05:16 End-to-end remote MCP request flow 05:33 Code walkthrough: serverUrl, Bearer header, routing, and authentication 06:23 Implementation checklist: 5 connection steps 06:35 Build it with AI: copyable scaffold prompt 06:46 Outro KEY WORKFLOW STEPS 1. Expose the QuickFlow MCP endpoint through an ngrok HTTPS tunnel. 2. Configure ~/.codeium/windsurf/mcp_config.json with serverUrl and an Authorization Bearer header. 3. Refresh the MCP connection in Cascade and check that the tools are available. 4. Run natural-language queries for portfolio statistics and booking details. 5. Compare the returned information with records displayed in the web portal. BUILD IT WITH AI Prompt shown in the video at 06:35. Copy it into your AI coding agent as a starting brief, then review the generated implementation and test it in your environment: "Scaffold a production-grade Remote Model Context Protocol (MCP) server for Windsurf IDE. Implement an HTTPS SSE route /mcp protected by Bearer token authentication. Provide the configuration schema for mcp_config.json with serverUrl and headers. Expose tools to safely query live database records." RESOURCES & CODE GitHub repository: https://github.com/quickflow-engine/q... Model Context Protocol: https://modelcontextprotocol.io Full MCP series:    • MCP Series | From Zero to Real-World AI Wo...   AI client connection guides:    • MCP Series | Connect AI Clients to Your Se...   QuickFlow explores practical software workflows through real experiments and observable results. Quick Starter, Master Flow. #Windsurf #MCP #Cascade #RemoteMCP #BearerAuth