必须通过百炼平台创建发布客服智能体或自建后端调用DashScope API，前端仅嵌入脚本或请求后端接口，全程隔离API密钥，确保安全可控。
☞☞☞AI 智能聊天, 问答助手, AI 智能搜索, 多模态理解力帮你轻松跨越从0到1的创作门槛☜☜☜
要把千问AI API接入网站客服系统，必须让前端用户输入能传到后端，后端调用通义千问API获得回复，再把结果实时返回给网页上的对话框，整个链路不能暴露API密钥，也不能让用户直连阿里云接口。
第一步：在百炼平台创建并发布客服智能体
这一步生成的是可直接嵌入网页的托管型客服机器人，适合没有后端开发能力的运营人员快速上线。
1、登录阿里云百炼控制台，进入「我的应用」→ 点击右上角「新增应用」→ 选择「智能体应用」。
2、模型栏选「qwen-plus」，名称填“官网在线客服”，其他参数保持默认即可。
3、进入「知识库」模块，上传你整理好的FAQ文档（TXT/CSV格式），系统会自动切分段落并建立语义索引；【若上传PDF，请确保文字可复制，扫描图PDF无法解析】。
4、切换到「流程设计」页签，拖拽节点配置基础逻辑：设置「欢迎语」→ 接收用户消息 → 启用「知识匹配」→ 匹配失败时触发「转人工」分支，并填写人工客服联系方式。
5、点击右侧「测试版本」，输入“你们支持货到付款吗？”，确认响应准确、不胡编乱造，且能引用知识库内容。
6、点击右上角「发布」，获取生产环境访问地址和Web嵌入代码片段——这段代码就是后续插入网站HTML的关键。
第二步：将客服组件嵌入网站HTML页面
只需一行代码，就能把百炼托管的客服面板嵌入任意网页底部右下角，无需改动现有JS逻辑。
打开你要部署客服的网页HTML文件，在</body>标签前粘贴如下代码：
<script src="https://alicdn.com/bailian/embed.js?appId=your_app_id_here" async></script>
把其中 your_app_id_here 替换成你在百炼「我的应用」列表里看到的实际应用ID（形如 app-xxxxxxxxxxxx）。
刷新网页，右下角会出现悬浮客服按钮；点击后加载对话窗口，所有对话、上下文维持、知识检索均由百炼平台自动处理。
第三步：用自建后端对接API（高定制需求）
如果你需要控制对话状态、记录完整会话日志、做敏感词过滤或对接CRM工单系统，就必须走自建后端路径。该方式要求你已有Node.js/Java/Python服务。
方法一：通过DashScope SDK调用（推荐）
统一LLM网关 - 一个API对接70+AI模型，使用单一API密钥即可调用GPT、Claude、Gemini、Qwen、Deepseek、Grok等主流模型。
1、在DashScope控制台「API密钥管理」中创建新密钥，复制AccessKey ID与Secret；【切勿写死在前端代码里，否则密钥立刻泄露】。
2、后端项目中安装SDK：Python执行 pip install dashscope；Java引入Maven依赖 dashscope-java-sdk。
3、构造请求体时，必须包含system提示词约束角色，例如：“你是一名XX公司官网客服，只回答产品功能、售后政策类问题，禁止承诺退款或透露内部流程。”
4、启用stream参数，使响应逐字流式返回，网页端可用EventSource接收，实现打字机效果。
方法二：用curl直连（调试用）
在终端执行以下命令，验证API是否通畅（替换your_api_key和your_prompt）：
curl -X POST https://dashscope.aliyuncs.com/api/v1/services/aigc/text-generation/generation \
-H "Authorization: Bearer your_api_key" \
-H "Content-Type: application/json" \
-d '{"model":"qwen-plus","input":{"prompt":"你好"}}'
返回status_code为200且output.text有内容，说明认证和网络通路正常。
第四步：前端发起对话请求（对接自建后端）
假设你的后端已提供 /api/chat 接口，前端需用fetch发送用户消息并渲染响应。
① 用户在网页输入框敲回车后，执行：
fetch('/api/chat', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ message: userInput }) })
② 后端收到请求，拼接system提示词+历史消息+当前提问，调用qwen-plus模型。
③ 后端将response.output.text原样返回给前端，前端用 innerHTML 插入对话区域。
④ 若需维持多轮上下文，前端每次请求都应附带上一轮的session_id，后端用Redis缓存最近5轮消息数组，键名为 ai:session:${sessionId}:history。
