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

通过阅读本文，您可以了解如何在Web端接入AI实时互动应用。

说明

源码说明

源码下载

源码结构

.
└── React
    ├── README.md
    ├── eslint.config.js
    ├── index.html     // PC版入口
    ├── mobile.html    // 手机版入口
    ├── package.json
    ├── src
    │   ├── Mobile     // 手机版UI实现
    │   ├── PC         // PC版UI实现
    │   ├── common     // 公共业务方法
    │   ├── controller
    │   ├── interface.ts
    │   ├── runConfig.ts  // 运行时配置
    │   ├── service
    │   └── vite-env.d.ts
    ├── tsconfig.app.json
    ├── tsconfig.json
    └── vite.config.ts

前提条件

已在您的服务端上开发了相关接口或直接部署提供的Server源码，搭建步骤请参见项目部署。

跑通Demo

源码下载后，进入React目录。
在React目录下，执行npm install，安装依赖。

打开文件 src/runConfig.ts，修改应用服务器地址和智能体Id（可以只修改需要使用的智能体类型的Id）。

// src/runConfig.ts
const runConfig: AICallRunConfig = {
  // 需要修改为您智能体所在的区域
  // should be modified to region of your agent
  region: 'cn-shanghai',
  appServer: '您的应用服务器地址',
  voiceAgentId: '您的语音通话智能体id',
  avatarAgentId: '您的数字人智能体id',
  visionAgentId: '您的视觉智能体id',
  // callTemplateConfig: callTemplateConfig,
};

地域名称	Region Id
华东1（杭州）	cn-hangzhou
华东2（上海）	cn-shanghai
华北2（北京）	cn-beijing
华南1（深圳）	cn-shenzhen
新加坡	ap-southeast-1

执行命令npm run dev，启动本地服务。