Dela via

Uppdatera chattappen för att använda JavaScript-klientdelen med Python-serverdelen

Chattappen är ett referensprogram som visar hur du använder Azure OpenAI-tjänsten. Varje referensarkitektur för programmeringsspråk har lite olika funktioner. Den här artikeln beskriver hur du använder JavaScript-klientdelen med Python-serverdelen.

Genom att blanda och matcha klientdelen och serverdelen kan du skapa ett flerspråksprogram som använder det bästa av båda världarna.

  • Demo – Konfigurera JavaScript-frontend med Python-backend video

Den här artikeln är en del av en samling artiklar som visar hur du skapar en chattapp med Hjälp av Azure OpenAI Service och Azure AI Search. Andra artiklar i samlingen är:

  • .NET
  • Java
  • Python

Anteckning

Den här artikeln använder en eller flera AI-appmallar som grund för exemplen och vägledningen i artikeln. Med AI-appmallar får du väl underhållna och enkla att distribuera referensimplementeringar som hjälper dig att säkerställa en högkvalitativ startpunkt för dina AI-appar.

Förutsättningar

Distribuera de två referensarkitekturerna med hjälp av följande artiklar. Se till att använda samma prenumeration och region för båda distributionerna. Distributionen kan ta upp till 20 minuter. Låt distributionerna vara igång. slutför inte avsnittet Rensa resurser förrän du är klar med den här artikeln.

  • Distribuera JavaScript-chattappen med denna artikel
  • Driftsätt Python-chattappen med den här artikeln.

Hämta URL:er för klientdelen och serverdelen

När du har distribuerat de två referensarkitekturerna har du två fullstack-appar distribuerade. Om du vill använda JavaScript-klientdelen med Python-serverdelen måste du hämta URL:erna för JS-klientdelen och PY-serverdelen och konfigurera dem i den andra appen.

Du bör ha varje lagringsplats i en separat utvecklingsmiljö, antingen lokalt i Codespaces.

Ange JavaScript-klientdels-URL i Python-serverdelen

  1. I JavaScript-utvecklingsmiljön hämtar du URL:en för JavaScript-klientdelen genom att köra följande kommando:

    azd env get-values | grep WEBAPP_URI

    Det här kommandot hämtar alla molnvariabler och filtrerar efter variabeln WEBAPP_URI. Kontrollera att URL:en inte slutar med ett snedstreck, /.

  2. Kopiera URL.

  3. I Python-utvecklingsmiljön anger du URL:en för JavaScript-klientdelen genom att köra följande kommando:

    azd env set ALLOWED_ORIGIN <FRONTEND-URL>

  4. I Python-utvecklingsmiljön distribuerar du om Python-serverdelen genom att köra följande kommando:

    azd up

Ange Python-serverdels-URL i JavaScript-klientdelen

  1. I Python-utvecklingsmiljön hämtar du URL:en för Python-serverdelen genom att köra följande kommando:

    azd env get-values | grep BACKEND_URI

    Det här kommandot hämtar alla molnmiljövariabler och filtrerar för variabeln BACKEND_URI. Kontrollera att URL:en inte slutar med ett snedstreck, /.

  2. Kopiera URL.

  3. I JavaScript-utvecklingsmiljön anger du URL:en för Python-serverdelen genom att köra följande kommando:

    azd env set BACKEND_URI <BACKEND_URI>

  4. I Python-utvecklingsmiljön distribuerar du om Python-serverdelen genom att köra följande kommando i Python-utvecklingsmiljön:

    azd up

Använda JavaScript-klientdelen med Python-serverdelen

Python-appen använder ett ämnesområde för HR-förmåner medan JavaScript-appen använder ett ämnesområde för fastigheter. Nu när apparna är anslutna kan du använda klientdelen för att fråga om HR-förmåner. Bland de föreslagna frågorna finns:

  • Vad ingår i min Northwind Health Plus-plan som inte är standard?
  • Vad händer i en prestandagranskning?
  • Vad gör en Product Manager?

Rensa resurser

När du är klar med apparna kan du ta bort resurserna för att undvika att debiteras mer.

Felsökning

  • Om du får ett fel granskar du url:erna som du angav i miljön. Se till att de inte slutar med ett snedstreck, /.

Nästa steg