更新记录
1.0.1(2026-04-10)
支持FAQ数据管理、知识库管理、产品管理、推荐规则配置、向量检索推荐、多角色客服配置管理
平台兼容性
uni-app(3.7.3)
| Vue2 | Vue3 | Chrome | Safari | app-vue | app-nvue | Android | iOS | 鸿蒙 |
|---|---|---|---|---|---|---|---|---|
| √ | √ | √ | √ | √ | √ | √ | √ | √ |
| 微信小程序 | 支付宝小程序 | 抖音小程序 | 百度小程序 | 快手小程序 | 京东小程序 | 鸿蒙元服务 | QQ小程序 | 飞书小程序 | 小红书小程序 | 快应用-华为 | 快应用-联盟 |
|---|---|---|---|---|---|---|---|---|---|---|---|
| √ | √ | √ | √ | √ | √ | √ | √ | √ | √ | √ | √ |
uni-app x(4.0)
| Chrome | Safari | Android | iOS | 鸿蒙 | 微信小程序 |
|---|---|---|---|---|---|
| √ | √ | √ | √ | √ | √ |
其他
| 多语言 | 暗黑模式 | 宽屏模式 |
|---|---|---|
| × | × | √ |
SMA 智能对话浮窗(uni_modules)
开通账号,请联系 v x: hogwartsfan
与 SMA 后端 HTTP 接口对接的悬浮客服 / AI 对话组件,支持 Vue3 + uni-app:微信小程序、App、H5。行为与同源 H5 SDK(SSE 流式 data: {"content":"..."})一致,支持 被动代码唤起(smaChatOpen)。
兼容性(老项目是否可用?)
| 项目类型 | 组件标签 | 说明 |
|---|---|---|
| Vue3 | <sma-chat-float /> |
<script setup> + TS,见下文「快速使用」。 |
| Vue2 | <sma-chat-float-vue2 /> |
Options API + 纯 JS(js_sdk/),无需 TypeScript。 |
| nvue 页面 | — | 需在 .vue 页面中使用;纯 nvue 需自行改造。 |
注意: sma-chat-float 与 sma-chat-float-vue2 不要同屏同时挂载;被动 API 分别对应 utils/controller(Vue3)与 js_sdk/controller.js(Vue2),混用会导致注册互相覆盖。
Vue2 项目接入
<template>
<view class="page">
<sma-chat-float-vue2 :config="chatConfig" />
</view>
</template>
<script>
export default {
data() {
return {
chatConfig: {
apiKey: 'YOUR_API_KEY',
agentCode: 'YOUR_AGENT_CODE',
apiUrl: 'API_BASE_URL',
title: 'AI智能客服',
},
};
},
};
</script>
被动打开(需隐藏悬浮球时 :show-launcher="false"):
import {
smaChatOpen,
smaChatClose,
smaChatToggle,
} from '@/uni_modules/sma-chat/js_sdk/controller.js';
老项目若 不支持 ES import,可在 HBuilderX 中确认已开启 babel 编译,或使用 npm 版 vue-cli 工程 默认配置。
微信小程序说明
微信端 style 只能是字符串。本插件已避免在模板里写 :style="{ ... }" 与 CSS v-bind,若你本地改过样式绑定,请同样改为字符串(例如 'background:' + color)。
Vue2(vue-cli-plugin-uni):模板里 :style 不要写带参数的方法(如 :style="foo(x)"),请用计算属性在数据里先拼好样式字符串(本组件已用 messageRows[].bubbleStyle)。
电脑正常、真机 / 体验版无回复?
常见原因与排查:
-
开发者工具「不校验合法域名」
勾选后电脑端即使未配域名也能请求;真机与体验版一定会校验。请在微信公众平台 → 开发 → 开发管理 → 服务器域名 → request 合法域名 中添加https://API_BASE_URL里的主机名:API_BASE_URL(不要带https://、不要路径)。保存后等几分钟再测。 -
配置的
apiUrl与域名不一致
若apiUrl写成其它域名或 IP,白名单必须包含该主机名。 -
流式分块在真机异常(本插件已处理)
部分机型上enableChunked+onChunkReceived会导致success里 body 为空。插件对 微信小程序 已默认 关闭分块,等 SSE 整段结束后再解析(可能略晚于逐字显示,但能出字)。请更新到含该逻辑的stream-chat版本。 -
HTTPS / 证书
真机对证书链更严格;若自有域名,需完整证书链。 -
超时
长回答已把uni.requesttimeout 设为 120000 ms;仍失败可看fail里errMsg(如request:fail)。
平台说明
| 端 | 说明 |
|---|---|
| 微信小程序 | 需配置 request 合法域名。插件对微信 默认整包收 SSE(关闭分块),避免真机无内容。 |
| App | uni.request + 分块或整包解析。 |
| H5 | fetch + ReadableStream。 |
| 其它小程序 | 依赖各端对 uni.request 的实现,请在目标端自测;未实测端建议先在体验版验证。 |
安装
- 通过 DCloud 插件市场 导入本插件,或解压到项目根目录
uni_modules/sma-chat/(文件夹名须与插件package.json中id一致)。 - 无需在
pages.json注册组件:符合 easycom,模板中直接使用标签sma-chat-float。
快速使用
在常驻页面(如 Tab 首页或公共布局)挂载一次(全局被动 API 只关联最后一次挂载的实例):
<template>
<view class="page">
<sma-chat-float :config="chatConfig" />
<!-- 业务内容 -->
</view>
</template>
<script setup lang="ts">
import { ref } from 'vue';
const chatConfig = ref({
apiKey: 'YOUR_API_KEY',
agentCode: 'YOUR_AGENT_CODE',
apiUrl: 'https://API_BASE_URL', // 可选,默认同左
title: 'AI 助手',
themeColor: '#4F46E5',
position: 'bottom-right', // 或 bottom-left
});
</script>
仅被动打开(隐藏悬浮球)
<sma-chat-float :config="chatConfig" :show-launcher="false" />
import { smaChatOpen, smaChatClose, smaChatToggle } from '@/uni_modules/sma-chat/utils/controller';
// 任意业务逻辑中
smaChatOpen();
或使用组件 ref:defineExpose 已暴露 open / close / toggle。
Props
| 属性 | 类型 | 默认值 | 说明 |
|---|---|---|---|
config |
object |
必填 | 见下表 |
showLauncher |
boolean |
true |
是否显示右下角悬浮按钮 |
zIndex |
number |
99999 |
浮层 z-index |
config 字段
| 字段 | 必填 | 说明 |
|---|---|---|
apiKey |
是 | Bearer Token |
agentCode |
是 | 应用短码 |
apiUrl |
否 | 接口根地址,默认 https://API_BASE_URL |
title / subtitle |
否 | 标题与副标题 |
welcomeMessage |
否 | 首条助手欢迎语 |
themeColor |
否 | 主题色,默认 #4F46E5 |
position |
否 | bottom-right | bottom-left |
placeholder |
否 | 输入框占位 |
隐私与安全
- 插件通过 HTTPS 将对话内容、
apiKey、agentCode发往使用者配置的apiUrl,用于调用聊天接口;插件内不落库。 apiKey在客户端可见,生产环境强烈建议自建 BFF,小程序只请求自有域名。- 请在应用隐私政策中说明对话与接口传输范围。
目录结构
sma-chat/
├── package.json
├── readme.md
├── changelog.md
├── license.md
├── components/
│ ├── sma-chat-float/ # Vue3
│ │ └── sma-chat-float.vue
│ └── sma-chat-float-vue2/ # Vue2
│ └── sma-chat-float-vue2.vue
├── js_sdk/ # Vue2 使用(纯 JS)
│ ├── stream-chat.js
│ ├── controller.js
│ └── launcher-icons.js # 悬浮球扁平图标(data URI)
└── utils/ # Vue3 + TS
├── types.ts
├── stream-chat.ts
└── controller.ts
截图(插件市场展示)
请将实际运行效果图置于 static/screenshots/(上架时在网页端上传或按 HBuilderX 提示添加)。
开源与仓库
若本插件随 SMA 主仓库分发,仓库路径以作者发布页为准;也可在插件市场「更新日志」中填写 Git 地址。
许可
见 license.md。

收藏人数:
购买普通授权版(
试用
赞赏(0)
下载 0
赞赏 0
下载 11527177
赞赏 1903
赞赏
京公网安备:11010802035340号