# gadget-chatgpt-apps-sdk-guide-2025-10-10

## Veille

ChatGPT Apps SDK Development Guide (OpenAI) - MCP, OAuth 2.1, Widgets

## Titre Article

Everything you need to know about building ChatGPT apps

## Date

2025-10-10

## URL

https://gadget.dev/blog/everything-you-need-to-know-about-building-chatgpt-apps

## Keywords

ChatGPT Apps, OpenAI SDK, MCP, Model Context Protocol, OAuth 2.1, Widgets, CORS, Vite, window.openai, Streamable HTTP, iframes, application development

## Authors

Harry (Gadget)

## Ton

**Profile**: First-hand technical experience report, casual yet expert register, high technical level.

**Description**: The author shares experience gained "hot-off-the-presses" after several days of intensive development on the ChatGPT Apps SDK. The tone is that of a developer addressing peers, blending humor ("Cross Origin Emotional Damage", "boy oh boy are we early") with sharp technical expertise. The article takes the stance of a practical guide, sharing the pitfalls encountered and the solutions found. The author does not hesitate to criticize the shortcomings of OpenAI's official documentation while offering concrete alternatives. Target audience: experienced developers looking to build ChatGPT applications.

## Pense-betes

- A ChatGPT App = MCP server + UI extension (widgets) + optionally OAuth 2.1/OIDC
- Prefer `StreamableHTTPServerTransport` over the SSE version in OpenAI's examples
- The official examples use an in-memory session map that does not work in serverless
- Use the MCP Inspector to debug before ChatGPT (ChatGPT error messages are not informative)
- OAuth 2.1: you are the **provider**, not the client - a reversal of the usual model
- Widgets are sandboxed iframes with static HTML (no SSR possible)
- Vite recommended for developing widgets (TypeScript, Tailwind, HMR)
- `window.openai` allows calling MCP tools from the widget with auth included for free
- Alternative: direct `fetch` but loses auth and LLM visibility into interactions
- CORS: configuration required for MCP, OAuth 2.1 and frontend assets
- Widget origin: `https://web-sandbox.oaiusercontent.com`
- Vite plugin for ChatGPT Widgets available on Gadget's GitHub

## RésuméDe400mots

The Gadget team shares its experience report after several days of intensive development on OpenAI's new ChatGPT Apps SDK. The article details the three essential components of a ChatGPT application: an MCP server compliant with the Model Context Protocol, an extension enabling user interfaces to be displayed within conversations, and optionally an OAuth 2.1 server with OIDC for authentication.

For building MCP servers, the article recommends using the Streamable HTTP transport rather than the SSE version presented in OpenAI's official examples. The provided examples use an in-memory session map that is unsuited to serverless platforms. The MCP Inspector is recommended for initial debugging, since ChatGPT's error messages are not very informative.

Implementing OAuth 2.1 authentication represents a paradigm shift: unlike the usual practice of redirecting to an external provider such as Google, here the application itself must act as the OAuth provider for OpenAI. This requires implementing the OIDC discovery endpoints that allow ChatGPT to obtain tokens.

The most innovative feature is the ability to serve interactive UI widgets to users. These widgets are in fact sandboxed iframes that load a static HTML document, cached at application installation time. This constraint mandates the development of client-side single-page applications, with no dynamic server-side rendering. The team recommends Vite for TypeScript compilation, bundling, hot-module-reloading and Tailwind support. A dedicated Vite plugin is available on GitHub.

For communication with the backend from a widget, two approaches exist. The `window.openai` object injected by OpenAI allows MCP tools to be called with authentication handled automatically and visibility for the LLM into the interactions. The alternative via direct `fetch` requires handling authentication manually and loses the LLM's contextual awareness.

CORS is a major challenge, with three distinct configurations to manage: MCP routes, OAuth 2.1 routes, and frontend assets. For the first two, a permissive `Access-Control-Allowed-Origin: *` header is recommended, since authentication already secures the calls. For widget assets, the origin `https://web-sandbox.oaiusercontent.com` used by OpenAI must be allowed.

The article concludes that the ecosystem is still very young but promising, with ready-to-use templates available at Gadget to accelerate getting started.

## GrapheDeConnaissance

- Gadget —publie→ guide ChatGPT Apps SDK (DOCUMENT, 0.98)
- Harry Brundage —publie→ guide ChatGPT Apps SDK (DOCUMENT, 0.95)
- ChatGPT App —est_basé_sur→ MCP server (TECHNOLOGIE, 0.98)
- ChatGPT App —utilise→ OAuth 2.1 (TECHNOLOGIE, 0.97)
- ChatGPT App —utilise→ widgets iframes (CONCEPT, 0.97)
- Gadget —recommande→ StreamableHTTPServerTransport (TECHNOLOGIE, 0.95)
- OpenAI —publie→ ChatGPT Apps SDK (TECHNOLOGIE, 0.98)
- ChatGPT Apps SDK —utilise→ OAuth 2.1 (CONCEPT, 0.95)
- Vite —améliore→ développement widgets ChatGPT (METHODOLOGIE, 0.92)
- window.openai —permet→ authentification gratuite (CONCEPT, 0.93)
- CORS —s_oppose_à→ développement ChatGPT Apps (CONCEPT, 0.9)
- MCP Inspector —améliore→ débogage MCP (METHODOLOGIE, 0.92)
- Gadget —s_oppose_à→ OpenAI (CONCEPT, 0.88)

---
Canonical: https://www.thekb.eu/en/fiches/gadget-chatgpt-apps-sdk-guide-2025-10-10/