Web使用指南_智能媒体服务(IMS)-阿里云帮助中心

本文将介绍如何通过AICallKit SDK集成消息对话智能体到您的Web页面中。

环境要求

Node 18以上
NPM 10以上
webpack 5以上

集成SDK

npm install aliyun-auikit-aicall --save

SDK使用示例

import { AIChatEngine, AIChatAgentInfo, AIChatUserInfo } from 'aliyun-auikit-aicall';

const chatEngine = new AIChatEngine();

chatEngine.on('requestAuthToken', async (userId, callback) => {
  //必须要实现的回调，通过AppServer或者业务Server调用generateMessageChatToken OpenAPI获取Token
  

  // role 和 nonce 为可选参数
  return new AIChatAuthToken(appId, appSign, token, timestamp, role, nonce);

  // 如果您的返回值为包含 app_id、app_sign 的 JSON 数据，可以简化为
  // return AIChatAuthToken.fromData(data);
});

chatEngine.on('engineStateChange', (state) => {
  //Engine状态相关回调
});
chatEngine.on('receivedMessage', (message) => {
  //接收消息
});
chatEngine.on('errorOccurs', (error) => {
  //错误相关回调
});
chatEngine.on('receivedCustomMessage', (message) => {
  // 收到自定义消息
});
chatEngine.on('messagePlayStateChange', (message, state) => {
  //文本朗读状态回调
});

const userId = 'xxxx'; // 进入消息对话的用户id，建议使用业务系统的用户ID，不同用户应使用不同 userId
const agentId = 'xxxx'; // 控制台创建消息对话智能体的ID
const sessionId = ''; // 当前会话的唯一标识，如果为空，则使用userId+agentId作为唯一标识
const region = 'cn-xxxx'; // 智能体所在的区域，默认为 undefined，即 cn-shanghai
await chatEngine.startChat(new AIChatUserInfo(userId), new AIChatAgentInfo(agentId, region), sessionId);

API说明

API概览

类/协议	API	说明
AIChatEngine 消息对话引擎方法	state	当前引擎状态。
	userInfo	获取当前参与会话的用户信息。
	sessionId	当前会话的唯一标识。
	agentInfo	获取当前参与会话的智能体信息。
	agentResponseState	当前智能体回答状态。
	voiceIdList	当前音色列表。
	startChat	开始聊天会话。
	endChat	结束聊天会话。
	sendMessage	发送消息；如果当前有回复正在进行，则会打断该回复。
	queryMessageList	请求历史消息列表。
	interruptAgentResponse	打断当前的消息回复。
	deleteMessage	删除消息。
	startPlayMessage	开始播放消息内容。
	stopPlayMessage	停止播放消息。
	isPlayingMessage	检查是否正在播放消息。
	startPushVoiceMessage	按下按钮时开始录音并实时发送语音消息。
	finishPushVoiceMessage	松开按钮时结束录音并发送语音消息。
	cancelPushVoiceMessage	取消发送语音消息。
	createAttachmentUploader	创建附件上传器对象，附件类型可以是图片、文件等
	destroy	释放资源。
	parseShareAgentChat	解析分享的智能体信息。
	generateShareAgentChat	启动一个分享的智能体通话。
AIChatEngineEvents 消息对话引擎回调	errorOccurs	发生错误时触发。
	requestAuthToken	当ChatEngine需要执行IM登录或AuthToken过期时触发。
	engineStateChange	智能体连接状态改变时触发。
	receivedMessage	收到智能体的新回复或当前回复状态发生变化时触发。
	userMessageUpdated	用户发送的消息需要更新时触发。
	agentResponseStateChange	智能体响应状态改变时触发。
	messagePlayStateChange	消息播放状态改变时触发。
AIChatAttachmentUploader 附件上传器类	addAttachment	添加附件对象
	removeAttachment	删除附件对象
	allUploadSussess	所有附件是否都上传成功
AIChatAttachmentUploadEvents 附件上传器回调	uploadSuccess	上传成功回调
AIChatAttachmentUploadEvents 附件上传器回调	uploadFailure	上传失败回调
AIChatAttachmentEvents 附件对象回调	progress	上传进度更新
AIChatAttachmentEvents 附件对象回调	stateChange	上传状态变化回调

AIChatEngineInterface详情

state

当前引擎状态。

state: AIChatEngineState;

userInfo

获取当前参与会话的用户信息。

userInfo: AIChatUserInfo;

sessionId

当前会话的唯一标识。

sessionId: string;

agentInfo

获取当前参与会话的智能体信息。

agentInfo: AIChatAgentInfo;

agentResponseState

当前智能体回答状态。

agentResponseState: AIChatAgentResponseState;

voiceIdList

当前音色列表。

voiceIdList: string[];

startChat

开始聊天会话。

async startChat(userInfo: AIChatUserInfo, agentInfo: AIChatAgentInfo, sessionId?: string);

参数详情：

参数	类型	含义
userInfo	AIChatUserInfo	当前开始会话的用户信息
agentInfo	AIChatAgentInfo	当前开始会话的智能体消息
sessionId	string（可选）	当前会话的唯一标识，如果为空，则使用 `userId + agentId` 作为默认值

endChat

结束聊天会话。

async endChat(needLogout: boolean);

参数详情：

参数	类型	含义
needLogout	boolean	当前用户是否需要完全退出连接（设置为 false 可减少下次 `startChat` 的连接时间）

sendMessage

发送消息；如果当前有回复正在进行，则会打断该回复。

async sendMessage(message: AIChatMessage): Promise<AIChatMessage>;

参数详情：

参数	类型	含义
message	AIChatMessage	消息内容

queryMessageList

请求历史消息列表。

async queryMessageList(request: AIChatMessageListRequest): Promise<AIChatMessage[]>;

参数详情：

参数	类型	含义
request	AIChatMessageListRequest	请求模型

interruptAgentResponse

打断当前的消息回复。

interruptAgentResponse();

deleteMessage

删除消息。

async deleteMessage(dialogueIdOrMessage: string | AIChatMessage);

参数详情：

参数	类型	含义
dialogueIdOrMessage	string \| AIChatMessage	消息 ID 或消息对象

startPlayMessage

开始播放消息内容。

async startPlayMessage(message: AIChatMessage, voiceId?: string);

参数详情：

参数	类型	含义
message	AIChatMessage	要播放的消息
voiceId	string?	音色 ID

stopPlayMessage

停止播放消息。

stopPlayMessage();

isPlayingMessage

检查是否正在播放消息。

isPlayingMessage(dialogueId: string): boolean;

startPushVoiceMessage

按下按钮时开始录音并实时发送语音消息。确保已开启录音权限。

async startPushVoiceMessage(request: AIChatSendMessageRequest): Promise<AIChatMessage | undefined>;

finishPushVoiceMessage

松开按钮时结束录音并发送语音消息。

async finishPushVoiceMessage(): Promise<AIChatMessage | undefined>;

cancelPushVoiceMessage

取消发送语音消息。

cancelPushVoiceMessage();

createAttachmentUploader

创建附件上传器对象，附件类型可以是图片、文件等

/**
  * 创建附件上传器对象，只能创建一个
  * @return
*/
public async createAttachmentUploader(): Promise<AIChatAttachmentUploader>;

destroy

释放资源。

destroy();

parseShareAgentChat

解析分享的智能体信息。

parseShareAgentChat(shareInfo: string): AIChatAgentShareConfig | undefined;

参数详情：

参数	类型	含义
shareInfo	string	分享信息

generateShareAgentChat

启动一个分享的智能体通话。

async generateShareAgentChat(shareConfig: AIChatAgentShareConfig, userId: string);

参数详情：

参数	类型	含义
shareConfig	AIChatAgentShareConfig	分享信息
userId	string	用户 ID

AIChatEngineEvents详情

errorOccurs

发生错误时触发。

errorOccurs(error: AIChatError): void;

参数详情：

参数	类型	含义
error	Error	错误信息

requestAuthToken

当ChatEngine需要执行IM登录或AuthToken过期时触发。

requestAuthToken(userId: string, responseBlock: (authToken: AIChatAuthToken | undefined, error: Error | undefined) => void): void;

参数详情：

参数	类型	含义
userId	string	用户 ID
responseBlock	(authToken: AIChatAuthToken \| undefined, error: Error \| undefined) => void

engineStateChange

智能体连接状态改变时触发。

engineStateChange(state: AIChatEngineState): void;

参数详情：

参数	类型	含义
state	AIChatEngineState	当前连接状态

receivedMessage

收到智能体的新回复或当前回复状态发生变化时触发。

receivedMessage(message: AIChatMessage): void;

参数详情：

参数	类型	含义
message	AIChatMessage	消息对象

userMessageUpdated

用户发送的消息需要更新时触发。

userMessageUpdated(message: AIChatMessage): void;

参数详情：

参数	类型	含义
message	AIChatMessage	消息对象

agentResponseStateChange

智能体响应状态改变时触发。

agentResponseStateChange(state: AIChatAgentResponseState, requestId?: string): void;

参数详情：

参数	类型	含义
state	AIChatAgentResponseState	响应状态
requestId	string?	当前会话 ID

messagePlayStateChange

消息播放状态改变时触发。

messagePlayStateChange(message: AIChatMessage, state: AIChatMessagePlayState): void;

参数详情：

参数	类型	含义
message	AIChatMessage	消息对象
state	AIChatMessagePlayState	播放状态

AIChatAttachmentUploader

addAttachment

添加附件对象

/**
   * 添加附件
   * @param attachment
   */
public async addAttachment(attachment: AIChatAttachment);

参数详情：

参数	类型	含义
attachment	AIChatAttachment	附件对象

removeAttachment

删除附件对象

 /**
   * 删除附件
   * @param attachmentId
   */
public async removeAttachment(attachmentId: string)

参数详情：

参数	类型	含义
attachmentId	string	附件id

allUploadSussess

所有附件是否都上传成功

 /**
   * 所有附件是否都上传成功
   */
const uploadSussess = uploader.allUploadSussess

AIChatAttachmentUploadEvents

uploadSuccess

上传成功回调

uploadSuccess: (attachment: AIChatAttachment): void;

参数详情：

参数	类型	含义
attachment	ARTCAIChatAttachment	附件对象

uploadFailure

上传失败回调

uploadFailure: (attachment: AIChatAttachment, error: Error): void;

参数详情：

参数	类型	含义
attachment	ARTCAIChatAttachment	附件对象
error	Error	上传失败原因

AIChatAttachmentEvents

progress

上传进度更新

progress: (progress: number) => void;

参数详情：

参数	类型	含义
progress	number	当前上传进度

stateChange

上传状态变化回调

stateChange: (state: AIChatAttachmentState) => void;

参数详情：

参数

类型

含义

state

AIChatAttachmentState

上传状态：

Init：初始化
Uploading：上传中
Success：上传成功
Failed：上传失败