你是否在使用数字人时遇到卡顿、延迟和无法即时打断的问题？这并非大模型本身的缺陷，而是底层传输与渲染架构拖后腿导致。

主要 API：一步搞定实时交互

握手与初始化阶段

• 实例配置: 传入AppIDAppSecret和gatewayServer建立与云端的鉴权连接。
• 挂载画布: 绑定前端 DOM 容器，开启硬件加速提高渲染帧率。
• 资源下载: 调用avatar.init,拉取3D模型与骨骼动画资产。
• 唤醒首帧: 加载完成后立即下发无声指令avatar.speak。强制浏览器打破自动播放限制，渲染第一帧画面。

状态监听与代理阶段

This is core of brain and body linkage:

• 监听嘴巴动作: 使用,实时监控数字人是否在发声 并将状态存入全局变量.
• 接管业务组件: 配置. 当后端大模型下发商品展示指令时前端拦截该指令并在右侧业务大屏上渲染高清商品图。

主要交互流转

• 检测状态: 检查。是否为true.
• 执行打断: 若正在说话，先调用,强行切换至待命状态。
• 驱动播报: 调用,将新文本转换为口型、表情和语音同步输出。

生命周期终结

• 释放连接: 在页面关闭或刷新时触发

  window.addEventListener => { if avatar.destroy;})，

• 防止溢出/Token泄漏: 通知云端“当前屏幕已下线”。释放占用Token，以免下一次连接报并发超限错误。

最简可运行 Demo

以下代码已包含所有必要依赖，可直接粘贴到本地HTML文件运行。低配机也能流畅体验实时交互数字人。