第 3 关 · 你的第一个 AI 机器人

用 1 小时做一个能回答常见问题的机器人网页。你来准备答案和兜底方式，机器人负责先处理重复提问。

先看一个常见场景

大鹏做汽车销售。除了接待客户，他每天还要反复回答几类相同的问题：

“这车多少钱？""贷款怎么办？""保养贵不贵？“同一个问题一天可能出现二十遍，晚上也会有人在微信上追问。

他花了一个晚上，整理出客户最常问的问题和自己的标准回答，用 AI 做成一个”购车顾问机器人”，再把网页链接发到朋友圈。

机器人先回答已有问题，遇到资料里没有的内容就提示转人工。大鹏仍然要处理复杂情况，但不用再从头回答每个基础问题。他开玩笑说，自己多了一个”不会下班的助理”。

本关先不研究模型原理。你要整理可靠的问答，并明确机器人答不上来时该怎么办。

你要造什么

一个聊天机器人网页。别人打开链接、输入问题后，它会根据你提供的内容回答。

先邀请少量朋友、同事或客户测试，确认回答没有超出你设定的范围。

动手（1 小时）

第 1 步：想清楚机器人要会回答什么（5 分钟）

问自己：你最常被问到的问题是什么？

拿张纸，写下 5-10 个”你被问过最多的问题”和对应的答案。比如大鹏写的是：

问：这车落地多少钱？答：12.98 万起，含购置税，贷款首付 3 成。
问：保养一次多少钱？答：小保养 480，大保养 1200，首保免费。
问：可以试驾吗？答：可以，提前一天约，周末名额紧张。

这些问答决定了机器人能可靠处理哪些内容。答案写得具体，测试时就更容易判断它有没有答偏。

第 2 步：去 Google AI Studio 拿一个免费钥匙（5 分钟）

打开：

👉 https://aistudio.google.com/app/apikey

用你的 Google 账号登录，点 “Create API key”（创建 API 密钥），复制那串字符（形如 AIza...）。

🔑 这串字符相当于账号的”钥匙”，不要发给别人。使用前请查看页面显示的当前额度和限制。如果不小心泄露，立即回到这个页面删除旧密钥，再创建一枚新的。

第 3 步：让 AI 生成机器人网页（15 分钟）

回到 AI Studio 的对话界面（https://aistudio.google.com），新建对话，输入：

帮我做一个聊天机器人网页，只有一个 index.html 文件。
背景：我是一个【汽车销售】，想做一个自动回答客户常见问题的机器人。

1. 顶部标题："购车小助手"
2. 中间是一个聊天窗口，用户输入问题，机器人回答
3. 内置这些问答（把【】换成你自己的问题答案）：
   - 问：【这车落地多少钱】 答：【12.98 万起，含购置税，首付 3 成】
   - 问：【保养一次多少钱】 答：【小保养 480，大保养 1200，首保免费】
   - 问：【可以试驾吗】 答：【可以，提前一天预约，周末名额紧张】
   - 答不上来的问题，机器人礼貌地说"这个问题我记下了，稍后人工回复您"
4. 右上角有一个"设置"小按钮，点开可以填入 API Key（保存在浏览器本地，不会上传到任何服务器）
5. 机器人用 Gemini API（模型 gemini-2.5-flash）回答
6. 风格：简洁、可信、蓝色调
7. 全部中文，输出完整的 HTML 代码

AI 会生成一段较长的代码。先完整复制，后面再通过实际提问检查它是否可用。

第 4 步：复制代码、填钥匙、测试（15 分钟）

复制 AI 输出的完整代码
打开 https://htmlpreview.github.io/ 粘贴预览（或保存成 index.html 双击打开）
点右上角”设置”，粘贴你的 API Key
输入你的问题测试：“这车多少钱？” → 看它怎么答

发现问题就回去指挥 AI：

机器人回答得太正式了，语气改成【像朋友聊天一样】，重新输出完整代码。

第 5 步：部署上线（20 分钟）

和上一关一样，用免费部署把机器人变成人人可访问的链接：

Netlify Drop（操作较少）：https://app.netlify.com/drop → 把 index.html 拖进去 → 得到网址
或 Vercel：vercel.com → 注册 → New Project → 上传文件 → Deploy

部署后，再用手机打开链接测试一次。重点检查输入框、发送按钮和回答区域是否容易操作。

你的作品

你的成果是一个可以对话的网页链接。把它发给朋友：

“这是我做的机器人，你随便问它问题试试。”

把机器人没有答好或无法回答的问题记下来，作为下一轮补充问答的清单。

分享你的作品

截图你和机器人的对话，发到社区：

“我做了个机器人，替我省了每天重复回答的时间 🤖”

这一关你学会了什么

机器人回答得是否可靠，取决于你提供的资料、限制和兜底规则
API Key 只供自己使用；泄露后要立即撤销并重新创建
真实用户提出的问题可以暴露资料缺口，也能帮助你安排下一轮修改

下一关：第 4 关 · 你的第一个”小程序”