feat: add new exercises for token management and scopes, including problem and solution implementations

Author: kentcdodds

epicshop/epic-me/workers/app.ts

@@ -38,7 +38,6 @@ export default {
 					'Access-Control-Allow-Origin': '*',
 					'Access-Control-Allow-Methods': 'GET, HEAD, OPTIONS',
 					'Access-Control-Allow-Headers': 'mcp-protocol-version',
-					'Cross-Origin-Resource-Policy': 'cross-origin',
 				}
 			}
 		},

exercises/01.discovery/01.problem.cors/src/index.ts

@@ -9,6 +9,8 @@ import { getClient } from './client.ts'
 import { initializePrompts } from './prompts.ts'
 import { initializeResources } from './resources.ts'
 import { initializeTools } from './tools.ts'
+// 💰 you'll need this:
+// import { withCors } from './utils.ts'
 
 type State = { loggingLevel: LoggingLevel }
 
@@ -55,6 +57,12 @@ You can also help users add tags to their entries and get all tags for an entry.
 }
 
 export default {
+	// 🐨 wrap the fetch handler as the "handler" option in a withCors function call
+	//   🐨 the getCorsHeaders function should accept the request
+	//   🐨 if the request url includes '/.well-known' then we want to return an object of headers with the following properties:
+	//     'Access-Control-Allow-Origin': '*' // <-- we don't know all origins that may want this metadata and we're fine with any origin requesting it
+	//     'Access-Control-Allow-Methods': 'GET, HEAD, OPTIONS' // <-- these methods are the only ones we support for this endpoint
+	//     'Access-Control-Allow-Headers': 'mcp-protocol-version' // <-- according to the spec, all requests made by clients should include this header, some clients may or may not include it, but it's harmless to allow so we'll do that
 	fetch: async (request, env, ctx) => {
 		const url = new URL(request.url)
 

exercises/01.discovery/01.solution.cors/src/index.ts

@@ -63,7 +63,6 @@ export default {
 					'Access-Control-Allow-Origin': '*',
 					'Access-Control-Allow-Methods': 'GET, HEAD, OPTIONS',
 					'Access-Control-Allow-Headers': 'mcp-protocol-version',
-					'Cross-Origin-Resource-Policy': 'cross-origin',
 				}
 			}
 		},

exercises/01.discovery/02.problem.as/src/auth.ts

@@ -0,0 +1,7 @@
+// 💰 you'll need this:
+// import { EPIC_ME_AUTH_SERVER_URL } from './client.ts'
+
+// 🐨 export an async function called handleOAuthAuthorizationServerRequest
+// 🐨 it should construct a URL pointing to `/.well-known/oauth-authorization-server` on the auth server
+// 🐨 then make a fetch request to that URL
+// 🐨 then return the response body as a JSON object

exercises/01.discovery/02.problem.as/src/index.ts

@@ -5,6 +5,8 @@ import {
 	type LoggingLevel,
 } from '@modelcontextprotocol/sdk/types.js'
 import { McpAgent } from 'agents/mcp'
+// 💰 you'll need this:
+// import { handleOAuthAuthorizationServerRequest } from './auth.ts'
 import { getClient } from './client.ts'
 import { initializePrompts } from './prompts.ts'
 import { initializeResources } from './resources.ts'
@@ -63,13 +65,15 @@ export default {
 					'Access-Control-Allow-Origin': '*',
 					'Access-Control-Allow-Methods': 'GET, HEAD, OPTIONS',
 					'Access-Control-Allow-Headers': 'mcp-protocol-version',
-					'Cross-Origin-Resource-Policy': 'cross-origin',
 				}
 			}
 		},
 		handler: async (request, env, ctx) => {
 			const url = new URL(request.url)
 
+			// 🐨 if the url.pathname is '/.well-known/oauth-authorization-server'
+			// then call and return the result of handleOAuthAuthorizationServerRequest
+
 			if (url.pathname === '/mcp') {
 				const mcp = EpicMeMCP.serve('/mcp', {
 					binding: 'EPIC_ME_MCP_OBJECT',

exercises/01.discovery/02.solution.as/src/index.ts

@@ -64,7 +64,6 @@ export default {
 					'Access-Control-Allow-Origin': '*',
 					'Access-Control-Allow-Methods': 'GET, HEAD, OPTIONS',
 					'Access-Control-Allow-Headers': 'mcp-protocol-version',
-					'Cross-Origin-Resource-Policy': 'cross-origin',
 				}
 			}
 		},

exercises/01.discovery/03.problem.pr/src/auth.ts

@@ -1,5 +1,12 @@
 import { EPIC_ME_AUTH_SERVER_URL } from './client.ts'
 
+// 🐨 export an async function called handleOAuthProtectedResourceRequest
+// 🐨 it should construct a URL pointing to `/mcp` on the current server
+// 💰 you can accept a request parameter and use request.url to get the URL of the current server
+// 🐨 then return a JSON response (💰 Response.json) with the following properties:
+//   🐨 resource: the URL you constructed above
+//   🐨 authorization_servers: an array with a single string value of the auth server URL
+
 /**
  * Handles requests for OAuth authorization server metadata.
  * Fetches the metadata from the auth server and forwards it to the client.

exercises/01.discovery/03.problem.pr/src/index.ts

@@ -5,7 +5,11 @@ import {
 	type LoggingLevel,
 } from '@modelcontextprotocol/sdk/types.js'
 import { McpAgent } from 'agents/mcp'
-import { handleOAuthAuthorizationServerRequest } from './auth.ts'
+import {
+	handleOAuthAuthorizationServerRequest,
+	// 💰 you'll need this:
+	// handleOAuthProtectedResourceRequest
+} from './auth.ts'
 import { getClient } from './client.ts'
 import { initializePrompts } from './prompts.ts'
 import { initializeResources } from './resources.ts'
@@ -64,7 +68,6 @@ export default {
 					'Access-Control-Allow-Origin': '*',
 					'Access-Control-Allow-Methods': 'GET, HEAD, OPTIONS',
 					'Access-Control-Allow-Headers': 'mcp-protocol-version',
-					'Cross-Origin-Resource-Policy': 'cross-origin',
 				}
 			}
 		},
@@ -76,6 +79,9 @@ export default {
 				return handleOAuthAuthorizationServerRequest()
 			}
 
+			// 🐨 if the url.pathname is '/.well-known/oauth-protected-resource/mcp'
+			// then call and return the result of handleOAuthProtectedResourceRequest
+
 			if (url.pathname === '/mcp') {
 				const mcp = EpicMeMCP.serve('/mcp', {
 					binding: 'EPIC_ME_MCP_OBJECT',

exercises/01.discovery/03.solution.pr/src/index.ts

@@ -67,7 +67,6 @@ export default {
 					'Access-Control-Allow-Origin': '*',
 					'Access-Control-Allow-Methods': 'GET, HEAD, OPTIONS',
 					'Access-Control-Allow-Headers': 'mcp-protocol-version',
-					'Cross-Origin-Resource-Policy': 'cross-origin',
 				}
 			}
 		},

exercises/01.discovery/README.mdx

@@ -1 +1,3 @@
 # Metadata Discovery
+
+NOTE: Make sure to talk about the relationship between auth server and resource server.