Web使用指南

更新时间:2025-04-03 02:01:43

本文将介绍如何将AICallKit SDK集成到您的Web应用中。

集成SDK

npm install aliyun-auikit-aicall --save

SDK使用示例

// 引入SDK
import AICallEngine, { AICallErrorCode, AICallAgentState, AICallAgentType } from 'aliyun-auikit-aicall';

// 创建engine实例
const engine = new AICallEngine();

// 其他功能调用示例,请参考API说明

// 回调处理(仅示例不分核心的回调操作)
engine.on('errorOccurred', (code) => {
  // 发生了错误
  engine.handup();
});

engine.on('callBegin', () => {
  // 通话开始
});

engine.on('callEnd', () => {
  // 通话结束
});

engine.on('agentStateChanged', (state) => {
  // 智能体状态改变
});

engine.on('userSubtitleNotify', (subtitle) => {
  // 用户提问被智能体识别结果的通知
});

engine.on('agentSubtitleNotify', (subtitle) => {
  // 智能体回答结果通知
});

engine.on('voiceIdChanged', (voiceId) => {
  // 当前通话的音色发生了改变
});

engine.on('voiceInterruptChanged', (enable) => {
  // 当前通话的语音打断是否启用
});

const userId = 'UserId';

// 从服务端获取 agentInfo
// 您需要部署自己的 AppServer,访问 GenerateAIAgentCall 接口生成AI智能体通话实例
// 其中的返回值即为 agentInfo
// agentInfo.instanceId 智能体实例ID
// agentInfo.channelId: ARTC频道ID
// agentInfo.userId: ARTC用户ID
// agentInfo.rtcToken: ARTC入会Token
// agentInfo.reqId: 请求ID
const agentInfo = await fetchAgentInfo();
// 可以与 fetchAgentInfo 并行处理, agentType 为智能体类型,参考 AICallAgentType
await engine.init(agentType);

try {
  // 启动智能体后,开始通话
  engine.call(userId, agentInfo);
} catch (error) {}

// 结束通话,在需要时调用
engine.handup();

API说明

属性说明

字段

描述

字段

描述

userId

获取当前通话的UserId

isOnCall

是否通话中

agentInfo

获取当前智能体信息

agentState

获取当前智能体状态

API概览

类/协议

API

说明

类/协议

API

说明

ARTCAICallEngine

引擎接口定义

call

开始通话

handup

挂断

说明

建议您在页面退出前(例如监听beforeunload事件)主动调用handup挂断通话,否则Agent需要等待约90秒才会退出,可能会导致数字人并发超限等问题。

setAgentView

设置智能体渲染视图,及缩放模式

interruptSpeaking

打断智能体讲话

enableVoiceInterrupt

开启/关闭智能打断

startPreview

设置本地预览地址

muteLocalCamera

开关摄像头推送

switchCamera

切换摄像头

switchVoiceId

切换音色

mute

静音/取消禁音麦克风

startPushToTalk

对讲机模式下,开始讲话

finishPushToTalk

对讲机模式下,结束讲话

cancelPushToTalk

对讲机模式下,取消这次讲话

enablePushToTalk

开启/关闭对讲机模式,对讲机模式下,只有在finishPushToTalk被调用后,智能体才会播报结果

getRTCInstance

获取RTC引擎

sendTextToAgent

给智能体发送文本消息

sendCustomMessageToServer

Server发送自定义消息

updateLlmSystemPrompt

更新llm的系统提示词

startVisionCustomCapture

Vision智能体,开始启动自定义截帧,启动后,无法通过语音与智能体通话

stopVisionCustomCapture

Vision智能体,结束自定义截帧

destroy

释放资源

ARTCAICallEngine

引擎回调事件

errorOccurred

发生了错误

callBegin

通话开始

callEnd

通话结束

agentStateChanged

智能体状态改变

speakingVolumeChanged

音量变化

userSubtitleNotify

用户提问被智能体识别结果的通知

agentSubtitleNotify

智能体回答结果通知

voiceIdChanged

当前通话的音色发生了改变

pushToTalkChanged

对讲机模式发生变化

agentWillLeave

当前智能体即将离开(结束当前通话)

receivedAgentCustomMessage

收到当前智能体发过来的自定义消息

voiceInterruptChanged

当前通话的语音打断是否启用

humanTakeoverWillStart

真人即将接管当前智能体

humanTakeoverConnected

当真人接管已经接通

ARTCAICallEngine 详情

call

开始通话

async call(userId: string, agentInfo: AICallAgentInfo, config?: AICallEngineConfig): Promise<void>>

参数详情:

参数

类型

含义

参数

类型

含义

userId

String

当前用户uid

agentInfo

AICallAgentInfo

智能体信息

config

AICallEngineConfig

初始化配置,类型定义:

{
  //是否静音麦克风
  muteMicrophone?: boolean;
  //视觉理解模式是否关闭摄像头
  muteCamera?: boolean;
  //是否开启按住说话
  enablePushToTalk?: boolean;
  //视觉理解模式 预览视频元素
  previewElement?: string | HTMLVideoElement;
  //视觉理解模式 摄像头设置
  cameraConfig?: AICallCameraConfig;
}

handup

退出通话

async handup(): Promise<void>

setAgentView

设置智能体渲染视图,及视图模式

setAgentView(view: HTMLVideoElement | string): void

参数详情:

参数

类型

含义

参数

类型

含义

view

HTMLVideoElement | string

video 标签或者对应的 id

interruptSpeaking

打断智能体讲话

async interruptSpeaking(): Promise<void>

enableVoiceInterrupt

开启/关闭智能打断

async enableVoiceInterrupt(enable: boolean): Promise<void>

参数详情:

参数

类型

含义

参数

类型

含义

enable

boolean

开启/关闭

startPreview

设置本地预览地址

startPreview(view: HTMLVideoElement | string): void

参数详情:

参数

类型

含义

参数

类型

含义

view

HTMLVideoElement | string

video 标签或者对应的 id

muteLocalCamera

开关摄像头推送

async muteLocalCamera(mute: boolean)

参数详情:

参数

类型

含义

参数

类型

含义

mute

boolean

是否开启摄像头

switchCamera

切换摄像头

async switchCamera(deviceId?: string)

参数详情:

参数

类型

含义

参数

类型

含义

deviceId

string

设备 Id,可以通过 ARTCAICallEngine.getCameraList() 获取,不传在手机端会切换前后置摄像头。

switchVoiceId

切换音色

async switchVoiceId(voiceId: string): Promise<void>

参数详情:

参数

类型

含义

参数

类型

含义

voiceId

string

音色id

mute

静音/取消禁音麦克风

async mute(mute: boolean): Promise<void>

参数详情:

参数

类型

含义

参数

类型

含义

mute

boolean

静音/取消禁音

startPushToTalk

对讲机模式下,开始讲话

startPushToTalk() :boolean;

finishPushToTalk

对讲机模式下,结束讲话

finishPushToTalk() :boolean;

cancelPushToTalk

对讲机模式下,取消这次讲话

cancelPushToTalk() :boolean;

enablePushToTalk

开启/关闭对讲机模式,对讲机模式下,只有在finishPushToTalk被调用后,智能体才会播报结果

enablePushToTalk(enable: boolean):boolean;

参数详情:

参数

类型

含义

参数

类型

含义

enable

Bool

关闭或启用

getRTCInstance

获取RTC引擎

getRTCInstance(): AliRtcEngine | undefined

sendTextToAgent

给智能体发送文本消息

sendTextToAgent(req: AICallSendTextToAgentRequest);

参数详情:

参数

类型

含义

参数

类型

含义

req

AICallSendTextToAgentRequest

发送的消息结构体

new AICallSendTextToAgentRequest(text)

sendCustomMessageToServer

Server发送自定义消息,需要在接通后调用

sendCustomMessageToServer(msg: string)

参数详情:

参数

类型

含义

参数

类型

含义

msg

string

发送内容

updateLlmSystemPrompt

更新LLM的系统提示词,需要在接通后调用。

updateLlmSystemPrompt(prompt: string)

参数详情:

参数

类型

含义

参数

类型

含义

prompt

string

提示词

startVisionCustomCapture

视觉理解智能体,开始启动自定义截帧,启动后,无法通过语音与智能体通话,需要在接通后调用

startVisionCustomCapture(req: AICallVisionCustomCaptureRequest)

参数详情:

参数

类型

含义

参数

类型

含义

req

AICallVisionCustomCaptureRequest

配置信息

{
  /**
   * 请求多模态大模型时的文本参数
   */
  text?: string;

  /**
   * 为true时表示单次截帧,截帧后立即退出自定义截帧状态;
   * 为false时表示持续截帧,达到duration后会自动退出自定义截帧状态
   */
  isSingle?: boolean;

  /**
   * 截帧间隔时长
   * 默认 5 秒一次
   */
  eachDuration?: number;

  /**
   * 每次截帧的图片数量
   * 默认 2
   */
  num?: number;

  /**
   * 持续截帧的时长(秒),如果isSingle=true,则忽略,否则达到该设定时长时会结束自定义截帧状态
   */
  duration?: number;

  /**
   * json字符串,自定义业务信息,跟随text和图片帧一同传给大模型,用于企业做业务处理
   */
  userData?: string;
}

stopVisionCustomCapture

视觉理解智能体,结束自定义截帧,需要在接通后调用

stopVisionCustomCapture()

destroy

释放资源

async destroy()

ARTCAICallEngine事件详情

errorOccurred

当前通话时发生了错误

参数详情:

参数

类型

含义

参数

类型

含义

code

AICallErrorCode

错误类型

callBegin

通话开始

callEnd

通话结束

agentStateChanged

智能体状态改变

参数详情:

参数

类型

含义

参数

类型

含义

state

AICallAgentState

当前智能体状态:聆听中\思考中\讲话中

speakingVolumeChanged

音量变化通知

参数详情:

参数

类型

含义

参数

类型

含义

uid

string

当前讲话人的uid,当前用户为空字符串

volume

Int32

音量[0-100]

userSubtitleNotify

用户提问被智能体识别结果的通知

参数详情:

参数

类型

含义

参数

类型

含义

subtitle

AICallSubtitleData

字幕信息

agentSubtitleNotify

智能体回答结果通知

参数详情:

参数

类型

含义

参数

类型

含义

subtitle

AICallSubtitleData

字幕信息

voiceIdChanged

当前通话的音色发生了改变

参数详情:

参数

类型

含义

参数

类型

含义

voiceId

string

当前音色Id

pushToTalkChanged

对讲机模式发生变化

参数详情:

参数

类型

含义

参数

类型

含义

enable

boolean

是否启用

agentWillLeave

当前智能体即将离开(结束当前通话)

参数详情:

参数

类型

含义

参数

类型

含义

reason

number

离开原因:2001(闲时退出) 0(其他)

message

string

离开原因的描述

receivedAgentCustomMessage

收到当前智能体发过来的自定义消息

参数详情:

参数

类型

含义

参数

类型

含义

data

Object

消息内容

voiceInterruptChanged

当前通话的语音打断是否启用

参数详情:

参数

类型

含义

参数

类型

含义

enable

boolean

是否启用

humanTakeoverWillStart

真人即将接管当前智能体

参数详情:

参数

类型

含义

参数

类型

含义

takeoverUid

string

真人uid

takeoverMode

number

1:表示使用真人音色输出;0:表示使用智能体音色输出

humanTakeoverConnected

真人接管已经接通

参数详情:

参数

类型

含义

参数

类型

含义

takeoverUid

string

真人uid

agentEmotionNotify

智能体情绪结果通知

参数详情:

参数

类型

含义

参数

类型

含义

emotion

string

情绪标签,例如:neutral\happy\angry\sad 等

userAsrSentenceId

number

回答用户问题的句子ID

  • 本页导读 (1)
  • 集成SDK
  • SDK使用示例
  • API说明
  • 属性说明
  • API概览
  • ARTCAICallEngine 详情
  • ARTCAICallEngine事件详情
AI助理

点击开启售前

在线咨询服务

你好,我是AI助理

可以解答问题、推荐解决方案等