最近在改公司官网，客户想加一个AI客服功能，就是用户在页面上提问，后端调AI接口返回答案。功能本身不复杂，但调试过程比想象中麻烦，前后折腾了两天多。把遇到的问题记下来，给有需要的人参考。

第一个坑：接口响应太慢，页面一直转圈

第一次联调就发现问题。本地测试接口正常，放到网站上用户点提问，页面转圈十几秒才出结果，有时候直接超时报错。查了日志，AI接口生成答案本身就要几秒到十几秒，属于正常现象，但前端一直傻等肯定不行。

解决办法是改成流式输出。后端把AI返回的内容分段转发给前端，前端边收边显示，用户几秒内就能看到字一个个蹦出来，体验好了很多。另外把超时时间从默认的10秒改到60秒，加上失败重试，问题基本解决。

第二个坑：返回内容里混着Markdown符号

调试到第二天发现，AI返回的答案里经常带星号、井号这类符号，直接显示在页面上很难看。一开始想在前端做替换，后来发现AI输出格式不固定，替换逻辑写不全。

最后的做法是在后端统一处理。拿到AI返回后，先过滤掉Markdown标记，再检查内容长度，太短的空回复直接返回固定话术。前端只负责展示，不做任何解析，这样逻辑集中在一处，出问题也好排查。

第三个坑：密钥泄露和跨域问题

一开始为了省事，前端直接调AI接口，密钥写在页面代码里。同事提醒这样任何人打开控制台都能拿到密钥，被人刷量就是真金白银的损失。改成后端代理，密钥只放在服务器环境变量里，前端只请求自己的接口。

顺带还处理了跨域。前端域名和后端接口域名不一样，浏览器拦截了请求，在后端加了CORS配置，只放行自己的域名，问题解决。

几点总结

这次调试花的时间不长，但有几个经验值得记住：一是接AI接口一定要做流式输出，不然体验很差；二是后端必须做一层代理和数据清洗，不能把AI的原始返回直接丢给页面；三是密钥管理不能偷懒，放前端等于公开。

功能上线后跑了几天，目前没再出大问题。后面打算加上提问日志统计，看看用户都问什么，再决定要不要优化提示词。有同行遇到类似问题，欢迎交流。