原文核对:2026-10-13 · 中文正文 · 英文提示词与演示
场景定位
围绕一个明确用户结果,定义工具、搭建 MCP 服务和可选 widget,在 ChatGPT 中连接验证并迭代。
- 难度
- 高级
- 时间跨度
- 1 小时
适合用于
- 规划首个 ChatGPT 应用。
- 适度搭建 MCP 服务、工具元数据和 widget。
- 从本地 HTTPS 测试到 ChatGPT 自定义 MCP 验证的紧密循环。
相关工具
规划工具、连接 MCP 资源并遵循当前构建流程。
ChatGPT Apps ↗编码或选架构前获取官方 Apps SDK 指南。
OpenAI Docs ↗通过精选技能和官方 MCP 获取 Vercel 生态指导。
Vercel ↗起步提示词
英文原文 · 可复制后按实际材料修改
Use $chatgpt-apps with $openai-docs to plan a ChatGPT app for [use case] in this repo.
Requirements:
- Start with one core user outcome.
- Propose 3-5 tools with clear names, descriptions, inputs, and outputs.
- Recommend whether v1 needs a widget or can start data-only.
- Prefer TypeScript for the MCP server and React for the widget.
- Call out auth, deployment, and test requirements.
Output:
- Tool plan
- Proposed file tree
- Golden prompt set
- Risks and open questions构建什么
MCP 插件有三个部分:
- MCP 服务:定义工具、返回数据、执行认证并指向 UI 资源。
- 可选 Web 组件:在 ChatGPT iframe 中渲染,可用 React 或原生 HTML/CSS/JavaScript。
- 模型:根据元数据决定何时调用工具。
Codex 可承担这些重复工程工作:
- 规划工具接口与元数据。
- 搭建服务和 widget。
- 连接本地运行脚本。
- 分阶段加入认证和部署修改。
- 编写证明插件在 ChatGPT 中可用的验证循环。
为何适合 Codex
- 服务、可选 UI 和模型调用可以清晰拆分。
- 明确、受控且易验证的任务适合 Codex。
- 技能和 AGENTS.md 提供可复用指令与项目规则。
安装用法参阅技能文档。
使用方法
前置条件
- 先解决一个用户核心需求。
- 提前选择 TypeScript/Python 服务端,以及 React 或轻量原生 widget。
- 确定 ngrok、Cloudflare Tunnel 等开发 HTTPS 路径。
- 部分设置仍沿用旧连接名称,本地测试时将其理解为已注册 MCP 服务。
- 围绕一个结果提出 3–5 个名称、描述、输入输出明确的工具。
- 决定首版仅数据还是需要 widget,优先沿用仓库模式再添加依赖。
- 本地 HTTPS 运行,通过 Add custom MCP server 连接,在 ChatGPT 测试直接、间接和负面提示词。
- 迭代元数据、状态、structuredContent 与 _meta,直到核心读取稳定。
- 仅用户专属数据或写操作需要时加入 OAuth 2.1,避免复杂化匿名只读路径。
- 准备稳定 /mcp 托管预览,验证流式传输和 UI 资源,分享或提交前审阅上线清单。
提示词示例
有效提示词应包含:
- 明确用户结果。
- 具体服务端与 widget 技术栈。
- 小型工具集,每个工具职责单一。
- 匿名首版或关联账号、写入的认证要求。
- 用于 ChatGPT 测试的 HTTPS 隧道或托管路径。
- 应运行的命令、测试提示词和返回证据。
将规划、实现、认证、部署、提交和打磨拆成小里程碑,不要一次要求全部完成。
先规划插件
官方提示词
英文原文 · 可复制后按实际材料修改
Use $chatgpt-apps with $openai-docs to plan an MCP-backed plugin for [use case] in this repo.
Requirements:
- Start with one core user outcome.
- Propose 3-5 tools with clear names, descriptions, inputs, and outputs.
- Recommend whether v1 needs a widget or can start data-only.
- Prefer TypeScript for the MCP server and React for the widget.
- Call out auth, deployment, and test requirements.
Output:
- Tool plan
- Proposed file tree
- Golden prompt set
- Risks and open questions搭建首个可运行版本
官方提示词
英文原文 · 可复制后按实际材料修改
Use $chatgpt-apps with $openai-docs to scaffold the first version of this MCP-backed plugin.
Stack:
- TypeScript MCP server
- React widget
- Vite build
- Local HTTPS via ngrok
Constraints:
- Keep the plugin narrow: one read flow and at most one write flow.
- Return concise structuredContent for the model and reserve widget-only data for _meta.
- Make tool handlers idempotent.
- Reuse existing repo patterns before adding dependencies.
Verification:
- Start the local server
- Explain how to connect the MCP server in ChatGPT using Add custom MCP server
- List the exact prompts to test核心流程可用后再加认证
官方提示词
英文原文 · 可复制后按实际材料修改
Use $chatgpt-apps with $openai-docs to add auth to this plugin's MCP server.
Requirements:
- Keep read-only tools anonymous if possible.
- Add OAuth 2.1 only for user-specific data or write actions.
- Use an existing identity provider such as Auth0 or Stytch.
- Document scopes, token checks, and the custom MCP server test flow in ChatGPT.
Output:
- Auth flow summary
- Server changes
- Required environment variables
- End-to-end test plan准备部署与审查
官方提示词
英文原文 · 可复制后按实际材料修改
Use $chatgpt-apps with $openai-docs and @vercel to prepare this plugin for a hosted preview.
Requirements:
- Expose a stable HTTPS /mcp endpoint.
- Keep streaming responses working on /mcp.
- Host widget assets correctly.
- Add a launch-readiness checklist covering metadata, tool hints, privacy, and test prompts.
Output:
- Deployment plan
- Preview URL or hosting steps
- Review checklist
- Remaining risks上线准备
- 用户能理解一个明确结果。
- 工具少且元数据、输入输出明确。
- MCP 端到端可用,structuredContent 简洁,widget 专属数据保留在 _meta。
- 需要的 widget 在 ChatGPT 正确渲染。
- 自定义 MCP 已连接,本地 HTTPS 测试循环可用。
- 直接、间接和负面提示词的对话及工具数据符合预期。
- 仅必要的数据或写操作加入认证。
- 分享提交前审阅部署、元数据、工具提示、隐私和测试提示词。
常见问题
- 不要一次移植整个产品;先做一个结果、3–5 个工具和窄范围 widget。
- 避免巨大实现提示词;拆成规划、搭建、认证、部署、审阅。
- 先明确工具契约与响应 schema,再写 UI。
- 结合 $chatgpt-apps 和 $openai-docs 获取当前官方依据。
- 尽早编写工具描述和参数文档,并回放提示词验证。
- 先证明匿名或只读路径可用,再为必要工具加入 OAuth。
- 完成前必须在 ChatGPT 连接服务,检查工具数据和真实对话流程。
技术栈
展开英文原文对照
Build one narrow ChatGPT app outcome end to end: define the tools, scaffold the MCP server and optional widget, connect it in ChatGPT, and iterate until the core flow works.
What you build
Every MCP-backed plugin has three parts:
- An MCP server that defines tools, returns data, enforces auth, and points ChatGPT at any UI resources.
- An optional web component that renders inside a ChatGPT iframe. You can build it with React or with plain HTML, CSS, and JavaScript.
- A model that decides when to call the plugin’s tools based on the metadata you provide.
Codex is most useful when it owns the repetitive engineering work around those parts:
- Planning the tool surface and metadata.
- Scaffolding the server and widget.
- Wiring local run scripts.
- Adding auth and deployment changes in focused passes.
- Writing the verification loop that proves the plugin works in ChatGPT.
Why Codex is a strong fit
- MCP-backed plugins split cleanly into a server, optional UI, and model-driven tool calls.
- Codex prompting works best when the task is explicit, scoped, and straightforward to verify, which matches plugin-building work well.
- Skills and AGENTS.md give Codex the reusable instructions and project rules it needs to stay grounded.
To learn more about how to install and use skills, see our skills documentation.
How to use
Prerequisites
- Start with one core user outcome instead of trying to port an entire product into chat.
- Choose the stack up front: TypeScript or Python for the server, and React or plain HTML, CSS, and JavaScript for the widget.
- Decide what HTTPS path you will use during development, such as ngrok or Cloudflare Tunnel.
- Some settings still use older terms for an MCP server connection. During local testing, treat those labels as referring to the registered server.
- Start with one narrow plugin outcome and ask Codex to propose three to five tools with clear names, descriptions, inputs, and outputs.
- Decide whether v1 can stay data-only or needs a widget, then scaffold the MCP server and optional widget using existing repository patterns before adding dependencies.
- Run the MCP server locally behind HTTPS, connect it in ChatGPT with Add custom MCP server, and test it with a small direct, indirect, and negative prompt set.
- Iterate on metadata, state handling, structuredContent, and _meta payloads until the core read flow behaves reliably inside ChatGPT.
- Add OAuth 2.1 only when user-specific data or write actions require it, without complicating anonymous or read-only flows.
- Prepare a hosted preview with a stable /mcp endpoint, verify streaming and UI asset hosting, and review the launch checklist before sharing or submitting the plugin.
Suggested prompts
Strong prompts for this workflow share the same ingredients:
- One clear outcome: say what the plugin should help the user do inside ChatGPT.
- A concrete stack: say whether you want TypeScript or Python on the server, and whether the widget should use React or stay lightweight.
- Explicit tool boundaries: ask Codex to propose or build a small set of tools with one job per tool.
- Auth expectations: state whether the first version can be anonymous or whether it needs linked accounts and write actions.
- A local development path: mention the tunnel or hosting path you expect for HTTPS testing in ChatGPT.
- Verification steps: tell Codex what commands to run, what prompts to test, and what evidence to report back.
Avoid one giant prompt that asks for planning, implementation, auth, deployment, submission, and polish in one pass. Split the work into smaller milestones instead.
Plan the Plugin Before You Scaffold It
官方提示词
英文原文 · 可复制后按实际材料修改
Use $chatgpt-apps with $openai-docs to plan an MCP-backed plugin for [use case] in this repo.
Requirements:
- Start with one core user outcome.
- Propose 3-5 tools with clear names, descriptions, inputs, and outputs.
- Recommend whether v1 needs a widget or can start data-only.
- Prefer TypeScript for the MCP server and React for the widget.
- Call out auth, deployment, and test requirements.
Output:
- Tool plan
- Proposed file tree
- Golden prompt set
- Risks and open questionsScaffold the First Working Version
官方提示词
英文原文 · 可复制后按实际材料修改
Use $chatgpt-apps with $openai-docs to scaffold the first version of this MCP-backed plugin.
Stack:
- TypeScript MCP server
- React widget
- Vite build
- Local HTTPS via ngrok
Constraints:
- Keep the plugin narrow: one read flow and at most one write flow.
- Return concise structuredContent for the model and reserve widget-only data for _meta.
- Make tool handlers idempotent.
- Reuse existing repo patterns before adding dependencies.
Verification:
- Start the local server
- Explain how to connect the MCP server in ChatGPT using Add custom MCP server
- List the exact prompts to testAdd Auth Only After the Core Flow Works
官方提示词
英文原文 · 可复制后按实际材料修改
Use $chatgpt-apps with $openai-docs to add auth to this plugin's MCP server.
Requirements:
- Keep read-only tools anonymous if possible.
- Add OAuth 2.1 only for user-specific data or write actions.
- Use an existing identity provider such as Auth0 or Stytch.
- Document scopes, token checks, and the custom MCP server test flow in ChatGPT.
Output:
- Auth flow summary
- Server changes
- Required environment variables
- End-to-end test planPrepare the Plugin for Deployment and Review
官方提示词
英文原文 · 可复制后按实际材料修改
Use $chatgpt-apps with $openai-docs and @vercel to prepare this plugin for a hosted preview.
Requirements:
- Expose a stable HTTPS /mcp endpoint.
- Keep streaming responses working on /mcp.
- Host widget assets correctly.
- Add a launch-readiness checklist covering metadata, tool hints, privacy, and test prompts.
Output:
- Deployment plan
- Preview URL or hosting steps
- Review checklist
- Remaining risksLaunch readiness
- The plugin has one narrow outcome that users can understand.
- The tool set stays small and has explicit metadata, inputs, and outputs.
- The MCP server works end to end and returns concise structuredContent, reserving widget-only data for _meta.
- The widget, if needed, renders correctly inside ChatGPT.
- A local HTTPS testing loop works with the custom MCP server connected in ChatGPT.
- A small direct, indirect, and negative prompt set passes with the expected conversation flow and tool payloads.
- Auth is added only where user-specific data or write actions require it.
- A deployment plan and launch-readiness review cover metadata, tool hints, privacy, and test prompts before the plugin is shared or submitted.
Common pitfalls
- Asking Codex to port the whole product into ChatGPT. Better move: ask for one core user outcome, three to five tools, and one narrow widget.
- Starting with a giant implementation prompt. Better move: split the work into planning, scaffold, auth, deployment, and review passes.
- Writing UI before the tool contract is clear. Better move: plan the tool surface and response schema first, then build the widget.
- Skipping official docs grounding. Better move: pair $chatgpt-apps with $openai-docs so the scaffold follows current plugin guidance.
- Treating metadata as an afterthought. Better move: write tool descriptions and parameter docs early, then replay a prompt set against them.
- Adding auth before proving the anonymous or read-only path. Better move: get the core tool flow working first, then add OAuth for the tools that actually need it.
- Declaring the plugin done before testing inside ChatGPT. Better move: connect the custom MCP server in ChatGPT, inspect tool payloads, and verify the real conversation flow.