Implementing Streamable HTTP MCP Server with Browser-based OAuth
About
MCP Streamable HTTP Server with Standard Browser OAuth
Details
- Author
- asibyl
- Downloads
- 435
- Categories
- Developer Tools
Jump to
- Streamable HTTP server with /mcp endpoint
- Browser-based GitHub OAuth authorization
- Custom PKCE challenge and verifier generation
- Access token verification and session management
- OAuthServerProvider implementation for extensibility
Setting up with Highlight
This MCP is not yet compatible with Highlight’s one-click setup. However, you can still use it with Highlight by following these steps:
- Download and install Highlight from highlightai.com/download
- Navigate to the plugins tab and select "Add Custom Plugin"
-
Configure the plugin with the settings below
Plugin Name
Implementing Streamable HTTP MCP Server with Browser-based OAuthCommand (node, npx, python, etc.)Please refer to the README for specific instructions on how to obtain API keys or other required environment variables.
- Enable "Start Automatically" if you want the plugin to start when Highlight launches
From the repository
Clone the repository, run npm install, set GITHUB_CLIENT_ID and GITHUB_CLIENT_SECRET environment variables, then start the server with npx tsx server/index.ts. Clients interact via POST to /mcp, /authorize, and /token endpoints.
Claude Desktop / Cursor
Paste into your MCP client config file to install this server.
{
"mcpServers": {
"implementing streamable http mcp server with browser-based oauth": {
"streamable-http-oauth": {
"command": "npx",
"args": [
"tsx",
"server/index_streamable.ts"
],
"env": {
"GITHUB_CLIENT_ID": "",
"GITHUB_CLIENT_SECRET": ""
}
}
}
}
}McpServers
{
"streamable-http-oauth": {
"command": "npx",
"args": [
"tsx",
"server/index_streamable.ts"
],
"env": {
"GITHUB_CLIENT_ID": "",
"GITHUB_CLIENT_SECRET": ""
}
}
}Implementing 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:
1. An StreamableHTTP Server
2. Browser-based client authorization using GitHub's OAuth
3. Handling authorized client requests
High-level Execution Flow
The flow proceeds as follows:
1. The client sends POST request to /mcp endpoint.
2. 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.
3. 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:
1. Generates the PKCE verifier and challenge
2. Redirects to the GitHub OAuth endpoint (GITHUB_CLIENT_ID and GITHUB_CLIENT_SECRET env variables must be set)
3. 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
1. Clone this repository
2. Install the dependencies npm install
3. Go to your Developer Settings on GitHub (under Settings) and create an OAuth app. Note the Client ID and Client Secret.
4. Set the GITHUB_CLIENT_ID and GITHUB_CLIENT_SECRET environment variables in your local dev environment.
5. Start the MCP Server npx tsx server/index_streamable.ts
Sign in to leave a review
Use Google, GitHub, or an email account so ratings stay tied to real people.
No reviews posted yet.
