Udostępnij za pośrednictwem

Aktualizowanie aplikacji Czat w celu używania frontonu JavaScript z zapleczem języka Python

  • Artykuł

Aplikacja czatu to aplikacja referencyjna, która demonstruje sposób korzystania z usługi Azure OpenAI. Każda architektura referencyjna języka programowania zapewnia nieco inne funkcje. W tym artykule opisano sposób używania frontonu JavaScript z zapleczem języka Python.

Łącząc elementy frontendu i backendu, można stworzyć aplikację wielojęzyczną, która korzysta z najlepszych cech obu środowisk.

  • Demo — konfigurowanie interfejsu JavaScript z backendem w języku Python w formie wideo

Ten artykuł jest częścią kolekcji artykułów, które pokazują, jak utworzyć aplikację do czatu przy użyciu usługi Azure OpenAI Service i usługi Azure AI Search. Inne artykuły w kolekcji obejmują:

  • .NET
  • Java
  • Python

Uwaga

W tym artykule jako podstawę dla przykładów i wskazówek wykorzystano jeden lub więcej szablonów aplikacji AI. Szablony aplikacji sztucznej inteligencji zapewniają dobrze utrzymywane, łatwe w wdrażaniu implementacje referencyjne, które pomagają zapewnić wysokiej jakości punkt wyjścia dla aplikacji sztucznej inteligencji.

Wymagania wstępne

Wdróż dwie architektury referencyjne, korzystając z poniższych artykułów. Upewnij się, że używasz tej samej subskrypcji i regionu dla obu wdrożeń. Wdrożenie może potrwać do 20 minut. Pozostaw wdrożenia aktywne; nie ukończ sekcji Czyszczenie zasobów, dopóki nie skończysz z tym artykułem.

  • Wdróż aplikację czatu w języku JavaScript przy użyciu tego artykułu
  • Wdróż aplikację czatu napisaną w Pythonie, korzystając z tego artykułu.

Pobierz adresy URL dla panelu użytkownika i panelu administracyjnego

Po wdrożeniu dwóch architektur referencyjnych masz wdrożone dwie pełnostackowe aplikacje. Aby użyć frontonu Języka JavaScript z zapleczem języka Python, należy uzyskać adresy URL frontonu JS i zaplecza PY i skonfigurować je w innej aplikacji.

Każde repozytorium powinno znajdować się w osobnym środowisku deweloperskim, lokalnie lub w usłudze Codespaces.

Ustawianie adresu URL frontonu JavaScript w zapleczu języka Python

  1. W środowisku programistycznym JavaScript pobierz adres URL frontonu JavaScript, uruchamiając następujące polecenie:

    azd env get-values | grep WEBAPP_URI

    To polecenie pobiera wszystkie zmienne środowiska chmury i filtruje dla zmiennej WEBAPP_URI. Upewnij się, że adres URL nie kończy się ukośnikiem /.

  2. Skopiuj adres URL.

  3. W środowisku programistycznym Python ustaw adres URL dla frontendu JavaScript, uruchamiając następujące polecenie:

    azd env set ALLOWED_ORIGIN <FRONTEND-URL>

  4. W środowisku deweloperów języka Python ponownie wdróż zaplecze języka Python, uruchamiając następujące polecenie:

    azd up

Ustawianie adresu URL zaplecza języka Python w frontonie JavaScript

  1. W środowisku deweloperów języka Python pobierz adres URL zaplecza języka Python, uruchamiając następujące polecenie:

    azd env get-values | grep BACKEND_URI

    To polecenie pobiera wszystkie zmienne środowiskowe w chmurze i filtruje dla zmiennej BACKEND_URI. Upewnij się, że adres URL nie kończy się ukośnikiem /.

  2. Skopiuj adres URL.

  3. W środowisku programistycznym JavaScript ustaw adres URL zaplecza języka Python, uruchamiając następujące polecenie:

    azd env set BACKEND_URI <BACKEND_URI>

  4. W środowisku deweloperów języka Python ponownie wdróż zaplecze języka Python, uruchamiając następujące polecenie w środowisku deweloperów języka Python:

    azd up

Używanie frontonu Języka JavaScript z zapleczem języka Python

Aplikacja w języku Python korzysta z obszaru tematu korzyści hr, podczas gdy aplikacja JavaScript korzysta z obszaru tematu nieruchomości. Teraz, gdy aplikacje są połączone, możesz użyć frontonu, aby zapytać o korzyści kadrowe. Sugerowane pytania obejmują:

  • Co jest zawarte w moim planie Northwind Health Plus, który nie jest standardowy?
  • Co się dzieje w przeglądzie wydajności?
  • Co robi Menedżer produktu?

Czyszczenie zasobów

Gdy skończysz z aplikacjami, możesz usunąć zasoby, aby uniknąć naliczania dodatkowych opłat.

Rozwiązywanie problemów

  • Jeśli wystąpi błąd, przejrzyj adresy URL wprowadzone w środowisku. Upewnij się, że nie kończą się ukośnikiem /.

Następne kroki