lm-avatar-chat-sdk

概述

灵眸数字人对话web端sdk，是一个实时流媒体数字人Web SDK(JavaScript 库)，支持云端推流数字人和端到端渲染数字人，具备低延迟、高性能、高并发、跨平台等优势, 结合阿里云的RTC、语音交互、渲染引擎、脸部和肢体驱动等技术，提供多种数字人解决方案。

产品优势

● 高性能低延迟 ● 轻松集成、标准化输出 ● 多种数字人解决方案提供支持

产品能力

● 云端渲染数字人○ 云端渲染数字人是通过阿里云RTC提供视频流订阅，SDK在浏览器上拉取视频流呈现数字人的解决方案。○ 云端渲染数字人具备完整的语音交互、脸部和肢体驱动能力，提供数字人打断、多种对话模式。● 端侧渲染(端到端)数字人○ 端侧渲染数字人是通过阿里云RTC提供音频和模型脸部肢体动作数据，SDK在浏览器上通过拉取数据并使用WebGL渲染数字人的解决方案。○ 端侧渲染(端到端)数据人同样具备完整的语音交互、脸部和肢体驱动能力，同样提供数字人打断、多种对话模式。

快速开始

1. 安装依赖

npm install lm-avatar-chat-sdk

2. 设置挂载元素云端渲染数字人底层通过阿里云RTC进行音视频流的传输，需要挂载在一个video元素上。所以开发者要在页面html中先添加video容器元素。

<video id="cloudAvatarContainer" muted></video>

3. 创建云端渲染数字人

import {
  createAvatar,
  TYAvatarType,
  IAvatarInitConfig,
  TYVoiceChatMessage,
  TYVoiceChatMessageType,
  TYVoiceChatState,
  TYVoiceChatMode,
} from 'lm-avatar-chat-sdk';

const avatarInitParams = {
    rootContainer: '#cloudAvatarContainer',
    ...
} as IAvatarInitConfig // 另外一些rtc参数从服务端接口获取并填入

const avatar = createAvatar(TYAvatarType.cloudAvatar, avatarInitParams)

4. 启动对话

avatar.start({
  mode: TYVoiceChatMode.tap2talk,
})

5. 绑定事件回调并不是所有回调都需要绑定，建议开发者根据业务开发需求进行绑定即可

avatar.onFirstFrameReceived(() => {
  console.log('数字人渲染完毕')
})

avatar.onReadyToSpeech(() => {
  console.log('可以进行语音交互了')
})

avatar.onErrorReceived((err: TYError) => {
  console.log('数字人内部发生错误:' + err.code + ' ' + err.message)
  if (err.terminate) {
    // 服务端已退出，在这里可以执行业务前端退出
  }
})

avatar.onStateChanged((tyState: TYVoiceChatState) => {
  console.log('当前数字人状态' + tyState)
})

avatar.onVolumeChanged((data: TYVolume) => {
  if (data.source === TYVolumeSourceType.mic) {
    console.log('用户音量:' + data.volume)
  } else {
    console.log('数字人音量:' + data.volume)
  }
})
avatar.onMessageReceived((msg: TYVoiceChatMessage) => {
  if (msg.type === TYVoiceChatMessageType.speaking) {
    console.log('用户的对话文本内容', msg.text)
  } else {
    console.log('数字人的反馈文本内容', msg.text)
  }
})

6. 重要方法

// 暂停收音/恢复收音
avatar.muteLocalMic(mute: boolean)

// 打断
avatar.interrupt()

// 退出
avatar.exit()