Créez une application Google Chat avec un agent Agent2UI

Cette page explique comment créer un module complémentaire Google Workspace qui fonctionne dans Google Chat et qui interagit avec un agent d'IA utilisant le protocole Agent2UI (A2UI). Vous développez l'agent à l'aide de l'Agent Development Kit (ADK) et l'hébergez dans Vertex AI Agent Engine.

Les agents IA perçoivent leur environnement de manière autonome, raisonnent et exécutent des actions complexes en plusieurs étapes pour atteindre un objectif défini. Dans ce tutoriel, vous allez déployer un agent d'IA de base qui renvoie des informations de profil statiques extraites d'un outil.

A2UI permet aux agents d'IA de générer des UI adaptatives, riches et interactives qui s'affichent de manière native. Vous pouvez ensuite vous concentrer sur la logique des agents d'IA, et non sur les UI.

  • L'agent A2UI répond à l'utilisateur avec un message contenant du texte et une fiche contenant le nom du profil, l'image et le bouton LinkedIn.
    Figure 1. L'agent A2UI répond à l'utilisateur avec du texte et une fiche contenant le nom, l'image et le bouton LinkedIn.
  • L'agent A2UI est également mis à jour pour renvoyer le titre du profil.
    Figure 2 : L'agent A2UI est mis à jour pour renvoyer également le titre du profil.
  • L'agent A2UI répond à l'utilisateur par un message qui affiche le nom du profil dans la fiche.
    Figure 3. L'agent A2UI répond à l'utilisateur par un message qui affiche le nom du profil dans la fiche.

Le diagramme suivant illustre l'architecture et le modèle de messagerie :

Architecture d'une application de chat implémentée avec un agent IA A2UI.

Dans le diagramme, un utilisateur qui interagit avec une application de chat implémentée avec un agent A2UI suit le flux d'informations suivant :

  1. Un utilisateur envoie un message à une application Chat, en passant par un message privé ou un espace Chat.
  2. La logique de l'application Chat, implémentée dans Apps Script ou en tant que serveur Web avec des points de terminaison HTTP, reçoit et traite le message.
  3. L'agent A2UI hébergé avec Vertex AI Agent Engine reçoit et traite l'interaction.
  4. L'application Chat ou l'agent d'IA peuvent éventuellement s'intégrer aux services Google Workspace, tels que Google Agenda ou Google Sheets, ou à d'autres services Google, tels que Google Maps ou YouTube.
  5. L'application Chat génère et envoie des réponses adaptatives de manière asynchrone, en utilisant l'API Google Chat pour communiquer la progression de l'agent d'IA.
  6. Les réponses sont envoyées à l'utilisateur.

Objectifs

  • configurer votre environnement ;
  • Déployez l'agent A2UI.
  • Déployez l'application Chat.
  • Configurez l'application Chat.
  • Testez l'application Chat.

Prérequis

Configurer votre environnement

Activer les API Google Cloud

Avant d'utiliser les API Google, vous devez les activer dans un projet Google Cloud. Vous pouvez activer une ou plusieurs API dans un même projet Google Cloud.

  • Dans la console Google Cloud, activez les API Google Chat, Vertex AI et Cloud Resource Manager.

    Activer les API

Configurer l'écran d'autorisation OAuth

Toutes les applications utilisant OAuth 2.0 nécessitent une configuration de l'écran de consentement. La configuration de l'écran de consentement OAuth de votre application définit ce qui est affiché aux utilisateurs et aux évaluateurs de l'application, et enregistre votre application pour que vous puissiez la publier ultérieurement.

  1. Dans la console Google Cloud, accédez à Menu  > Google Auth platform > Branding.

    Accéder à la page "Branding"

  2. Si vous avez déjà configuré Google Auth platform, vous pouvez configurer les paramètres de l'écran de consentement OAuth suivants dans Branding, Audience et Accès aux données. Si le message Google Auth platform pas encore configuré s'affiche, cliquez sur Premiers pas :
    1. Sous Informations sur l'application, dans Nom de l'application, saisissez le nom de l'application.
    2. Dans Adresse e-mail d'assistance utilisateur, sélectionnez une adresse e-mail d'assistance que les utilisateurs pourront contacter s'ils ont des questions sur leur consentement.
    3. Cliquez sur Suivant.
    4. Sous Audience, sélectionnez Interne.
    5. Cliquez sur Suivant.
    6. Sous Coordonnées, saisissez une adresse e-mail à laquelle vous recevrez des notifications en cas de modification de votre projet.
    7. Cliquez sur Suivant.
    8. Sous Terminer, consultez le Règlement sur les données utilisateur dans les services d'API Google et, si vous l'acceptez, sélectionnez J'accepte le Règlement sur les données utilisateur dans les services d'API Google.
    9. Cliquez sur Continuer.
    10. Cliquez sur Créer.
  3. Pour l'instant, vous pouvez ignorer l'ajout de niveaux d'accès. À l'avenir, lorsque vous créerez une application à utiliser en dehors de votre organisation Google Workspace, vous devrez définir le type d'utilisateur sur Externe. Ajoutez ensuite les niveaux d'autorisation dont votre application a besoin. Pour en savoir plus, consultez le guide complet Configurer l'écran de consentement OAuth.

Créer un compte de service dans la console Google Cloud

Créez un compte de service avec le rôle Vertex AI User en procédant comme suit :

Console Google Cloud

  1. Dans la console Google Cloud, accédez au menu  > IAM et administration > Comptes de service.

    Accéder à la page "Comptes de service"

  2. Cliquez sur Créer un compte de service.
  3. Renseignez les détails du compte de service, puis cliquez sur Créer et continuer.
  4. Facultatif : Attribuez des rôles à votre compte de service pour lui accorder l'accès aux ressources de votre projet Google Cloud. Pour en savoir plus, consultez Accorder, modifier et révoquer les accès à des ressources.
  5. Cliquez sur Continuer.
  6. Facultatif : Saisissez les utilisateurs ou les groupes qui peuvent gérer ce compte de service et effectuer des actions avec. Pour en savoir plus, consultez Gérer l'emprunt d'identité d'un compte de service.
  7. Cliquez sur OK. Notez l'adresse e-mail du compte de service.

CLI gcloud

  1. Créez le compte de service : 
    gcloud iam service-accounts create SERVICE_ACCOUNT_NAME \
  --display-name="SERVICE_ACCOUNT_NAME"
  2. Facultatif : Attribuez des rôles à votre compte de service pour lui accorder l'accès aux ressources de votre projet Google Cloud. Pour en savoir plus, consultez Accorder, modifier et révoquer les accès à des ressources.

Le compte de service s'affiche sur la page "Comptes de service".

Créer une clé privée

Pour créer et télécharger une clé privée pour le compte de service, procédez comme suit :

  1. Dans la console Google Cloud, accédez à Menu > IAM & Admin > Comptes de service.

    Accéder à la page "Comptes de service"

  2. Sélectionnez votre compte de service.
  3. Cliquez sur Clés > Ajouter une clé > Créer une nouvelle clé.
  4. Sélectionnez JSON, puis cliquez sur Créer.

    Votre nouvelle paire de clés publique/privée est générée et téléchargée sur votre machine sous forme de nouveau fichier. Enregistrez le fichier JSON téléchargé sous le nom credentials.json dans votre répertoire de travail. Ce fichier est l'unique copie de cette clé. Pour plus d'informations sur la manière de stocker votre clé en toute sécurité, consultez Gestion des clés de compte de service.

  5. Cliquez sur Fermer.

Pour plus d'informations sur les comptes de service, consultez comptes de service dans la documentation Google Cloud IAM.

Déployer l'agent A2UI

  1. Si vous ne l'avez pas encore fait, authentifiez-vous avec votre compte Google Cloud et configurez l'interface de ligne de commande Google Cloud pour utiliser votre projet Google Cloud.

    gcloud auth application-default login
gcloud config set project PROJECT_ID
gcloud auth application-default set-quota-project PROJECT_ID

    Remplacez PROJECT_ID par l'ID de votre projet Cloud.

  2. Téléchargez le dépôt GitHub googleworkspace/add-ons-samples à l'aide de ce bouton :

    Télécharger le dépôt

  3. Dans votre environnement de développement local préféré, extrayez le fichier d'archive téléchargé et ouvrez le répertoire add-ons-samples/apps-script/chat/a2ui-ai-agent/a2ui.

    unzip add-ons-samples-main.zip
cd add-ons-samples/apps-script/chat/a2ui-ai-agent/a2ui

  4. Créez un nouveau compartiment Cloud Storage dédié à l'agent ADK.

    gcloud storage buckets create gs://CLOUD_STORAGE_BUCKET_NAME --project=PROJECT_ID --location=PROJECT_LOCATION

    Remplacez les éléments suivants :

    1. CLOUD_STORAGE_BUCKET_NAME avec un nom de compartiment unique que vous souhaitez utiliser.
    2. PROJECT_ID par l'ID de votre projet Cloud.
    3. PROJECT_LOCATION avec l'emplacement de votre projet Cloud.

  5. Définissez les variables d'environnement suivantes :

    export GOOGLE_GENAI_USE_VERTEXAI=true
export GOOGLE_CLOUD_PROJECT=PROJECT_ID
export GOOGLE_CLOUD_LOCATION=PROJECT_LOCATION
export GOOGLE_CLOUD_STORAGE_BUCKET=CLOUD_STORAGE_BUCKET_NAME

    Remplacez les éléments suivants :

    1. CLOUD_STORAGE_BUCKET_NAME avec le nom du compartiment que vous avez créé.
    2. PROJECT_ID par l'ID de votre projet Cloud.
    3. PROJECT_LOCATION avec l'emplacement de votre projet Cloud.

  6. Installez et déployez l'agent ADK depuis l'environnement virtuel.

    python3 -m venv myenv
source myenv/bin/activate
poetry install --with deployment
python3 deployment/deploy.py --create

  7. Récupérez l'identifiant de l'agent. Vous en aurez besoin plus tard, lors de la configuration de l'application Chat.

    python3 deployment/deploy.py --list

Créer et configurer le projet d'application de chat

  1. Cliquez sur le bouton suivant pour ouvrir le projet Apps Script A2UI AI Agent Quickstart.

    Ouvrir le projet

  2. Cliquez sur Aperçu > L'icône pour faire une copie Faire une copie.

  3. Dans votre projet Apps Script, cliquez sur Icône des paramètres du projet Paramètres du projet > Modifier les propriétés du script > Ajouter une propriété de script pour ajouter les propriétés de script suivantes :

    1. REASONING_ENGINE_RESOURCE_NAME avec le nom de ressource de l'agent Vertex AI copié dans les étapes précédentes.
    2. SERVICE_ACCOUNT_KEY avec la clé JSON du compte de service téléchargée lors des étapes précédentes, comme { ... }.

  4. Cliquez sur Enregistrer les propriétés de script.

  5. Dans la console Google Cloud, accédez à Menu > IAM & Admin > Paramètres.

    Accéder à la page Paramètres de la section IAM et administration

  6. Dans le champ Numéro de projet, copiez la valeur.

  7. Dans votre projet Apps Script, cliquez sur Icône des paramètres du projet Paramètres du projet.

  8. Sous Projet Google Cloud Platform (GCP), cliquez sur Changer de projet.

  9. Dans GCP project number, collez le numéro de projet Google Cloud copié dans les étapes précédentes.

  10. Cliquez sur Définir un projet. Le projet Cloud et le projet Apps Script sont désormais connectés.

Créer un déploiement de test

Vous avez besoin d'un ID de déploiement pour ce projet Apps Script afin de pouvoir l'utiliser à l'étape suivante.

Pour obtenir l'identifiant de déploiement principal, procédez comme suit :

  1. Dans le projet Apps Script de l'application Chat, cliquez sur Déployer > Tester les déploiements.
  2. Sous ID de déploiement de l'en-tête, cliquez sur L'icône pour faire une copie Copier.
  3. Cliquez sur OK.

Configurer l'application Chat

À l'aide de votre déploiement Apps Script, suivez ces étapes pour déployer l'application Google Chat à des fins de test :

  1. Dans la console, recherchez Google Chat API et cliquez sur API Google Chat.
  2. Cliquez sur Gérer.

  3. Cliquez sur Configuration et configurez l'application Chat :

    1. Dans le champ Nom de l'application, saisissez A2UI Quickstart.
    2. Dans le champ URL de l'avatar, saisissez https://developers.google.com/workspace/add-ons/images/quickstart-app-avatar.png.
    3. Dans le champ Description, saisissez A2UI Quickstart.
    4. Sous Fonctionnalités, sélectionnez Rejoindre des espaces et des conversations de groupe.
    5. Sous Paramètres de connexion, sélectionnez Projet Apps Script.
    6. Dans le champ ID de déploiement, collez l'ID de déploiement Head que vous avez copié précédemment.
    7. Sous Visibilité, sélectionnez Personnes et groupes spécifiques dans votre domaine et entrez votre e-mail.

  4. Cliquez sur Enregistrer.

L'application Chat est prête à répondre aux messages.

Tester l'application Chat

Pour tester votre application de chat, ouvrez une conversation directe avec l'application et envoyez un message :

  1. Ouvrez Google Chat en utilisant le compte Google Workspace que vous avez fourni lorsque vous vous êtes ajouté en tant que testeur de confiance.

    Accéder à Google Chat

  2. Cliquez sur Nouveau chat.
  3. Dans le champ Ajouter une ou plusieurs personnes, saisissez le nom de votre application Chat.

  4. Sélectionnez votre application Chat dans les résultats. Un message privé s'ouvre.

  5. Dans le nouveau message privé contenant l'application, saisissez Hello!, puis appuyez sur enter.

    L'application Chat répond par un message de salutation et une fiche contenant le nom du profil, l'image et le bouton LinkedIn.

  6. Mettez à jour l'implémentation de l'agent A2UI pour qu'il renvoie également le titre du profil.

    Dans votre environnement de développement local, ouvrez le fichier a2ui/agent.py et supprimez la mise en commentaire de la ligne de l'outil qui ajoute le titre aux données renvoyées.

    apps-script/chat/a2ui-ai-agent/a2ui/a2ui/agent.py
    # Copyright 2026 Google LLC
#
# Licensed under the Apache License, Version 2.0 (the "License");
# you may not use this file except in compliance with the License.
# You may obtain a copy of the License at
#
#     http://www.apache.org/licenses/LICENSE-2.0
#
# Unless required by applicable law or agreed to in writing, software
# distributed under the License is distributed on an "AS IS" BASIS,
# WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
# See the License for the specific language governing permissions and
# limitations under the License.

"""A2UI agent."""

from google.adk.agents import LlmAgent
from google.adk.tools.tool_context import ToolContext
import json

# The schema for any A2UI message. This never changes.
from .a2ui_schema import A2UI_SCHEMA

def get_user_profile(tool_context: ToolContext) -> str:
    """Call this tool to get the current user profile."""
    return json.dumps({
        "name": "Pierrick Voulet",
        # "title": "DevRel Engineer @ Google Workspace | Gen AI & AI Agents & Agentic AI | Automation & Digital Transformation",
        "imageUrl": "https://io.google/2024/speakers/3ea87822-3160-4d54-89dd-57e185085f79_240.webp",
        "linkedin": "https://www.linkedin.com/in/pierrick-voulet/"
    })

AGENT_INSTRUCTION="""
You are a user profile assistant. Your goal is to help users get their profile information using a rich UI.

To achieve this, you MUST follow these steps to answer user requests:

1.  You MUST call the `get_user_profile` tool and extract all the user profile information from the result.
2.  You MUST generate a final a2ui UI JSON based on the user profile information extracted in the previous step."""

A2UI_AND_AGENT_INSTRUCTION = AGENT_INSTRUCTION + f"""

To generate a valid a2ui UI JSON, you MUST follow these rules:
1.  Your response MUST be in two parts, separated by the delimiter: `---a2ui_JSON---`.
2.  The first part is your conversational text response.
3.  The second part is a single, raw JSON object which is a list of A2UI messages.
4.  The JSON part MUST validate against the A2UI JSON SCHEMA provided below.

To represent the user profile, you MUST use the following A2UI message types:
1.  Buttons MUST be used to represent links (e.g., LinkedIn profile link).
2.  Image MUST be used to represent the user's profile picture.

---BEGIN A2UI JSON SCHEMA---
{A2UI_SCHEMA}
---END A2UI JSON SCHEMA---
"""

root_agent = LlmAgent(
    name="user_profile",
    model="gemini-2.5-flash",
    instruction=A2UI_AND_AGENT_INSTRUCTION,
    description="An agent that returns the current user profile.",
    tools=[get_user_profile]
)

  7. Mettez à jour l'ADK précédemment déployé avec la nouvelle version de l'implémentation.

    python3 deployment/deploy.py --update --resource_id=RESOURCE_ID

    Remplacez RESOURCE_ID par le nom de ressource de l'agent Vertex AI copié lors des étapes précédentes.

  8. Dans le message privé contenant l'application, saisissez Hello again! et appuyez sur enter.

    L'application Chat répond par un message contenant du texte et une fiche avec le titre du profil.

Pour ajouter des testeurs de confiance et en savoir plus sur les tests de fonctionnalités interactives, consultez Tester les fonctionnalités interactives pour les applications Google Chat.

Résoudre les problèmes

Lorsqu'une application ou une fiche Google Chat renvoie une erreur, l'interface Chat affiche le message "Un problème est survenu". ou "Impossible de traiter votre demande". Il arrive que l'interface utilisateur de Chat n'affiche aucun message d'erreur, mais que l'application ou la fiche Chat produise un résultat inattendu (par exemple, un message de fiche peut ne pas s'afficher).

Bien qu'un message d'erreur ne s'affiche pas dans l'UI Chat, des messages d'erreur descriptifs et des données de journaux sont disponibles pour vous aider à corriger les erreurs lorsque la journalisation des erreurs pour les applications Chat est activée. Pour obtenir de l'aide concernant l'affichage, le débogage et la correction des erreurs, consultez Résoudre les problèmes et corriger les erreurs Google Chat.

Effectuer un nettoyage

Pour éviter que les ressources utilisées dans ce tutoriel soient facturées sur votre compte Google Cloud, nous vous recommandons de supprimer le projet Cloud.

  1. Dans la console Google Cloud, accédez à la page Gérer les ressources. Cliquez sur Menu > IAM et administration > Gérer les ressources.

    Accéder au gestionnaire de ressources

  2. Dans la liste des projets, sélectionnez celui que vous souhaitez supprimer, puis cliquez sur Supprimer .
  3. Dans la boîte de dialogue, saisissez l'ID du projet, puis cliquez sur Arrêter pour supprimer le projet.