Implementing Streamable HTTP MCP Server with Browser-based OAuth
LocalAbout Implementing Streamable HTTP MCP Server with Browser-based OAuth
A Streamable HTTP server project demonstrating authorization for MCP clients. It uses browser-based GitHub OAuth and handles requests that carry valid access tokens.
Key features
- 01Streamable HTTP server
- 02Browser-based GitHub OAuth authorization
- 03Access token verification
- 04Handle client requests by session
Use cases
- 01Build an MCP server with GitHub sign-in
- 02Add OAuth authorization for client requests
- 03Handle requests with session identifiers
MCP support
The MCP server receives client requests over Streamable HTTP and implements `/authorize` and `/token` authorization endpoints.
Configuration
Local server config is the same for every client. Copy it into your client’s MCP config file.
Tools
Local servers expose tools only once running on your machine, and the maintainer has not provided a tool list.
Details
From the project READMEImplementing Streamable HTTP MCP Server with Browser-based OAuth
Overview
The purpose of this project is to support MCP Client requested authorization through the MCP Server. This requires implementing a custom OAuthProvider for GitHub.
As such, this project provides:
- An StreamableHTTP Server
- Browser-based client authorization using GitHub's OAuth
- Handling authorized client requests
High-level Execution Flow
The flow proceeds as follows:
- The client sends POST request to /mcp endpoint.
- The server verifies the access token included in the Authorization header. If it's expired (or not recognized), server returns an error. If the access token is valid, the server proceeds to the next step.
- If the client request contains a valid sessionId, the server uses an existing transport connection. If not, it creates a transport connection with a new sessionId. The server uses the transport connection to handle the request.
Authorization
The server receives client requests for authorization through the /authorize and /token endpoints. These are supported through a class that implements the OAuthServerProvider.
For requests to the /authorize endpoint, the server auth provider:
- Generates the PKCE verifier and challenge
- Redirects to the GitHub OAuth endpoint (GITHUB_CLIENT_ID and GITHUB_CLIENT_SECRET env variables must be set)
- As part of the callback,
- uses the code returned in callback to fetche its access token from GitHub
- stores this access token along with the clientId
- generates a new auth code and returns this to the client
When the client hits the /token endpoint with this auth code, the server provides the client it's own access token.
How to use
- Clone this repository
- Install the dependencies
npm install - Go to your Developer Settings on GitHub (under Settings) and create an OAuth app. Note the Client ID and Client Secret.
- Set the GITHUB_CLIENT_ID and GITHUB_CLIENT_SECRET environment variables in your local dev environment.
- Start the MCP Server
npx tsx server/index_streamable.ts
Comments
New to MCP?
From what the protocol is to installing your first server, these answers cover most first questions.
An open protocol that defines how AI applications connect to external tools and data in a uniform way. Clients talk to the model; MCP servers provide tools, resources and prompt templates. They exchange standard messages, so one server can be reused by many clients.