AI助手悬浮框嵌入指南：5分钟打造智能交互入口

在数字化服务场景中，即时交互能力成为企业竞争力的核心要素。阿里云AppFlow AI助手悬浮框通过无需开发经验的可视化配置，为企业提供三大核心价值：

• 全场景覆盖：支持网页、企业微信、钉钉多端统一交互
• 智能升级体验：流式对话+图文混排渲染，突破传统IM交互限制
• 低成本部署：测试域名30秒极速上线，正式环境域名绑定仅需3步

操作步骤

创建百炼应用（可选）

1. 进入百炼控制台的应用列表，在页面右侧点击新增应用。在对话框中选择智能体应用，点击立即创建。

1. 根据需要选择模型。模型参数无特殊需要保持默认即可。
2. 提示词部分可以根据您的要求填写对AI助手的要求和约束

为应用增加私有知识

1. 打开知识库选项，选择之前创建的知识库。Prompt 中会被自动添加一段信息，以便大模型在后续回答时参考检索出来的信息。

1. 测试验证符合预期后点击发布。

创建AI助手

新建AI助手

1. 登录AppFlow控制台。
2. 在左侧导航栏中选择模型服务 > AI助手。
3. 在 AI 助手页面，单击创建AI助手设置基本信息。可以自定义上传您的AI助手图标和名称。
4. 配置完成单击提交，跳转至AI助手详情页面。

导入并配置模型

1. 点击 导入模型 按钮，选择阿里云百炼或者其他任意您想要使用的模型。

1. 按照提示配置您的模型鉴权凭证，完成后点击保存。
2. 填写百炼应用ID，可从百炼应用管理页面获取。
3. 在配置项设置中，配置对话背景、欢迎语以及预设问题。

• • 对话背景，无需额外配置，将使用您在百炼应用中填写的内容。
  • 欢迎语，AI助手展示的欢迎语，例如欢迎使用XX产品AI助手，可根据您的需要填写
  • 预置问题，用户可以直接点击快速提问的问题，例如介绍xx产品的使用说明

1. 在通用设置区块中根据您的业务需求配置如下内容：

• • 支持使用上下文记录，使您的AI助手在对话过程中携带有上下文连贯会话
  • 展示文档来源开关，开启之后，如果您添加了知识库则会返回知识库的文档引用序号
  • SLS日志记录，通过将对话记录集中存储在 SLS 中，您可以轻松检索和分析历史对话，洞察用户行为和偏好，从而优化对话模型和策略。
  • 语音输入，通过智能语音交互，您可以与AI助手进行语音对话，并获取语音结果。
  • 文件输入，通过文件交互，使您的AI助手可以根据文件内容进行回答。

创建集成

Web集成

通过创建一个Web页面集成，您可以通过指定链接地址访问您的AI助手页面。

1. 在集成页签下，点击web页面集成。

1. 在web页面集成页面点击创建完成，在弹框中输入集成名称，并单击确定。

1. 跳转至Web配置页面后，根据提示设置基础信息。

左侧配置修改后，右边预览页面会同步更新，您可以根据需要调试和配置您想要的实际效果

1. 配置部署信息。

• • 独立页面部署：将网页单独部署，拥有独立URL，可单独访问和运行。
  • Iframe页面嵌入：使用Iframe在现有页面嵌入其他HTML文档，显示外部内容于特定区域。
  • 悬浮挂件部署：固定于网页边缘的小工具，如客服窗口、返回顶部按钮，随用户操作显示或隐藏。

• 复制悬浮框的JS脚本到您的Web页面代码中，即可在您的web应用中使用悬浮框AI助手

1. 按照互联网合规要求，上述提供的阿里云访问地址是测试使用的，有效期为自Web集成创建之日起30天内。为了正常生产使用，请绑定您的自定义域名。绑定后即可使用您的域名或IP访问。

• • 在部署信息中单击绑定自定义域名。
  • 首次勾选绑定时，会弹出AppFlow服务关联角色授权创建页面，请您确认并授权。
  • AppFlow共提供了两种方式为您配置域名或IP：使用可信主题域名或使用计算巢Nginx代理。