内嵌客服系统选H5还是SDK
作者:沈知|更新于 2026-10-25
App 做到一定阶段,就会有人提出来,App 里要加个客服。客户有问题,别让他跑去打电话、加微信,在 App 里直接问。这就是内嵌客服系统要做的事。
客服的聊天窗口装在你自己的 App 里,客户不出 App 就能和客服聊。
开发面前一般有两条路。一条是放一个 WebView,打开 H5 客服页;另一条是装客服系统的原生 SDK。
原生开发的 App,优先装 SDK。用 uni-app、React Native、Flutter 做的 App,用 WebView 打开 H5 客服页。两条路聊天本身差不多,差别在客户离开 App 以后。
内嵌客服的两条路
H5 客服页就是一个网址,点开是一整页的聊天,合从里叫对话链接(点开就能聊的网址是怎么回事)。浏览器能打开,App 里的 WebView 也能打开。WebView 一放,地址一填,就能聊。同一个页面也常挂在推广落地页上(H5 落地页怎么接在线客服)。
SDK 是装进 App 的原生包,合从有 iOS 和 Android 两端。Android 从 Maven Central 加一行依赖,iOS 用 Swift Package Manager 加进来。然后写两行代码,一行登记渠道 ID,一行在「联系客服」按钮上打开客服页。
要填的只有渠道 ID,不用密钥、证书,也不用备案域名。版本要求是 iOS 13 及以上、Android 5.0 及以上。
客户点开看到的是原生的对话界面,发图片视频、按住说话、看客服发来的商品卡和订单卡,都在 App 里完成。

不管走哪条,客户发来的消息都进同一个工作台,也就是客服回消息的那个页面。分配规则、技能组、AI 机器人的处理方式都一样。选哪条路,不影响客服那边怎么接。
差就差在客户离开 App 以后
客户问完一句就切出去了,或者干脆把 App 关了。客服十分钟后才回。
H5 这条路,客户关掉页面就收不到提醒了。消息不会丢,下次打开都在,但他不知道客服已经回了。
SDK 这条路多了两样。一样是未读红点。这个默认是关的,开发调一次 startUnreadTracking 把它打开。之后客户回到 App 时,SDK 查一下有几条没看,你把数字画在客服入口上。
另一样是离线消息通知。先在工作台这个 App 渠道的「离线消息通知」里,填上你服务端的回调地址。客户不在时人工客服回了消息,合从把这条消息发到你的服务端,你用自己的推送通道推给他。机器人回复和自动回复发出的消息,不会通知。推送证书本来就在你手里,所以推送由你发,合从只负责通知你。
还有权限说明。客户要发语音、拍照,App 得先拿到麦克风和相机权限。应用市场要求申请权限时说明用途。SDK 在 Android 上内置了说明弹窗,iOS 那边在 Info.plist 里填两句用途说明就行。H5 这条路,这个弹窗要自己在 WebView 的权限回调里做。

放在一张表里看。
| H5 客服页(WebView) | 原生 SDK | |
|---|---|---|
| 开发量 | 放一个 WebView,填地址 | 加依赖,写两行代码 |
| 客户离开后 | 收不到提醒,下次打开能看到 | 有未读红点;接上服务端还能推送 |
| 权限说明弹窗 | 自己在 WebView 里做 | Android 内置,iOS 填 Info.plist |
| 页面形态 | 整页,可隐藏自带标题栏 | 整页、半屏弹层、嵌进自己的页面、整屏沉浸 |
| 怎么测 | 浏览器就能打开 | 只能在真机或模拟器里测 |
| 适合的工程 | uni-app、React Native、Flutter | 原生 iOS、Android,包括原生里嵌了几个 H5 页的 |
原生装 SDK,跨平台用 WebView
按工程类型来选,基本不会错。
原生开发的 App,直接装 SDK。原生工程里嵌了几个 H5 页面的混合 App,也算原生,照样装 SDK(安卓 App 怎么接客服 SDK)。
uni-app、React Native、Flutter 做的 App,合从没有这几个框架的插件包,用各自的 WebView 组件打开对话链接。uni-app 用 web-view(uni-app 里接客服的现成代码),React Native 用 react-native-webview,Flutter 用 webview_flutter。
跨平台框架又想要红点和推送,也有办法。框架能写原生模块的,在原生层集成 SDK,再从 JS 那边调用打开客服。建议直接打开 SDK 的整页客服页,别把客服视图嵌进框架自己的视图里。合从没在这几个框架上验证过,具体怎么集成,以框架自己的文档为准。
什么时候没必要上 SDK?客户一般当场问完、等着回,客服也回得快,H5 就够了。客户问完就走、回复要追到他手机上的,比如售后、订单问题,就上 SDK。
走 H5,先把这四件事办了
H5 客服页就是一个网页。放进 App 以后,这几处不处理,功能就会缺。

WebView 的几个开关。 用 React Native、Flutter 这类能拿到底层 WebView 配置的框架时,要确认这几项。
- Android 要实现
onShowFileChooser,不然客户点发图片没反应; javaScriptEnabled和domStorageEnabled要开,前者不开页面不工作,后者不开客户每次进来都是新访客;- 要发语音,在
onPermissionRequest里放行音频采集,manifest 里RECORD_AUDIO和MODIFY_AUDIO_SETTINGS成对声明。只声明前一个,客户点了允许还是提示麦克风被占用; - iOS 在 Info.plist 补上麦克风和相机的用途说明,不然客户点录音 App 会闪退;
- iOS 把
allowsInlineMediaPlayback设成 true,不然视频会被系统全屏播放器接管。
uni-app 的 web-view 不开放这些配置,能做到哪步看框架本身。
- Android 要实现
带上会员身份。客户在 App 里已经登录,打开客服时在链接后面拼上会员 ID 和称呼(
?u=会员ID&n=张三),客服就知道是谁在问。网址上的参数客户自己能改,把u改成别人的,就能看到别人的对话,所以会员 ID 别用顺序编号、手机号这类能猜到的。App 已经有自己的标题栏的话,再加上hh=1,把聊天页自带的标题栏藏掉。退出登录要解绑。同一台手机,A 退出了,B 没登录就点开客服,会顶着 A 的身份进来,看到 A 的聊天记录。所以退出登录时,要把客服这边的身份也收回来。H5 和 SDK 都有对应的解绑方法。
链接用哪个。合从给的现成链接要先做实名认证才能打开,而且这个域名不承诺一直能用,重要的地方别用它。App 要长期挂着的,用自有域名部署更稳,也就是把一个页面文件放到你自己的域名下。
动手前先看效果
SDK 有一个示范 App。扫码装上,填上你自己的渠道 ID,消息直接进你的工作台。先确认渠道和账号这边是通的,之后自己集成再出问题,范围就缩到了工程配置。
H5 那边更简单,浏览器打开链接,就是客户会看到的样子。
先按工程类型定路:原生装 SDK,跨平台用 WebView。再想一下,客户问完就走的时候,客服的回复要不要追到他手机上。要,就上 SDK。
常见问题
app内嵌客服是什么意思?
就是把客服的聊天窗口装进自己的 App。客户在 App 里点「联系客服」就能和客服对话,不用跳出去。做法就是上面说的两种,WebView 打开 H5 客服页,或者装原生 SDK。
网站和 App 里都有客服,同一个客户能认成一个人吗?
能。网站、对话链接、App 在接入时传同一个客户 ID,系统就会认成同一个人,客户资料里能看到他在各处的全部对话。不传的话,默认算不同的客户。
App 渠道的客服地址,为什么在浏览器里打不开?
App 渠道的会话只能从装了 SDK 的 App 里发起。在浏览器里打开渠道地址,只会看到一张提示页,让你到 App 里打开。验证接入要装到真机或模拟器上,先装示范 App,不用等自己的工程集成完。