第20课：AI能力接入
进度 0/30
🤖
AI能力接入
让你的小程序开口说AI话
📖知识引入
🧠AI即服务
大模型都提供API接口：小程序通过网络请求调用，页面就拥有「AI大脑」——这是2026年最火的玩法。
💬对话接口模式
把用户的问题发给AI接口，收到AI的回答再显示——一个输入框+一个文本区，AI聊天页面就搭好了。
🔑密钥要保护
调用AI接口需要API Key（密钥）。它像家门钥匙，绝不能写在页面代码里——要放服务器上中转！
🎭更多AI玩法
语音识别把语音变文字、文生图做表情包、AI推荐做个性化首页——AI能力可以成为你作品的杀手锏。
🧸学生作品灵感
AI成语解释器、AI作文批改、AI口算出题官、AI英语陪练——「小程序+AI」是学生比赛的获奖热门方向。
💡
API Key像家门钥匙，绝不能放在前端代码里！
🔍AI问答小程序架构
// 伪代码示意：请求自己的服务器中转调用AI
Page({
data: { answer: '问我任何问题吧！' },
askAI() {
wx.request({
url: 'https://你的服务器/chat',
data: { question: '为什么天是蓝的？' },
success: (res) => {
this.setData({ answer: res.data.answer })
}
})
}
})AI小程序三层结构：
📱 小程序（前端） 收集用户问题、显示AI回答 │ ▼ wx.request 🖥️ 你的服务器（中转站） 藏着API Key，转发请求 │ ▼ 🧠 AI大模型接口 生成回答
为什么要服务器中转？ 如果把钥匙(API Key) 写在前端代码里—— 任何人都能扒出来 刷光你的余额！💸
学生项目小妙招： 学习阶段可以请爸妈帮忙 注册一个AI平台账号， 让AI写好中转代码， 部署到免费云服务上！
🎯小测验
第1题：API Key应该放在哪里？
第2题：小程序调用AI接口的方式是？
第3题：下面哪个是「小程序+AI」的好创意？
📝本课知识点
- ✓AI能力通过API接入小程序
- ✓对话接口=输入框+显示区
- ✓API Key必须放服务器端
- ✓语音、图像AI都能玩
- ✓AI功能是作品杀手锏
第20课完成！继续探索下一课吧 🚀