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

简介: 阿里云AppFlow AI助手悬浮框助力企业提升数字化服务能力,通过可视化配置实现全场景覆盖、智能交互升级与低成本部署,支持网页、企业微信、钉钉多端统一交互,提升用户体验。

在数字化服务场景中,即时交互能力成为企业竞争力的核心要素。阿里云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代理。
相关文章
|
安全 机器人 API
简单几步,钉钉机器人秒变通义千问对话机器人
通过阿里云计算巢AppFlow平台,无需编码,只需简单几步,即可将钉钉机器人转化为通义千问对话机器人。首先在灵积模型服务平台获取API Key,然后在AppFlow中配置连接器,授权并保存Webhook Url。在钉钉中创建自定义机器人,选择Outgoing功能,填写签名和Webhook地址。最后,@机器人即可开始对话。此外,还提供了通过钉钉开放平台创建机器人的步骤。AppFlow简化了集成过程,加速了企业自动化服务流程。
1496 0
|
2月前
|
弹性计算 人工智能 自然语言处理
用自然语言对话云平台:aliyun-cli skills 的一次尝试
`aliyun cli skills` 是一个创新的AI运维工具:让大模型像工程师一样使用阿里云CLI——通过自然语言理解用户意图,动态调用`--help`获取真实命令语法,自动生成、审查并执行结构化CLI命令(支持ECS/VPC/OSS等全产品),实现“说话即运维”。
726 4
用自然语言对话云平台:aliyun-cli skills 的一次尝试
|
存储 人工智能 移动开发
AppFlow —— 给您的网站或企微添加AI助手
AppFlow AI助手提供灵活配置,助您轻松实现AI工具的Web页面访问与多种集成方式(H5页面、悬浮框等)。支持自定义页面生成及样式调整,满足个性化需求。文中详细介绍了创建AI助手、模型配置、Web页面集成等步骤,并展示不同场景下的使用效果。此外,还提供了企业微信集成、模型管理和插件扩展等相关操作指引,助力高效利用AI助手提升工作体验。
1360 15
AppFlow —— 给您的网站或企微添加AI助手
|
9月前
|
存储 人工智能 弹性计算
WordPress AI助手操作
本文将介绍如何使用阿里云百炼平台创建知识库与AI助手应用,包括数据上传、模型配置、应用部署及资源清理等步骤,并详细说明了如何在Web页面集成AI助手悬浮框,实现智能对话功能。
686 5
|
4月前
|
存储 人工智能 搜索推荐
教你10 分钟内为自己网站配置AI助手
阿里云百炼平台支持一键部署大模型镜像,如DeepSeek、千问、Kimi等,通过智能体(Agent)集成RAG、插件、MCP等功能,实现知识库接入与外部工具调用,轻松为网站添加AI助手,构建个性化、可扩展的AI应用。
920 3
|
JavaScript
element-UI el-table动态显示隐藏列造成固定一侧的列(fixed=“left/right“)错误显示
问题原因:多个tabs共用一个实体,动态显示隐藏列 出现了固定在右侧的列(fixed="right")错位 【解决方案】 表格的重新布局,只要table数据发生变化的时候就重新渲染表格 ```js this.$nextTick(() => { this.$refs.formname.doLayout() }) ``` 参考element官方文档 ![请在此添加图片描述](https://developer-private-1258344699.cos.ap-guangzhou.myqcloud.com/column/article/5877188/20231030-e40
1003 0
element-UI el-table动态显示隐藏列造成固定一侧的列(fixed=“left/right“)错误显示
|
11月前
|
人工智能 安全 机器人
无代码革命:10分钟打造企业专属数据库查询AI机器人
随着数字化转型加速,企业对高效智能交互解决方案的需求日益增长。阿里云AppFlow推出的AI助手产品,借助创新网页集成技术,助力企业打造专业数据库查询助手。本文详细介绍通过三步流程将AI助手转化为数据库交互工具的核心优势与操作指南,包括全场景适配、智能渲染引擎及零代码配置等三大技术突破。同时提供Web集成与企业微信集成方案,帮助企业实现便捷部署与安全管理,提升内外部用户体验。
979 12
无代码革命:10分钟打造企业专属数据库查询AI机器人
|
5月前
|
存储 弹性计算 测试技术
5 款高性价比阿里云服务器测评:覆盖个人 / 企业全场景,省钱又实用
阿里云服务器持续推出高性价比配置,结合实例性能、价格优势与实际使用场景,筛选出 5 款热门爆品。本文从配置参数、核心优势、适用场景等维度展开测评,帮不同需求的用户精准选择,避开选购误区。
|
4月前
|
人工智能 架构师 Java
大模型企业级 LLM API架构演进:重构 Java/Python 的 RAG 与 Agent 系统的六种核心策略
在 AI 全面落地的 2026 年,企业架构师的核心命题已从“如何调用”转向“如何治理”。本文结合最新的 大模型(LLM)技术趋势,深入剖析 RAG、Agent 与微调等六大 AI 定制策略。我们将探讨如何利用标准化的 LLM API 聚合层,构建高可用、低成本的企业级 AI 基础设施,助力 AI 大模型在业务中的深度应用。
508 0
|
6月前
|
人工智能 移动开发 数据可视化
阿里云百炼 UI 设计器:让 AI 对话秒变可交互界面
阿里云百炼 UI 设计器的使命,是以低门槛、高效率的方式,让开发者与非技术人员也能在极短时间内,完成专业级 AI 应用的构建、发布与运行,从而加速 AI 技术的业务落地与价值兑现。未来,UI 设计器将持续围绕能搭、搭好、好搭三大方向打磨能力。
2059 0

热门文章

最新文章