公开 API 小工具练习:先设计,再请求
公开 API 小工具适合练“请求、展示、失败提示”。关键不是找最酷的 API,而是找一个新手能安全请求的 API。
- public-apis/public-apis:公开 API 清单。练习前要重新确认 API 是否免费、是否需要认证、是否仍可用。
今天只做一件事
Section titled “今天只做一件事”选一个不需要认证、支持 HTTPS、浏览器能请求的 API,设计一个最小查询页面。先不接真实付费服务,不做登录,不写后端。
先准备输入材料
Section titled “先准备输入材料”- API 候选链接。
- API 在 public-apis 里的 Auth、HTTPS、CORS 标记。
- 你想做的一个查询动作,例如按关键词搜索、按 ID 查询、随机返回一条结果。
- 页面需要展示的 3 个以内字段。
- 请求失败时给用户看的提示文案。
如果 API 要求 API Key、OAuth、付费账号、复杂注册,先换一个更简单的候选。
第一步:筛 API 提示词
Section titled “第一步:筛 API 提示词”请从 public-apis 里帮我挑一个适合新手的小 API。
要求:1. 优先免费2. 优先不需要认证3. 必须支持 HTTPS4. 优先支持浏览器 CORS5. 请求方式简单6. 返回结果能做成一个小页面7. 请求失败时能给用户明确提示
请输出:1. API 名称和链接2. public-apis 里标注的 Auth、HTTPS、CORS3. 是否需要 API Key、OAuth、账号或付费计划4. 最小页面应该包含哪些输入和输出5. 应该请求哪个接口6. 失败时页面应该怎么提示7. 实现前还需要我打开哪个官方 API 文档确认
先给方案,不要直接写代码,不要替我注册账号。第二步:写最小页面提示词
Section titled “第二步:写最小页面提示词”确认 API 候选后,再让 AI 写最小页面。
请基于刚才确认的 API,设计一个最小查询页面。先给文件计划,不要直接改代码。
页面目标:{例如按关键词搜索公开艺术品资料}API 链接:{官方 API 文档链接}认证情况:不需要认证 / 需要 API Key / 不确定我的项目类型:纯 HTML / Astro / React / 其他
请输出:1. 页面包含哪些输入2. 页面展示哪些输出字段,最多 3 个3. 加载中、成功、失败、无结果四种状态怎么显示4. 需要修改哪些文件5. 是否会把 API Key 暴露到前端6. 如何手动验证
约束:- 不要接付费服务- 不要把 API Key 写进前端代码- 不要一次接多个 API- 不要做登录、收藏、数据库- 默认只做一个页面推荐练习形态
Section titled “推荐练习形态”优先做“只查一次、展示少量字段”的页面:
- 搜索公开艺术品资料:输入关键词,输出标题、作者、图片。
- 查询公开汇率或地区数据:输入一种代码,输出一个结果和更新时间。
- 查询公开文本或开发者资料:输入关键词,输出名称、链接、摘要。
不要从金融交易、医疗、身份认证、支付、生产告警类 API 开始。它们要么高变动,要么风险边界不适合新手。
- API 要求把 Key 放进前端页面。
- API 文档只写“免费试用”,但没说额度和费用。
- public-apis 标注 CORS 为
No或Unknown,而你只会写前端页面。 - 请求失败时 AI 只写
console.log,页面没有提示。 - AI 建议一次聚合多个 API。
- AI 开始加登录、数据库、部署和支付。
- 你知道 API 是否需要认证。
- 你知道 HTTPS 和 CORS 是否适合前端直接请求。
- 页面只做一个查询动作。
- 有加载中、成功、失败、无结果四种状态。
- 失败提示不是空白页。
- 不在前端暴露 API Key。
- 选了需要复杂注册或付费的 API。
- 直接把 API Key 写进前端代码。
- 没有处理请求失败。
- 一次做多个 API 聚合,范围过大。
完成这个页面后,再用 代码审查提示词 检查是否泄露 Key、是否缺失败状态。如果你准备把它部署到公网,先确认 API 服务条款和调用额度。
- 来源:public-apis/public-apis。
- 分享日期:2026-06-16。
- 复测日期:2026-06-16。