Aan de slag met Azure OpenAI met assistenten en functieoproepen in JavaScript

In dit artikel leest u hoe u de serverloze Azure OpenAI-assistent Quick Start implementeert en uitvoert. In dit voorbeeld wordt een assistent-app geïmplementeerd met behulp van JavaScript, Azure OpenAI Service-assistenten met functieaanroepen en Azure Functions.

Architectuuroverzicht

Met Azure OpenAI-assistenten kunt u AI-assistenten maken die zijn afgestemd op uw behoeften via aangepaste instructies en uitgebreid met geavanceerde hulpprogramma's zoals code-interpreter en aangepaste functies. In dit artikel bieden we een uitgebreid overzicht van hoe u aan de slag gaat met de Api voor assistenten.

Diagram van de architectuur van client tot back-end-app.

Deze toepassing is gebouwd rond twee hoofdonderdelen:

  • Een eenvoudige HTML-pagina met standaard-CSS- en JavaScript-bestanden, gehost op Azure Static Web Apps.

  • Een serverloze API, gebouwd met Azure Functions en met gebruik van de OpenAI JavaScript SDK. De serverloze app verzendt de definitie van de assistenten, inclusief de functie-aanroep naar het OpenAI-eindpunt. Het eindpunt reageert met de aanroep van de follow-upfunctie en de parameters die nodig zijn om die aanroep te voltooien.

    • De functieaanroep van het voorbeeld simuleert een API-aanroep door een willekeurige aandelen tickerwaarde te genereren op basis van het aandelensymbool dat naar de Azure-functie wordt verzonden. Deze simulatie kan worden vervangen door een externe API in uw oplossing.

    Diagram waarin de integratie van Azure Functions met Azure OpenAI wordt weergegeven, waarbij Azure OpenAI functienamen voor vervolgaanroepen kan retourneren die Azure Functions moet aanroepen.

Vereisten

Er is een ontwikkelcontainer-omgeving beschikbaar met alle afhankelijkheden die nodig zijn om dit artikel af te ronden. U kunt de ontwikkelcontainer uitvoeren in GitHub Codespaces (in een browser) of lokaal met behulp van Visual Studio Code.

Als u dit artikel wilt gebruiken, hebt u de volgende vereisten nodig:

  1. Een Azure-abonnement - Maak er gratis een aan
  2. Azure-accountmachtigingen - Uw Azure-account moet beschikken over de machtiging Microsoft.Authorization/roleAssignments/write, zoals User Access Administrator of Owner.
  3. Een GitHub-account.

Open ontwikkelomgeving

Gebruik de volgende instructies om een vooraf geconfigureerde ontwikkelomgeving met alle vereiste afhankelijkheden te implementeren om dit artikel te voltooien.

GitHub Codespaces draait in een door GitHub beheerde ontwikkelcontainer, met Visual Studio Code for the Web als gebruikersinterface. Voor de eenvoudigste ontwikkelomgeving gebruikt u GitHub Codespaces zodat u de juiste ontwikkelhulpprogramma's en afhankelijkheden vooraf hebt geïnstalleerd om dit artikel te voltooien.

Belangrijk

Alle GitHub-accounts kunnen Codespaces elke maand maximaal 60 uur gratis gebruiken met twee kernexemplaren. Zie GitHub Codespaces maandelijks inbegrepen opslag en core-uren voor meer informatie.

  1. Start het proces om een nieuwe GitHub Codespace te maken op de main-vertakking van de Azure-Samples/azure-openai-assistant-javascript GitHub-opslagplaats.

  2. Klik met de rechtermuisknop op de volgende knop en selecteer Koppeling openen in nieuwe vensters om zowel de ontwikkelomgeving als de documentatie tegelijkertijd beschikbaar te maken.

    Openen in GitHub Codespaces

  3. Controleer op de pagina Codespace maken de configuratie-instellingen voor codespace en selecteer vervolgens Nieuwe coderuimte maken

  4. Wacht tot de codespace is opgestart. Dit opstartproces kan enkele minuten duren.

  5. Meld u aan bij Azure met de Azure Developer CLI in de terminal onderaan het scherm.

    azd auth login

  6. Kopieer de code uit de terminal en plak deze in een browser. Volg de instructies voor verificatie met uw Azure-account.

  7. De resterende taken in dit artikel vinden plaats in de context van deze ontwikkelingscontainer.

Implementeren en uitvoeren

De voorbeeldopslagplaats bevat alle code- en configuratiebestanden die u nodig hebt om een functie-app te implementeren in Azure. Met de volgende stappen doorloopt u het proces voor het implementeren van het voorbeeld in Azure.

Implementeer de Assistenten-app in Azure

Belangrijk

Voor Azure-resources die in deze sectie zijn gemaakt, worden directe kosten in rekening gebracht, voornamelijk op basis van de Azure AI Zoeken-resource. Deze resources kunnen kosten genereren, zelfs als u de opdracht onderbreekt voordat deze is voltooid.

  1. Voer de volgende Azure Developer CLI-opdracht uit om de Azure-resources in te richten en de broncode te implementeren:

    azd up

  2. Wanneer u wordt gevraagd een omgevingsnaam in te voeren, moet u deze kort en klein houden. Bijvoorbeeld, myenv. Dit wordt gebruikt als onderdeel van de naam van de resourcegroep.

  3. Wanneer u hierom wordt gevraagd, selecteer dan een abonnement waarin u de resources wilt aanmaken.

  4. Wanneer u de eerste keer wordt gevraagd om een locatie te selecteren, selecteert u een locatie bij u in de buurt. Deze locatie wordt gebruikt voor de meeste resources, waaronder hosting.

  5. Als u wordt gevraagd om een locatie voor het OpenAI-model, selecteert u een locatie bij u in de buurt. Als dezelfde locatie beschikbaar is als uw eerste locatie, selecteert u die.

  6. Wacht totdat de app is geïmplementeerd. Het kan 5-10 minuten duren voordat de implementatie is voltooid.

  7. Nadat de toepassing is geïmplementeerd, ziet u een URL die wordt weergegeven in de terminal.

  8. Selecteer de URL met het label Deploying service web om de assistenttoepassing in een browser te openen.

De assistent-app gebruiken

Gebruik de assistent-app om de aandelenkoers van MSFT te krijgen. Met de volgende stappen doorloopt u het proces voor het gebruik van de assistent-app. De assistent kan u de antwoorden per e-mail sturen. Aangezien de functie voor het verzenden van e-mail niet is geconfigureerd, wijzigt u de prompt om die instructie niet te gebruiken.

  1. Kopieer en plak de volgende prompt in de browser:

    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. Selecteer de knop Run. Uw resultaten moeten vergelijkbaar zijn met het volgende antwoord.

    Schermopname van het eerste antwoord van de assistent-app.

Resources opschonen

Azure-resources opruimen

De Azure-resources die in dit artikel zijn gemaakt, worden gefactureerd voor uw Azure-abonnement. Als u deze resources in de toekomst niet meer nodig hebt, verwijdert u deze om te voorkomen dat er meer kosten in rekening worden gebracht.

Voer de volgende Azure Developer CLI-opdracht uit om de Azure-resources te verwijderen en de broncode te verwijderen:

azd down --purge

GitHub Codespaces opruimen

Als u de GitHub Codespaces-omgeving verwijdert, zorgt u ervoor dat u de hoeveelheid gratis rechten per kernuren kunt maximaliseren die u voor uw account krijgt.

Belangrijk

Zie GitHub Codespaces maandelijks inbegrepen opslag en core-uren voor meer informatie over de machtigingen van uw GitHub-account.

  1. Meld u aan bij het GitHub Codespaces-dashboard.

  2. Zoek uw momenteel actieve Codespaces die afkomstig zijn van de Azure-Samples/azure-openai-assistant-javascript GitHub-repository.

    Schermopname van alle actieve Codespaces, inclusief hun status en sjablonen.

  3. Open het contextmenu, ..., voor de codespace en selecteer Verwijderen.

Hulp vragen

Deze voorbeeldrepository biedt informatie voor probleemoplossing.

Als uw probleem niet wordt opgelost, meld het dan in de Issues van de opslagplaats.

Gerelateerde inhoud

  • Last updated on