SmolVLA构建智能客服微信小程序端对话机器人集成最近在做一个宠物用品电商的小程序项目老板提了个需求想给用户加个24小时在线的智能客服解答一些关于产品、喂养的常见问题。一开始我们考虑用传统的规则问答但发现宠物问题五花八门规则根本写不完。后来我们尝试了SmolVLA一个轻量级的视觉语言模型发现它不仅能理解文字还能看懂用户发的宠物图片特别适合我们这个场景。今天我就把这个从零到一把SmolVLA集成到微信小程序里做成智能客服的完整过程分享出来。整个过程不复杂核心就是把模型部署成云函数然后让小程序前端能方便地调用。我会重点讲清楚怎么打通前后端怎么管理用户对话以及怎么处理一些实际会遇到的问题比如敏感词和响应速度。如果你也想在小程序里加个聪明的AI助手这篇文章应该能给你不少参考。1. 为什么选择SmolVLA做小程序客服在决定用SmolVLA之前我们其实对比过好几种方案。传统的客服机器人需要预先设置大量的问答对用户必须按照固定的句式提问稍微换个说法它就听不懂了维护起来特别累。而一些大型的通用对话模型虽然聪明但部署成本高、响应慢放在小程序这种对速度和资源敏感的环境里用户体验会大打折扣。SmolVLA吸引我们的地方恰恰在于它在“小巧”和“聪明”之间找到了一个不错的平衡点。首先它的模型体积相对较小这意味着我们可以把它部署在云函数这样的无服务器环境里按需调用成本可控不用一直守着个服务器。其次它具备多模态理解能力。对于宠物电商来说用户经常会上传一张宠物照片问“我家猫掉毛这么严重该用什么梳子”或者“狗狗耳朵这个样子是正常的吗”。SmolVLA能同时分析图片和文字给出更精准的建议这是纯文本模型做不到的。简单来说用SmolVLA我们相当于得到了一个既不用花大价钱养着又能看图说话、灵活应对各种问题的“全能型”客服专员非常适合作为小程序里的一个增值服务功能。2. 整体架构云函数小程序前端整个系统的架构非常清晰核心思想是“前端负责交互后端负责智能”。我们把复杂的模型推理放在云端小程序只负责简洁的聊天界面和网络通信。前端微信小程序聊天界面就是大家常见的对话框用户输入文字或选择图片发送后等待回复。会话管理记录当前对话的历史记录每次提问都把之前的聊天上下文一起发给后端这样AI才能知道我们在聊什么。媒体处理用户如果上传图片小程序需要先压缩、上传到云存储拿到一个临时链接再把这个链接和文字一起发给后端。后端云函数 SmolVLAAPI网关接收小程序发来的HTTP请求。核心云函数这是大脑。它加载SmolVLA模型接收用户发来的文字和图片链接调用模型进行推理生成回复文本。敏感词过滤在返回回复给用户之前云函数会先过一遍滤把一些不合适的词汇替换掉确保内容安全。会话缓存为了优化速度可以将活跃用户的对话历史临时缓存起来避免每次都要从零开始理解上下文。数据流是这样的用户在小程序里说话 - 小程序将消息和图片链接打包调用云函数 - 云函数启动SmolVLA模型进行理解与生成 - 云函数过滤回复内容 - 将安全的回复文本返回给小程序 - 小程序展示回复。这样做的好处是小程序的包体积不会因为嵌入大模型而膨胀模型更新也只需要在云端操作用户无感升级。同时云函数的自动扩缩容能力也能轻松应对早晚高峰的咨询流量。3. 后端核心将SmolVLA封装为云函数这一步是把AI能力“打包”成服务的关键。我们以腾讯云SCFServerless Cloud Function为例其他平台的云函数也大同小异。3.1 云函数环境准备与依赖安装首先你需要创建一个新的云函数。运行环境选择Python 3.8或更高版本因为SmolVLA的生态对Python支持比较好。云函数需要一些额外的依赖库包括深度学习框架、模型本身以及一些工具库。这些依赖需要在一个名为requirements.txt的文件里声明部署时平台会自动安装。# requirements.txt torch1.12.0 transformers4.30.0 pillow9.0.0 requests2.28.0 numpy1.22.0 # 这里假设SmolVLA可以通过特定的库或从源码安装具体包名需根据官方文档确定 # 例如smolvla3.2 模型加载与推理代码云函数的入口文件比如index.py里我们要实现模型的一次性加载和每次请求的处理逻辑。为了避免每次调用都重复加载模型那会慢得无法接受我们利用云函数的执行环境复用特性在函数初始化时就加载好模型。# index.py import json import base64 from io import BytesIO import requests from PIL import Image import torch from transformers import AutoProcessor, AutoModelForVision2Seq # 全局变量在冷启动时初始化热启动时复用 model None processor None device None def load_model(): 加载模型和处理器只在冷启动时执行一次 global model, processor, device print(正在加载SmolVLA模型...) model_name 你的SmolVLA模型名称或路径 # 例如: OpenGVLab/SmolVLA processor AutoProcessor.from_pretrained(model_name) model AutoModelForVision2Seq.from_pretrained(model_name) device torch.device(cuda if torch.cuda.is_available() else cpu) model.to(device) model.eval() print(模型加载完毕。) def process_image(image_input): 处理图片输入可以是URL或Base64编码的字符串 if image_input.startswith(http): # 从URL下载图片 response requests.get(image_input, timeout10) image Image.open(BytesIO(response.content)).convert(RGB) else: # 假设是Base64编码 image_data base64.b64decode(image_input) image Image.open(BytesIO(image_data)).convert(RGB) return image def main_handler(event, context): 云函数主入口 global model, processor, device # 首次调用时加载模型 if model is None: load_model() # 解析来自小程序的请求体 try: body json.loads(event[body]) user_message body.get(message, ) image_data body.get(image, None) # 图片URL或Base64 chat_history body.get(history, []) # 对话历史 except Exception as e: return {statusCode: 400, body: json.dumps({error: 请求格式错误})} # 准备模型输入 inputs {} if image_data: try: image process_image(image_data) # 将图片和文本一起处理成模型输入 inputs processor(imagesimage, textuser_message, return_tensorspt).to(device) except Exception as e: print(f图片处理失败: {e}) # 如果图片处理失败可以降级为纯文本对话 inputs processor(textuser_message, return_tensorspt).to(device) else: # 纯文本输入 inputs processor(textuser_message, return_tensorspt).to(device) # 模型推理生成回复 try: with torch.no_grad(): generated_ids model.generate(**inputs, max_new_tokens200) bot_reply processor.batch_decode(generated_ids, skip_special_tokensTrue)[0] except Exception as e: print(f模型推理失败: {e}) bot_reply 抱歉我暂时无法处理这个问题请稍后再试。 # 简单敏感词过滤 (示例实际应用需要更完善的词库) sensitive_words [违规词1, 违规词2] for word in sensitive_words: if word in bot_reply: bot_reply bot_reply.replace(word, ***) # 构造返回给小程序的数据 response { reply: bot_reply, history: chat_history [{role: user, content: user_message}, {role: assistant, content: bot_reply}] } return { statusCode: 200, headers: {Content-Type: application/json}, body: json.dumps(response) }这段代码做了几件关键事一是利用全局变量实现了模型的单例加载二是能同时处理带图片和不带图片的提问三是包含了最基本的敏感词过滤四是返回了更新后的对话历史方便前端维持上下文。3.3 敏感词过滤与内容安全内容安全是上线前必须严肃对待的一环。上面的代码只是一个极简的示例。在实际项目中你需要建立完善的敏感词库不仅包括明显的违规词还要考虑业务相关的风险词比如医疗建议中的绝对化用语。使用更高效的过滤算法如AC自动机应对海量词库和长文本。考虑语义过滤简单的关键词替换可能误伤或漏杀可以结合一些轻量级的文本分类模型对回复的整体倾向进行判断。设置审核兜底对于过滤后仍不确定的内容可以打标并转入人工审核队列先给用户一个“正在思考”的缓冲回复。4. 前端实现微信小程序与云函数通信后端服务准备好了接下来就是让小程序的聊天界面能跟它说上话。4.1 小程序端会话管理在小程序端我们需要一个地方来存储当前的对话记录。通常我们会用一个数组来保存每条记录包含角色用户或助手和内容。// pages/chat/chat.js Page({ data: { messageList: [], // 对话列表 {role: user/assistant, content: ...} inputValue: , // 输入框内容 imageTempPath: , // 选择的图片临时路径 isLoading: false }, onLoad: function() { // 可以从本地缓存加载历史会话 const history wx.getStorageSync(chat_history) || []; this.setData({ messageList: history }); }, // 发送消息 sendMessage: function() { const that this; const { inputValue, imageTempPath, messageList } this.data; if ((!inputValue.trim() !imageTempPath) || this.data.isLoading) return; // 将用户消息加入列表 const userMsg { role: user, content: inputValue }; const newList [...messageList, userMsg]; this.setData({ messageList: newList, inputValue: , imageTempPath: , isLoading: true }); // 准备请求数据 const requestData { message: inputValue, history: messageList.slice(-10).map(msg ({role: msg.role, content: msg.content})), // 只发送最近10轮历史 }; // 如果有图片先上传到云存储获取链接 const uploadPromise imageTempPath ? this.uploadImage(imageTempPath) : Promise.resolve(null); uploadPromise.then(imageUrl { if (imageUrl) { requestData.image imageUrl; } // 调用云函数 return that.invokeCloudFunction(requestData); }).then(res { // 成功收到回复 const botReply res.reply; const updatedList [...newList, { role: assistant, content: botReply }]; that.setData({ messageList: updatedList, isLoading: false }); // 保存到本地缓存 wx.setStorageSync(chat_history, updatedList.slice(-50)); // 最多保存50条 // 滚动到底部 that.scrollToBottom(); }).catch(err { console.error(发送失败:, err); that.setData({ isLoading: false }); wx.showToast({ title: 发送失败请重试, icon: none }); }); }, // 上传图片到云存储 uploadImage: function(tempFilePath) { return new Promise((resolve, reject) { const cloudPath chat_images/${Date.now()}-${Math.random().toString(36).slice(-6)}.jpg; wx.cloud.uploadFile({ cloudPath, filePath: tempFilePath, success: res { // 获取图片临时链接有效期通常几天足够模型处理 wx.cloud.getTempFileURL({ fileList: [res.fileID], success: res resolve(res.fileList[0].tempFileURL), fail: reject }); }, fail: reject }); }); }, // 调用云函数 invokeCloudFunction: function(data) { return new Promise((resolve, reject) { wx.cloud.callFunction({ name: smolvla_chat, // 你的云函数名称 data: data, success: res { if (res.result.statusCode 200) { resolve(JSON.parse(res.result.body)); } else { reject(new Error(云函数返回错误)); } }, fail: reject }); }); }, // 选择图片 chooseImage: function() { const that this; wx.chooseImage({ count: 1, sizeType: [compressed], // 使用压缩图以节省流量和上传时间 sourceType: [album, camera], success(res) { that.setData({ imageTempPath: res.tempFilePaths[0] }); } }); }, // 其他辅助函数... scrollToBottom: function() { setTimeout(() { wx.createSelectorQuery().select(#chat-scroll-view).boundingClientRect(rect { wx.createSelectorQuery().select(#chat-scroll-view).scrollOffset(scroll { if (rect.height scroll.scrollTop 300) { wx.pageScrollTo({ scrollTop: scroll.scrollHeight, duration: 300 }); } }).exec(); }).exec(); }, 100); } })4.2 优化响应速度与用户体验小程序用户对延迟非常敏感。除了选择SmolVLA这种轻量模型我们还可以在前端做一些优化本地历史缓存如上代码所示将对话历史缓存在本地wx.setStorageSync每次只向云端发送最近几轮对话减少数据传输量。图片压缩与预览在调用wx.chooseImage时使用sizeType: [compressed]。用户选择图片后可以在发送前先在小程序内显示一个预览图确认无误后再上传避免误操作带来的等待。流式输出如果模型支持如果云函数和模型支持流式生成即一个字一个字地返回前端可以实时显示生成过程让用户感知到“AI正在思考”而不是面对一个长时间的白屏。这需要建立WebSocket连接或使用Server-Sent Events (SSE)实现稍复杂但对体验提升巨大。智能等待提示在调用云函数期间除了显示加载动画还可以根据等待时间动态改变提示文字比如从“正在思考...”变为“问题有点复杂再等我一下下~”缓解用户焦虑。失败重试与降级网络请求失败时不要只弹个错误框。可以自动重试1-2次或者提供一个“重新发送”的按钮。在云函数完全不可用时可以降级到一个本地的、简单的规则问答库。5. 实际效果与踩坑心得我们把上面这套方案用在了宠物小程序上上线运行了一个多月。从后台数据看这个智能客服每天能处理几百次咨询大部分关于产品规格、使用方法和宠物常见行为的问题都能得到不错的解答。特别是当用户上传宠物局部皮肤问题或者粪便图片时SmolVLA给出的护理建议经常被用户评价“很专业”。当然踩坑是少不了的。这里分享几个关键点冷启动延迟云函数如果一段时间没人用再次调用时会经历“冷启动”即重新加载环境、模型这次请求会特别慢可能长达10秒。为了缓解这个问题我们设置了一个定时触发器每隔5分钟轻轻调用一下云函数让它保持“温热”状态。对于核心业务也可以考虑使用云函数的“预置并发”功能但这会增加成本。上下文长度限制SmolVLA这类模型对输入的文本长度有限制。我们只传递最近10轮对话一方面是为了控制请求大小另一方面也是为了避免超出模型限制导致推理错误或质量下降。对于需要超长记忆的场景可能需要引入更复杂的摘要或向量检索机制。图片上传成本与延迟图片上传到云存储、再下载到云函数会产生流量费用并增加延迟。对于内网环境可以考虑将模型部署在和云存储同地域的服务甚至探索直接将图片二进制流通过API网关传给云函数的可能性需注意Base64编码的体积膨胀和网关限制。回复的不可控性尽管有敏感词过滤模型偶尔还是会生成一些无关的、重复的或者过于“放飞自我”的回复。我们在产品层面做了兜底比如设置一个默认的“抱歉我没理解您的问题可以联系人工客服”的回复并在后台对异常回复进行记录和人工复查用于后续优化模型提示词。获取更多AI镜像想探索更多AI镜像和应用场景访问 CSDN星图镜像广场提供丰富的预置镜像覆盖大模型推理、图像生成、视频生成、模型微调等多个领域支持一键部署。
SmolVLA构建智能客服：微信小程序端对话机器人集成
SmolVLA构建智能客服微信小程序端对话机器人集成最近在做一个宠物用品电商的小程序项目老板提了个需求想给用户加个24小时在线的智能客服解答一些关于产品、喂养的常见问题。一开始我们考虑用传统的规则问答但发现宠物问题五花八门规则根本写不完。后来我们尝试了SmolVLA一个轻量级的视觉语言模型发现它不仅能理解文字还能看懂用户发的宠物图片特别适合我们这个场景。今天我就把这个从零到一把SmolVLA集成到微信小程序里做成智能客服的完整过程分享出来。整个过程不复杂核心就是把模型部署成云函数然后让小程序前端能方便地调用。我会重点讲清楚怎么打通前后端怎么管理用户对话以及怎么处理一些实际会遇到的问题比如敏感词和响应速度。如果你也想在小程序里加个聪明的AI助手这篇文章应该能给你不少参考。1. 为什么选择SmolVLA做小程序客服在决定用SmolVLA之前我们其实对比过好几种方案。传统的客服机器人需要预先设置大量的问答对用户必须按照固定的句式提问稍微换个说法它就听不懂了维护起来特别累。而一些大型的通用对话模型虽然聪明但部署成本高、响应慢放在小程序这种对速度和资源敏感的环境里用户体验会大打折扣。SmolVLA吸引我们的地方恰恰在于它在“小巧”和“聪明”之间找到了一个不错的平衡点。首先它的模型体积相对较小这意味着我们可以把它部署在云函数这样的无服务器环境里按需调用成本可控不用一直守着个服务器。其次它具备多模态理解能力。对于宠物电商来说用户经常会上传一张宠物照片问“我家猫掉毛这么严重该用什么梳子”或者“狗狗耳朵这个样子是正常的吗”。SmolVLA能同时分析图片和文字给出更精准的建议这是纯文本模型做不到的。简单来说用SmolVLA我们相当于得到了一个既不用花大价钱养着又能看图说话、灵活应对各种问题的“全能型”客服专员非常适合作为小程序里的一个增值服务功能。2. 整体架构云函数小程序前端整个系统的架构非常清晰核心思想是“前端负责交互后端负责智能”。我们把复杂的模型推理放在云端小程序只负责简洁的聊天界面和网络通信。前端微信小程序聊天界面就是大家常见的对话框用户输入文字或选择图片发送后等待回复。会话管理记录当前对话的历史记录每次提问都把之前的聊天上下文一起发给后端这样AI才能知道我们在聊什么。媒体处理用户如果上传图片小程序需要先压缩、上传到云存储拿到一个临时链接再把这个链接和文字一起发给后端。后端云函数 SmolVLAAPI网关接收小程序发来的HTTP请求。核心云函数这是大脑。它加载SmolVLA模型接收用户发来的文字和图片链接调用模型进行推理生成回复文本。敏感词过滤在返回回复给用户之前云函数会先过一遍滤把一些不合适的词汇替换掉确保内容安全。会话缓存为了优化速度可以将活跃用户的对话历史临时缓存起来避免每次都要从零开始理解上下文。数据流是这样的用户在小程序里说话 - 小程序将消息和图片链接打包调用云函数 - 云函数启动SmolVLA模型进行理解与生成 - 云函数过滤回复内容 - 将安全的回复文本返回给小程序 - 小程序展示回复。这样做的好处是小程序的包体积不会因为嵌入大模型而膨胀模型更新也只需要在云端操作用户无感升级。同时云函数的自动扩缩容能力也能轻松应对早晚高峰的咨询流量。3. 后端核心将SmolVLA封装为云函数这一步是把AI能力“打包”成服务的关键。我们以腾讯云SCFServerless Cloud Function为例其他平台的云函数也大同小异。3.1 云函数环境准备与依赖安装首先你需要创建一个新的云函数。运行环境选择Python 3.8或更高版本因为SmolVLA的生态对Python支持比较好。云函数需要一些额外的依赖库包括深度学习框架、模型本身以及一些工具库。这些依赖需要在一个名为requirements.txt的文件里声明部署时平台会自动安装。# requirements.txt torch1.12.0 transformers4.30.0 pillow9.0.0 requests2.28.0 numpy1.22.0 # 这里假设SmolVLA可以通过特定的库或从源码安装具体包名需根据官方文档确定 # 例如smolvla3.2 模型加载与推理代码云函数的入口文件比如index.py里我们要实现模型的一次性加载和每次请求的处理逻辑。为了避免每次调用都重复加载模型那会慢得无法接受我们利用云函数的执行环境复用特性在函数初始化时就加载好模型。# index.py import json import base64 from io import BytesIO import requests from PIL import Image import torch from transformers import AutoProcessor, AutoModelForVision2Seq # 全局变量在冷启动时初始化热启动时复用 model None processor None device None def load_model(): 加载模型和处理器只在冷启动时执行一次 global model, processor, device print(正在加载SmolVLA模型...) model_name 你的SmolVLA模型名称或路径 # 例如: OpenGVLab/SmolVLA processor AutoProcessor.from_pretrained(model_name) model AutoModelForVision2Seq.from_pretrained(model_name) device torch.device(cuda if torch.cuda.is_available() else cpu) model.to(device) model.eval() print(模型加载完毕。) def process_image(image_input): 处理图片输入可以是URL或Base64编码的字符串 if image_input.startswith(http): # 从URL下载图片 response requests.get(image_input, timeout10) image Image.open(BytesIO(response.content)).convert(RGB) else: # 假设是Base64编码 image_data base64.b64decode(image_input) image Image.open(BytesIO(image_data)).convert(RGB) return image def main_handler(event, context): 云函数主入口 global model, processor, device # 首次调用时加载模型 if model is None: load_model() # 解析来自小程序的请求体 try: body json.loads(event[body]) user_message body.get(message, ) image_data body.get(image, None) # 图片URL或Base64 chat_history body.get(history, []) # 对话历史 except Exception as e: return {statusCode: 400, body: json.dumps({error: 请求格式错误})} # 准备模型输入 inputs {} if image_data: try: image process_image(image_data) # 将图片和文本一起处理成模型输入 inputs processor(imagesimage, textuser_message, return_tensorspt).to(device) except Exception as e: print(f图片处理失败: {e}) # 如果图片处理失败可以降级为纯文本对话 inputs processor(textuser_message, return_tensorspt).to(device) else: # 纯文本输入 inputs processor(textuser_message, return_tensorspt).to(device) # 模型推理生成回复 try: with torch.no_grad(): generated_ids model.generate(**inputs, max_new_tokens200) bot_reply processor.batch_decode(generated_ids, skip_special_tokensTrue)[0] except Exception as e: print(f模型推理失败: {e}) bot_reply 抱歉我暂时无法处理这个问题请稍后再试。 # 简单敏感词过滤 (示例实际应用需要更完善的词库) sensitive_words [违规词1, 违规词2] for word in sensitive_words: if word in bot_reply: bot_reply bot_reply.replace(word, ***) # 构造返回给小程序的数据 response { reply: bot_reply, history: chat_history [{role: user, content: user_message}, {role: assistant, content: bot_reply}] } return { statusCode: 200, headers: {Content-Type: application/json}, body: json.dumps(response) }这段代码做了几件关键事一是利用全局变量实现了模型的单例加载二是能同时处理带图片和不带图片的提问三是包含了最基本的敏感词过滤四是返回了更新后的对话历史方便前端维持上下文。3.3 敏感词过滤与内容安全内容安全是上线前必须严肃对待的一环。上面的代码只是一个极简的示例。在实际项目中你需要建立完善的敏感词库不仅包括明显的违规词还要考虑业务相关的风险词比如医疗建议中的绝对化用语。使用更高效的过滤算法如AC自动机应对海量词库和长文本。考虑语义过滤简单的关键词替换可能误伤或漏杀可以结合一些轻量级的文本分类模型对回复的整体倾向进行判断。设置审核兜底对于过滤后仍不确定的内容可以打标并转入人工审核队列先给用户一个“正在思考”的缓冲回复。4. 前端实现微信小程序与云函数通信后端服务准备好了接下来就是让小程序的聊天界面能跟它说上话。4.1 小程序端会话管理在小程序端我们需要一个地方来存储当前的对话记录。通常我们会用一个数组来保存每条记录包含角色用户或助手和内容。// pages/chat/chat.js Page({ data: { messageList: [], // 对话列表 {role: user/assistant, content: ...} inputValue: , // 输入框内容 imageTempPath: , // 选择的图片临时路径 isLoading: false }, onLoad: function() { // 可以从本地缓存加载历史会话 const history wx.getStorageSync(chat_history) || []; this.setData({ messageList: history }); }, // 发送消息 sendMessage: function() { const that this; const { inputValue, imageTempPath, messageList } this.data; if ((!inputValue.trim() !imageTempPath) || this.data.isLoading) return; // 将用户消息加入列表 const userMsg { role: user, content: inputValue }; const newList [...messageList, userMsg]; this.setData({ messageList: newList, inputValue: , imageTempPath: , isLoading: true }); // 准备请求数据 const requestData { message: inputValue, history: messageList.slice(-10).map(msg ({role: msg.role, content: msg.content})), // 只发送最近10轮历史 }; // 如果有图片先上传到云存储获取链接 const uploadPromise imageTempPath ? this.uploadImage(imageTempPath) : Promise.resolve(null); uploadPromise.then(imageUrl { if (imageUrl) { requestData.image imageUrl; } // 调用云函数 return that.invokeCloudFunction(requestData); }).then(res { // 成功收到回复 const botReply res.reply; const updatedList [...newList, { role: assistant, content: botReply }]; that.setData({ messageList: updatedList, isLoading: false }); // 保存到本地缓存 wx.setStorageSync(chat_history, updatedList.slice(-50)); // 最多保存50条 // 滚动到底部 that.scrollToBottom(); }).catch(err { console.error(发送失败:, err); that.setData({ isLoading: false }); wx.showToast({ title: 发送失败请重试, icon: none }); }); }, // 上传图片到云存储 uploadImage: function(tempFilePath) { return new Promise((resolve, reject) { const cloudPath chat_images/${Date.now()}-${Math.random().toString(36).slice(-6)}.jpg; wx.cloud.uploadFile({ cloudPath, filePath: tempFilePath, success: res { // 获取图片临时链接有效期通常几天足够模型处理 wx.cloud.getTempFileURL({ fileList: [res.fileID], success: res resolve(res.fileList[0].tempFileURL), fail: reject }); }, fail: reject }); }); }, // 调用云函数 invokeCloudFunction: function(data) { return new Promise((resolve, reject) { wx.cloud.callFunction({ name: smolvla_chat, // 你的云函数名称 data: data, success: res { if (res.result.statusCode 200) { resolve(JSON.parse(res.result.body)); } else { reject(new Error(云函数返回错误)); } }, fail: reject }); }); }, // 选择图片 chooseImage: function() { const that this; wx.chooseImage({ count: 1, sizeType: [compressed], // 使用压缩图以节省流量和上传时间 sourceType: [album, camera], success(res) { that.setData({ imageTempPath: res.tempFilePaths[0] }); } }); }, // 其他辅助函数... scrollToBottom: function() { setTimeout(() { wx.createSelectorQuery().select(#chat-scroll-view).boundingClientRect(rect { wx.createSelectorQuery().select(#chat-scroll-view).scrollOffset(scroll { if (rect.height scroll.scrollTop 300) { wx.pageScrollTo({ scrollTop: scroll.scrollHeight, duration: 300 }); } }).exec(); }).exec(); }, 100); } })4.2 优化响应速度与用户体验小程序用户对延迟非常敏感。除了选择SmolVLA这种轻量模型我们还可以在前端做一些优化本地历史缓存如上代码所示将对话历史缓存在本地wx.setStorageSync每次只向云端发送最近几轮对话减少数据传输量。图片压缩与预览在调用wx.chooseImage时使用sizeType: [compressed]。用户选择图片后可以在发送前先在小程序内显示一个预览图确认无误后再上传避免误操作带来的等待。流式输出如果模型支持如果云函数和模型支持流式生成即一个字一个字地返回前端可以实时显示生成过程让用户感知到“AI正在思考”而不是面对一个长时间的白屏。这需要建立WebSocket连接或使用Server-Sent Events (SSE)实现稍复杂但对体验提升巨大。智能等待提示在调用云函数期间除了显示加载动画还可以根据等待时间动态改变提示文字比如从“正在思考...”变为“问题有点复杂再等我一下下~”缓解用户焦虑。失败重试与降级网络请求失败时不要只弹个错误框。可以自动重试1-2次或者提供一个“重新发送”的按钮。在云函数完全不可用时可以降级到一个本地的、简单的规则问答库。5. 实际效果与踩坑心得我们把上面这套方案用在了宠物小程序上上线运行了一个多月。从后台数据看这个智能客服每天能处理几百次咨询大部分关于产品规格、使用方法和宠物常见行为的问题都能得到不错的解答。特别是当用户上传宠物局部皮肤问题或者粪便图片时SmolVLA给出的护理建议经常被用户评价“很专业”。当然踩坑是少不了的。这里分享几个关键点冷启动延迟云函数如果一段时间没人用再次调用时会经历“冷启动”即重新加载环境、模型这次请求会特别慢可能长达10秒。为了缓解这个问题我们设置了一个定时触发器每隔5分钟轻轻调用一下云函数让它保持“温热”状态。对于核心业务也可以考虑使用云函数的“预置并发”功能但这会增加成本。上下文长度限制SmolVLA这类模型对输入的文本长度有限制。我们只传递最近10轮对话一方面是为了控制请求大小另一方面也是为了避免超出模型限制导致推理错误或质量下降。对于需要超长记忆的场景可能需要引入更复杂的摘要或向量检索机制。图片上传成本与延迟图片上传到云存储、再下载到云函数会产生流量费用并增加延迟。对于内网环境可以考虑将模型部署在和云存储同地域的服务甚至探索直接将图片二进制流通过API网关传给云函数的可能性需注意Base64编码的体积膨胀和网关限制。回复的不可控性尽管有敏感词过滤模型偶尔还是会生成一些无关的、重复的或者过于“放飞自我”的回复。我们在产品层面做了兜底比如设置一个默认的“抱歉我没理解您的问题可以联系人工客服”的回复并在后台对异常回复进行记录和人工复查用于后续优化模型提示词。获取更多AI镜像想探索更多AI镜像和应用场景访问 CSDN星图镜像广场提供丰富的预置镜像覆盖大模型推理、图像生成、视频生成、模型微调等多个领域支持一键部署。
