Commencez avec Azure OpenAI avec assistants et appel de fonction en JavaScript

Cet article vous montre comment déployer et exécuter le guide de démarrage rapide de l’Assistant Azure OpenAI sans serveur. Cet exemple implémente une application d’assistants utilisant JavaScript, les assistants du service Azure OpenAI avec appel de fonction, et Azure Functions.

Vue d’ensemble de l’architecture

Azure OpenAI Assistants vous permet de créer des assistants IA adaptés à vos besoins grâce à des instructions personnalisées et enrichies par des outils avancés tels qu’un interpréteur de code et des fonctions personnalisées. Dans cet article, nous vous indiquons une procédure pas à pas détaillée de prise en main de l’API Assistants.

Diagramme montrant l’architecture du client à l’application backend.

Cette application est construite autour de deux composants principaux :

  • Une page HTML simple avec des fichiers CSS et JavaScript simples, hébergée sur Azure Static Web Apps.

  • Une API serverless créée avec Azure Functions et utilisant le SDK JavaScript d’OpenAI. L’application serverless envoie la définition des assistants, y compris l’appel de fonction, au point de terminaison OpenAI. Le point de terminaison répond avec l’appel de fonction de suivi et les paramètres nécessaires pour compléter cet appel.

    • L’appel de fonction de l’exemple simule un appel à l’API en générant une valeur boursière aléatoire à partir du symbole boursier transmis à la fonction Azure. Cette simulation peut être remplacée par une API distante dans votre solution.

    Diagramme montrant l’intégration d’Azure Functions avec Azure OpenAI, où Azure OpenAI peut renvoyer les noms des fonctions à appeler ensuite par Azure Functions.

Prérequis

Un environnement de conteneur de développement est disponible avec toutes les dépendances requises pour réaliser cet article. Vous pouvez exécuter le conteneur de développement dans GitHub Codespaces (dans un navigateur) ou localement à l’aide de Visual Studio Code.

Pour suivre les instructions de cet article, vous devez disposer des éléments suivants :

  1. Un abonnement Azure - En créer un gratuitement
  2. Autorisations de compte Azure : votre compte Azure doit disposer d’autorisations Microsoft.Authorization/roleAssignments/write, telles que Administrateur de l’accès utilisateur ou Propriétaire.
  3. Un compte GitHub.

Environnement de développement ouvert

Utilisez les instructions suivantes pour déployer un environnement de développement préconfiguré contenant toutes les dépendances requises pour terminer cet article.

GitHub Codespaces s’exécute avec un conteneur de développement géré par GitHub, avec Visual Studio Code for the Web comme interface utilisateur. Pour un environnement de développement le plus simple, utilisez GitHub Codespaces pour disposer des outils de développement et des dépendances appropriés préinstallés pour terminer cet article.

Important

Tous les comptes GitHub peuvent utiliser Codespaces gratuitement jusqu’à 60 heures par mois avec des instances à deux cœurs. Pour plus d’informations, consultez le stockage mensuel inclus et les heures de cœur incluses de GitHub Codespaces.

  1. Lancez le processus de création d’un nouveau codespace GitHub sur la branche main du dépôt GitHub Azure-Samples/azure-openai-assistant-javascript.

  2. Cliquez avec le bouton droit sur le bouton suivant, puis sélectionnez ouvrir le lien dans les nouvelles fenêtres pour que l’environnement de développement et la documentation soient disponibles en même temps.

    Ouvrir dans GitHub Codespaces

  3. Dans la page Créer un espace de code , passez en revue les paramètres de configuration de l’espace de code, puis sélectionnez Créer un espace de code

  4. Attendez que le codespace démarre. Ce processus de démarrage peut prendre quelques minutes.

  5. Connectez-vous à Azure avec Azure Developer CLI dans le terminal en bas de l’écran.

    azd auth login

  6. Copiez le code à partir du terminal, puis collez-le dans un navigateur. Suivez les instructions pour vous authentifier avec votre compte Azure.

  7. Les tâches restantes de cet article s’effectuent dans ce conteneur de développement.

Déployer et exécuter

Le référentiel d’exemple contient tout le code et les fichiers de configuration dont vous avez besoin pour déployer une application de fonction sur Azure. Les étapes suivantes vous guident tout au long du processus de déploiement de l’exemple sur Azure.

Déployer l’application assistants sur Azure

Important

Les ressources Azure créées dans cette section entraînent des coûts immédiats, principalement de la ressource Recherche Azure AI. Ces ressources peuvent accumuler des coûts même si vous interrompez la commande avant sa fin.

  1. Exécutez la commande Azure Developer CLI suivante pour provisionner les ressources Azure et déployer le code source :

    azd up

  2. Lorsque vous êtes invité à saisir un nom d’environnement, choisissez-le court et en minuscules. Par exemple, myenv. Il est utilisé comme partie du nom du groupe de ressources.

  3. Lorsque vous y êtes invité, sélectionnez un abonnement dans lequel créer les ressources.

  4. Lorsque vous êtes invité à sélectionner un emplacement pour la première fois, sélectionnez un emplacement près de vous. Cet emplacement est utilisé pour la plupart des ressources, y compris l’hébergement.

  5. Si vous êtes invité à indiquer un emplacement pour le modèle OpenAI, sélectionnez un emplacement près de vous. Si le premier emplacement choisi est également disponible, sélectionnez-le.

  6. Attendez que l’application soit déployée. La fin du déploiement peut prendre 5 à 10 minutes.

  7. Une fois l’application déployée, une URL s’affiche dans le terminal.

  8. Sélectionnez l’URL portant l’étiquette Deploying service web pour ouvrir l’application d’assistant dans un navigateur.

Utiliser l’application Assistant

Utilisez l’application assistante pour obtenir le cours du marché boursier de MSFT. Les étapes suivantes vous guident à travers le processus d’utilisation de l’application assistant. L’assistant peut vous envoyer les réponses par e-mail. Étant donné que la fonctionnalité d’envoi d’e-mail n’est pas configurée, modifiez l’invite pour ne pas utiliser cette instruction.

  1. Dans le navigateur, copiez et collez l’invite suivante :

    Based on the latest financial data and current stock market trends, can you provide a detailed analysis of Microsoft's current state? Please include insights into their recent performance, market position, and future outlook. Additionally, retrieve and include the latest closing price of Microsoft's stock using its ticker symbol (MSFT).

  2. Sélectionnez le bouton Run. Vos résultats devraient être similaires à la réponse suivante.

    Capture d’écran de la première réponse de l’application de l’assistant.

Nettoyer les ressources

Nettoyage des ressources Azure

Les ressources Azure créées dans cet article sont facturées dans votre abonnement Azure. Si vous pensez ne plus avoir besoin de ces ressources, supprimez-les pour éviter des frais supplémentaires.

Exécutez la commande Azure Developer CLI suivante pour supprimer les ressources Azure et le code source :

azd down --purge

Nettoyer GitHub Codespaces

La suppression de l’environnement GitHub Codespaces vous permet d’optimiser le nombre d’heures gratuites par cœur que vous obtenez pour votre compte.

Important

Pour plus d’informations sur les droits associés à votre compte GitHub, consultez Stockage et heures par cœur inclus chaque mois avec GitHub Codespaces.

  1. Connectez-vous au tableau de bord GitHub Codespaces.

  2. Repérez vos Codespaces en cours d’exécution issus du dépôt GitHub Azure-Samples/azure-openai-assistant-javascript.

    Capture d’écran de tous les Codespaces en cours d’exécution, y compris leur état et leurs modèles.

  3. Ouvrez le menu contextuel, ..., du codespace, puis sélectionnez Supprimer.

Obtenir de l’aide

Cet exemple de référentiel propose des informations de résolution des problèmes.

Si votre problème n’a pas été résolu, signalez-le dans la section Issues du dépôt.

Contenu connexe

  • Last updated on