首个 ChatGPT 应用构建手册

30 分钟内做出第一个 app 的两条路径:

路径一:Replit + OpenAI 官方示例仓库——在 Replit 里 Import from GitHub 导入 openai/openai-apps-sdk-examples,让 Replit agent 花 5-10 分钟搭好项目,然后用固定话术让它把项目配置成可被 ChatGPT 连接的 MCP server(核心要点:①用 Vite 把 React 组件打包成独立的 widget bundle,BASE_URL 必须是完整的 Replit 域名绝对地址,因为 ChatGPT 在沙箱里加载 widget 需要能从你的服务器抓资源;②静态资源服务开 CORS,映射到外部 80 端口;③MCP server 绑定 0.0.0.0:8000 对外暴露;④两个服务都要 accept 任意来源的连接)。常见坑是端口配置错误、静态资源没伺服起来。搭好后问 agent 要外部 MCP endpoint URL。

路径二:Chippy(作者自建的 ChatGPT app 原型工具)——专门用来规划、预览、连接 ChatGPT app,可以先让它规划工具(如一个 find_lightning_lesson 工具),内置聊天做测试,再连接到 ChatGPT 而不用操心部署。

接入 ChatGPT 的通用步骤(两条路径共用):

1. 在 ChatGPT 账号里开启 Developer Mode。
2. Settings → Apps & Connectors → New App,填入名字和 MCP Server URL(无需 auth 也可以先跑通)。
3. 最可靠的测试方式是在对话里直接按名字提到你的 app,ChatGPT 会自动打上标签调用它。
4. 跑通后持续迭代,积累一组能稳定触发你的 app 的"黄金 prompt 集合"。

能力上限不止简单卡片:可以做到完整的复杂应用(作者用 Chippy 做了一个带游戏状态、能给出策略建议的地牢探索游戏)。

建成本参照:简单应用(搜索+展示结果)1-2 天就能上线;带多工具、状态管理、精细 UI 的复杂应用要几周。