Web integration guide for Real-time Conversational AI - Intelligent Media Services

Intégrez l'agent Real-time Conversational AI à votre application web.

Remarque

Pour tester rapidement un agent IA, consultez la rubrique Intégrer un agent IA via un extrait de code.

Code source

Lien de téléchargement

Téléchargez le code source depuis GitHub.

Structure des répertoires

.
└── React
    ├── README.md
    ├── eslint.config.js
    ├── index.html     // For PCs
    ├── mobile.html    // For mobile phones
    ├── package.json
    ├── src
    │   ├── Mobile     // Mobile UI
    │   ├── PC         // PC UI
    │   ├── common     // Common method
    │   ├── controller
    │   ├── interface.ts
    │   ├── runConfig.ts  // Runtime configurations
    │   ├── service
    │   └── vite-env.d.ts
    ├── tsconfig.app.json
    ├── tsconfig.json
    └── vite.config.ts

Avant de commencer

Développez les opérations API requises sur votre AppServer ou déployez le code source du serveur fourni. Pour plus d'informations, consultez la rubrique Déployer un projet.

Exécuter la démo

Accédez au répertoire React.
Exécutez npm install pour installer les dépendances.
Dans le fichier src/runConfig.ts, définissez l'adresse AppServer et l'ID de l'agent.

// src/runConfig.ts
const runConfig: AICallRunConfig = {
  // should be modified to region of your agent
  region: 'cn-shanghai',
  appServer: 'Your AppServer address',
  voiceAgentId: 'Your voice agent ID',
  avatarAgentId: 'Your avatar agent ID',
  visionAgentId: 'Your vision agent ID',
  // callTemplateConfig: callTemplateConfig,
};

Nom de la région

ID de région

Chine (Hangzhou)

cn-hangzhou

Chine (Shanghai)

cn-shanghai

Chine (Pékin)

cn-beijing

Chine (Shenzhen)

cn-shenzhen

Singapour

ap-southeast-1

Exécutez npm run dev pour démarrer le serveur de développement.