Samouczek: kompleksowe uwierzytelnianie i autoryzacja użytkowników w usłudze Azure App Service

Usługa Azure App Service oferuje wysoce skalowalną i samonaprawialną usługę hostingu w Internecie. Ponadto usługa App Service zapewnia wbudowaną obsługę uwierzytelniania i autoryzacji użytkowników. Ten samouczek przedstawia sposób zabezpieczania aplikacji za pomocą uwierzytelniania i autoryzacji usługi App Service. Jako przykład używa Express.js z frontonem widoków. Uwierzytelnianie i autoryzacja usługi App Service obsługuje wszystkie środowiska uruchomieniowe języków, a wykonując kroki samouczka, można dowiedzieć się, jak zastosować je w przypadku preferowanego języka.

usługa aplikacja systemu Azure Service oferuje wysoce skalowalną, samonastosową usługę hostingu internetowego przy użyciu systemu operacyjnego Linux. Ponadto usługa App Service zapewnia wbudowaną obsługę uwierzytelniania i autoryzacji użytkowników. Ten samouczek przedstawia sposób zabezpieczania aplikacji za pomocą uwierzytelniania i autoryzacji usługi App Service. Używa Express.js z widokami. Uwierzytelnianie i autoryzacja usługi App Service obsługuje wszystkie środowiska uruchomieniowe języków, a wykonując kroki samouczka, można dowiedzieć się, jak zastosować je w przypadku preferowanego języka.

Z tego samouczka dowiesz się:

• Włączanie wbudowanego uwierzytelniania i autoryzacji
• Zabezpieczanie aplikacji przed nieuwierzytelnionymi żądaniami
• Używanie identyfikatora Entra firmy Microsoft jako dostawcy tożsamości
• Uzyskiwanie dostępu do zdalnej aplikacji w imieniu zalogowanego użytkownika
• Zabezpieczanie wywołań między usługami, korzystając z uwierzytelniania przy użyciu tokenów
• Używanie tokenów dostępu z poziomu kodu serwera
• Używanie tokenów dostępu z poziomu kodu klienta (przeglądarki)

Napiwek

Po ukończeniu tego scenariusza przejdź do następnej procedury, aby dowiedzieć się, jak połączyć się z usługami platformy Azure jako uwierzytelniony użytkownik. Typowe scenariusze obejmują uzyskiwanie dostępu do usługi Azure Storage lub bazy danych jako użytkownika, który ma określone możliwości lub dostęp do określonych tabel lub plików.

Uwierzytelnianie w tej procedurze jest udostępniane w warstwie platformy hostingu przez usługę aplikacja systemu Azure Service. Musisz wdrożyć aplikację frontonu i zaplecza oraz skonfigurować uwierzytelnianie dla tej aplikacji internetowej, aby została pomyślnie użyta.

Pobieranie profilu użytkownika

Aplikacja frontonu jest skonfigurowana do bezpiecznego korzystania z interfejsu API zaplecza. Aplikacja frontonu udostępnia użytkownikowi logowanie microsoft, a następnie umożliwia użytkownikowi uzyskanie fałszywego profilu z zaplecza. W tym samouczku użyto fałszywego profilu, aby uprościć kroki do ukończenia scenariusza.

Przed wykonaniem kodu źródłowego na frontonie usługa App Service wprowadza uwierzytelnione accessToken z nagłówka usługi App Service x-ms-token-aad-access-token . Następnie kod źródłowy frontonu uzyskuje dostęp do serwera zaplecza i wysyła go do serwera zaplecza, bearerToken aby bezpiecznie uzyskać dostęp do interfejsu API zaplecza. Serwer zaplecza weryfikuje element bearerToken przed przekazaniem go do kodu źródłowego zaplecza. Gdy kod źródłowy zaplecza otrzyma element bearerToken, można go użyć.

W następnym artykule z tej serii element bearerToken jest wymieniany dla tokenu z zakresem umożliwiającym dostęp do interfejsu API programu Microsoft Graph. Interfejs API programu Microsoft Graph zwraca informacje o profilu użytkownika.

Wymagania wstępne

Jeśli nie masz subskrypcji platformy Azure, przed rozpoczęciem utwórz bezpłatne konto platformy Azure.

• Node.js (LTS)

• Użyj środowiska powłoki Bash w usłudze Azure Cloud Shell. Aby uzyskać więcej informacji, zobacz Szybki start dotyczący powłoki Bash w usłudze Azure Cloud Shell.

  

• Jeśli wolisz uruchamiać polecenia referencyjne interfejsu wiersza polecenia lokalnie, zainstaluj interfejs wiersza polecenia platformy Azure. Jeśli korzystasz z systemu Windows lub macOS, rozważ uruchomienie interfejsu wiersza polecenia platformy Azure w kontenerze Docker. Aby uzyskać więcej informacji, zobacz Jak uruchomić interfejs wiersza polecenia platformy Azure w kontenerze platformy Docker.

  • Jeśli korzystasz z instalacji lokalnej, zaloguj się do interfejsu wiersza polecenia platformy Azure za pomocą polecenia az login. Aby ukończyć proces uwierzytelniania, wykonaj kroki wyświetlane w terminalu. Aby uzyskać inne opcje logowania, zobacz Logowanie się przy użyciu interfejsu wiersza polecenia platformy Azure.

  • Po wyświetleniu monitu zainstaluj rozszerzenie interfejsu wiersza polecenia platformy Azure podczas pierwszego użycia. Aby uzyskać więcej informacji na temat rozszerzeń, zobacz Korzystanie z rozszerzeń w interfejsie wiersza polecenia platformy Azure.

  • Uruchom polecenie az version, aby znaleźć zainstalowane wersje i biblioteki zależne. Aby uaktualnić do najnowszej wersji, uruchom polecenie az upgrade.

1. Sklonuj przykładową aplikację

1. W usłudze Azure Cloud Shell uruchom następujące polecenie, aby sklonować przykładowe repozytorium.

   git clone https://github.com/Azure-Samples/js-e2e-web-app-easy-auth-app-to-app
   

2. Tworzenie i wdrażanie aplikacji

Utwórz grupę zasobów, plan aplikacji internetowej, aplikację internetową i wdróż w jednym kroku.

1. Przejdź do katalogu aplikacji internetowej frontonu.

   cd js-e2e-web-app-easy-auth-app-to-app/frontend
   

2. Utwórz i wdróż aplikację internetową frontonu za pomocą polecenia az webapp up. Ponieważ nazwa aplikacji internetowej musi być globalnie unikatowa, zastąp <front-end-app-name> unikatową nazwą.

   az webapp up --resource-group myAuthResourceGroup --name <front-end-app-name> --plan myPlan --sku FREE --os-type Windows --location "West Europe" --runtime "NODE:16LTS"
   

3. Przejdź do katalogu aplikacji internetowej zaplecza.

   cd ../backend
   

4. Wdróż aplikację internetową zaplecza w tej samej grupie zasobów i planie aplikacji. Ponieważ nazwa aplikacji internetowej musi być globalnie unikatowa, zastąp <back-end-app-name> unikatowym zestawem inicjałów lub liczb.

   az webapp up --resource-group myAuthResourceGroup --name <back-end-app-name> --plan myPlan --os-type Windows --location "West Europe" --runtime "NODE:16LTS"
   

1. Przejdź do katalogu aplikacji internetowej frontonu.

   cd frontend
   

2. Utwórz i wdróż aplikację internetową frontonu za pomocą polecenia az webapp up. Ponieważ nazwa aplikacji internetowej musi być globalnie unikatowa, zastąp <front-end-app-name> unikatowym zestawem inicjałów lub liczb.

   az webapp up --resource-group myAuthResourceGroup --name <front-end-app-name> --plan myPlan --sku FREE --location "West Europe" --os-type Linux --runtime "NODE:16-lts"
   

3. Przejdź do katalogu aplikacji internetowej zaplecza.

   cd ../backend
   

4. Wdróż aplikację internetową zaplecza w tej samej grupie zasobów i planie aplikacji. Ponieważ nazwa aplikacji internetowej musi być globalnie unikatowa, zastąp <back-end-app-name> unikatowym zestawem inicjałów lub liczb.

   az webapp up --resource-group myAuthResourceGroup --name <back-end-app-name> --plan myPlan --sku FREE --location "West Europe" --runtime "NODE:16-lts"
   

3. Konfigurowanie ustawienia aplikacji

Aplikacja frontonu musi znać adres URL aplikacji zaplecza dla żądań interfejsu API. Użyj następującego polecenia interfejsu wiersza polecenia platformy Azure, aby skonfigurować ustawienie aplikacji. Adres URL powinien mieć format https://<back-end-app-name>.azurewebsites.net.

az webapp config appsettings set --resource-group myAuthResourceGroup --name <front-end-app-name> --settings BACKEND_URL="https://<back-end-app-name>.azurewebsites.net"

4. Fronton wywołuje zaplecze

Przejdź do aplikacji frontonu i wróć do fałszywego profilu z zaplecza. Ta akcja sprawdza, czy fronton pomyślnie żąda profilu z zaplecza, a zaplecze zwraca profil.

1. Otwórz aplikację internetową frontonu w przeglądarce https://<front-end-app-name>.azurewebsites.net.

   

2. Wybierz link Get user's profile.

3. Wyświetl fałszywy profil zwrócony z aplikacji internetowej zaplecza.

   

   Wartość withAuthenticationfalse wskazuje, że uwierzytelnianie nie zostało jeszcze skonfigurowane.

5. Konfigurowanie uwierzytelniania

W tym kroku włączysz uwierzytelnianie i autoryzację dla dwóch aplikacji internetowych. W tym samouczku użyto identyfikatora Entra firmy Microsoft jako dostawcy tożsamości.

Należy również skonfigurować aplikację frontonu w taki sposób, aby:

• Udzielanie aplikacji frontonu dostępu do aplikacji zaplecza
• Skonfigurowanie usługi App Service do zwracania tokenu nadającego się do użycia
• Użyj tokenu w kodzie.

Aby uzyskać więcej informacji, zobacz Configure Microsoft Entra authentication for your App Services application (Konfigurowanie uwierzytelniania entra firmy Microsoft dla aplikacji usługi App Services).

Włączanie uwierzytelniania i autoryzacji dla aplikacji zaplecza

1. W menu witryny Azure Portal wybierz pozycję Grupy zasobów lub wyszukaj i wybierz pozycję Grupy zasobów na dowolnej stronie.

2. W obszarze Grupy zasobów znajdź i wybierz grupę zasobów. W obszarze Przegląd wybierz aplikację zaplecza.

3. W menu po lewej stronie aplikacji zaplecza wybierz pozycję Uwierzytelnianie, a następnie wybierz pozycję Dodaj dostawcę tożsamości.

4. Na stronie Dodawanie dostawcy tożsamości wybierz pozycję Microsoft jako dostawcę tożsamości, aby zalogować się do tożsamości firmy Microsoft i tożsamości firmy Microsoft.

5. Zaakceptuj ustawienia domyślne i wybierz pozycję Dodaj.

   

6. Zostanie otwarta strona Uwierzytelnianie . Skopiuj identyfikator klienta aplikacji Microsoft Entra do Notatnika. Ta wartość będzie potrzebna później.

   

Jeśli zatrzymasz się tutaj, masz samodzielną aplikację, która jest już zabezpieczona przez uwierzytelnianie i autoryzację usługi App Service. W pozostałych sekcjach pokazano, jak zabezpieczyć rozwiązanie z wieloma aplikacjami przez "przepływanie" uwierzytelnionego użytkownika z frontonu do zaplecza.

Włączanie uwierzytelniania i autoryzacji dla aplikacji frontonu

1. W menu witryny Azure Portal wybierz pozycję Grupy zasobów lub wyszukaj i wybierz pozycję Grupy zasobów na dowolnej stronie.

2. W obszarze Grupy zasobów znajdź i wybierz grupę zasobów. W obszarze Przegląd wybierz stronę zarządzania aplikacją frontonu.

3. W menu po lewej stronie aplikacji frontonu wybierz pozycję Uwierzytelnianie, a następnie wybierz pozycję Dodaj dostawcę tożsamości.

4. Na stronie Dodawanie dostawcy tożsamości wybierz pozycję Microsoft jako dostawcę tożsamości, aby zalogować się do tożsamości firmy Microsoft i tożsamości firmy Microsoft.

5. Zaakceptuj ustawienia domyślne i wybierz pozycję Dodaj.

6. Zostanie otwarta strona Uwierzytelnianie . Skopiuj identyfikator klienta aplikacji Microsoft Entra do Notatnika. Ta wartość będzie potrzebna później.

Udzielanie aplikacji frontonu dostępu do zaplecza

Teraz, po włączeniu uwierzytelniania i autoryzacji dla obu aplikacji, każda z nich jest wspierana przez aplikację usługi AD. Aby ukończyć uwierzytelnianie, należy wykonać trzy czynności:

• Udzielanie aplikacji frontonu dostępu do aplikacji zaplecza
• Skonfigurowanie usługi App Service do zwracania tokenu nadającego się do użycia
• Użyj tokenu w kodzie.

Napiwek

Jeśli napotkasz błędy i zmienisz konfigurację ustawień uwierzytelniania/autoryzacji aplikacji, tokeny w magazynie tokenów mogą nie zostać ponownie wygenerowane na podstawie nowych ustawień. Aby mieć pewność, że tokeny zostaną ponownie wygenerowane, musisz wylogować się z aplikacji i zalogować się do niej ponownie. Łatwo to zrobić, korzystając z przeglądarki w trybie prywatnym. Po zmianie ustawień w aplikacjach zamknij przeglądarkę i otwórz ją ponownie w trybie prywatnym.

W tym kroku przyznasz aplikacji frontonu dostęp do aplikacji zaplecza w imieniu użytkownika. (Technicznie podajesz frontonowi Aplikacja usługi AD uprawnienia dostępu do aplikacji usługi AD zaplecza w imieniu użytkownika).

1. Na stronie Uwierzytelnianie aplikacji frontonu wybierz nazwę aplikacji frontonu w obszarze Dostawca tożsamości. Ta rejestracja aplikacji została wygenerowana automatycznie. Wybierz pozycję Uprawnienia interfejsu API w menu po lewej stronie.

2. Wybierz pozycję Dodaj uprawnienie, a następnie wybierz pozycję Moje interfejsy><API back-end-app-name.>

3. Na stronie Żądanie uprawnień interfejsu API dla aplikacji zaplecza wybierz pozycję Delegowane uprawnienia i user_impersonation, a następnie wybierz pozycję Dodaj uprawnienia.

   

Konfigurowanie usługi App Service do zwracania nadającego się do użycia tokenu dostępu

Aplikacja frontonu ma teraz wymagane uprawnienia dostępu do aplikacji zaplecza jako zalogowany użytkownik. W tym kroku skonfigurujesz uwierzytelnianie i autoryzację usługi App Service w celu udzielenia użytecznego tokenu dostępu na potrzeby uzyskiwania dostępu do zaplecza. W tym kroku potrzebny jest identyfikator klienta zaplecza skopiowany z obszaru Włącz uwierzytelnianie i autoryzację dla aplikacji zaplecza.

W usłudze Cloud Shell uruchom następujące polecenia w aplikacji frontonu, aby dodać scope parametr do ustawienia identityProviders.azureActiveDirectory.login.loginParametersuwierzytelniania . Zastąp <ciąg> nazwa-aplikacji frontonu i< identyfikator> klienta zaplecza.

az extension add --name authV2
authSettings=$(az webapp auth show -g myAuthResourceGroup -n <front-end-app-name>)
authSettings=$(echo "$authSettings" | jq '.properties' | jq '.identityProviders.azureActiveDirectory.login += {"loginParameters":["scope=openid offline_access api://<back-end-client-id>/user_impersonation"]}')
az webapp auth set --resource-group myAuthResourceGroup --name <front-end-app-name> --body "$authSettings"

Polecenia skutecznie dodają loginParameters właściwość z dodatkowymi zakresami niestandardowymi. Oto wyjaśnienie żądanych zakresów:

• openid usługa App Service jest już domyślnie żądana. Aby uzyskać informacje, zobacz OpenID Połączenie Zakresy.
• offline_access jest uwzględniona w tym miejscu dla wygody (na wypadek, gdy chcesz odświeżyć tokeny).
• api://<back-end-client-id>/user_impersonation to uwidoczniony interfejs API w rejestracji aplikacji zaplecza. Jest to zakres, który zapewnia token JWT, który zawiera aplikację zaplecza jako odbiorców tokenów.

Napiwek

• Aby wyświetlić api://<back-end-client-id>/user_impersonation zakres w witrynie Azure Portal, przejdź do strony Uwierzytelnianie aplikacji zaplecza, kliknij link w obszarze Dostawca tożsamości, a następnie kliknij pozycję Uwidocznij interfejs API w menu po lewej stronie.
• Aby zamiast tego skonfigurować wymagane zakresy przy użyciu interfejsu internetowego, zobacz kroki firmy Microsoft w temacie Odświeżanie tokenów uwierzytelniania.
• Niektóre zakresy wymagają zgody administratora lub użytkownika. To wymaganie powoduje wyświetlenie strony żądania zgody, gdy użytkownik zaloguje się do aplikacji frontonu w przeglądarce. Aby uniknąć tej strony zgody, dodaj rejestrację aplikacji frontonu jako autoryzowaną aplikację kliencką na stronie Uwidacznianie interfejsu API , klikając pozycję Dodaj aplikację kliencką i podając identyfikator klienta rejestracji aplikacji frontonu.

Aplikacje są teraz skonfigurowane. Fronton jest teraz gotowy do uzyskania dostępu do zaplecza przy użyciu odpowiedniego tokenu dostępu.

Aby uzyskać informacje na temat konfigurowania tokenu dostępu dla innych dostawców, zobacz Odświeżanie tokenów dostawcy tożsamości.

6. Skonfiguruj usługę App Service zaplecza, aby akceptowała token tylko z usługi App Service frontonu

Należy również skonfigurować usługę App Service zaplecza tak, aby akceptowała token tylko z usługi App Service frontonu. Nie może to spowodować błędu "403: Zabronione" podczas przekazywania tokenu z frontonu do zaplecza.

Można to ustawić za pomocą tego samego procesu interfejsu wiersza polecenia platformy Azure, który został użyty w poprzednim kroku.

1. Pobierz usługę appId App Service frontonu (możesz uzyskać tę wartość w bloku "Uwierzytelnianie" usługi App Service frontonu).

2. Uruchom następujący interfejs wiersza polecenia platformy Azure, zastępując element <back-end-app-name> i <front-end-app-id>.

authSettings=$(az webapp auth show -g myAuthResourceGroup -n <back-end-app-name>)
authSettings=$(echo "$authSettings" | jq '.properties' | jq '.identityProviders.azureActiveDirectory.validation.defaultAuthorizationPolicy.allowedApplications += ["<front-end-app-id>"]')
az webapp auth set --resource-group myAuthResourceGroup --name <back-end-app-name> --body "$authSettings"

authSettings=$(az webapp auth show -g myAuthResourceGroup  -n <back-end-app-name>)
authSettings=$(echo "$authSettings" | jq '.properties' | jq '.identityProviders.azureActiveDirectory.validation.jwtClaimChecks += { "allowedClientApplications": ["<front-end-app-id>"]}')
az webapp auth set --resource-group myAuthResourceGroup --name <back-end-app-name> --body "$authSettings"

7. Fronton wywołuje uwierzytelnione zaplecze

Aplikacja frontonu musi przekazać uwierzytelnianie użytkownika z prawidłowym user_impersonation zakresem do zaplecza. W poniższych krokach zapoznaj się z kodem podanym w przykładzie dla tej funkcji.

Wyświetl kod źródłowy aplikacji frontonu:

1. Użyj nagłówka z wstrzykniętą x-ms-token-aad-access-token usługą App Service frontonu, aby programowo uzyskać dostęp użytkownikaDoken.

   // ./src/server.js
   const accessToken = req.headers['x-ms-token-aad-access-token'];
   

2. Użyj tokenu accessToken w nagłówku Authentication jako bearerToken wartości.

   // ./src/remoteProfile.js
   // Get profile from backend
   const response = await fetch(remoteUrl, {
       cache: "no-store", // no caching -- for demo purposes only
       method: 'GET',
       headers: {
           'Authorization': `Bearer ${accessToken}`
       }
   });
   if (response.ok) {
       const { profile } = await response.json();
       console.log(`profile: ${profile}`);
   } else {
       // error handling
   }
   

   Ten samouczek zwraca fałszywy profil, aby uprościć scenariusz. W następnym samouczku z tej serii pokazano, jak wymienić element nośny zapleczaToken dla nowego tokenu z zakresem podrzędnej usługi platformy Azure, takiej jak Microsoft Graph.

7. Zaplecze zwraca profil do frontonu

Jeśli żądanie z frontonu nie jest autoryzowane, usługa App Service zaplecza odrzuca żądanie z kodem błędu HTTP 401, zanim żądanie osiągnie kod aplikacji. Po osiągnięciu kodu zaplecza (ponieważ zawiera on autoryzowany token), wyodrębnij element bearerToken, aby uzyskać token accessToken.

Wyświetl kod źródłowy aplikacji zaplecza:

// ./src/server.js
const bearerToken = req.headers['Authorization'] || req.headers['authorization'];

if (bearerToken) {
    const accessToken = bearerToken.split(' ')[1];
    console.log(`backend server.js accessToken: ${!!accessToken ? 'found' : 'not found'}`);

    // TODO: get profile from Graph API
    // provided in next article in this series
    // return await getProfileFromMicrosoftGraph(accessToken)

    // return fake profile for this tutorial
    return {
        "displayName": "John Doe",
        "withAuthentication": !!accessToken ? true : false
    }
}

8. Przejdź do aplikacji

1. Użyj witryny internetowej frontonu w przeglądarce. Adres URL ma format https://<front-end-app-name>.azurewebsites.net/.

2. Przeglądarka żąda uwierzytelnienia do aplikacji internetowej. Ukończ uwierzytelnianie.

   

3. Po zakończeniu uwierzytelniania aplikacja frontonu zwraca stronę główną aplikacji.

   

4. Wybierz opcję Get user's profile. Spowoduje to przekazanie uwierzytelniania w tokenie elementu nośnego do zaplecza.

5. Zaplecze odpowiada za pomocą fałszywej zakodowanej nazwy profilu: John Doe.

   

   Wartość withAuthenticationtrue wskazuje, że uwierzytelnianie zostało jeszcze skonfigurowane.

9. Czyszczenie zasobów

W poprzednich krokach utworzono zasoby platformy Azure w grupie zasobów.

1. Usuń grupę zasobów, uruchamiając następujące polecenie w usłudze Cloud Shell. Wykonanie tego polecenia może potrwać około minutę.

   az group delete --name myAuthResourceGroup
   

2. Użyj identyfikatora klienta aplikacji uwierzytelniania, które wcześniej znaleziono i zanotuj w Enable authentication and authorization sekcjach dotyczących aplikacji zaplecza i frontonu.

3. Usuń rejestracje aplikacji zarówno dla aplikacji frontonu, jak i zaplecza.

   # delete app - do this for both frontend and backend client ids
   az ad app delete <client-id>
   

Często zadawane pytania

Jak mogę przetestować to uwierzytelnianie na maszynie deweloperów lokalnych?

Uwierzytelnianie w tej procedurze jest udostępniane w warstwie platformy hostingu przez usługę aplikacja systemu Azure Service. Nie ma równoważnego emulatora. Aby korzystać z uwierzytelniania, należy wdrożyć aplikację frontonu i zaplecze oraz uwierzytelnianie konfiguracji dla każdego z nich.

Aplikacja nie wyświetla fałszywego profilu, jak ją debugować?

Obie aplikacje frontonu i zaplecza mają /debug trasy ułatwiające debugowanie uwierzytelniania, gdy ta aplikacja nie zwraca fałszywego profilu. Trasa debugowania frontonu udostępnia krytyczne elementy do weryfikacji:

• Zmienne środowiskowe:
  • Element BACKEND_URL jest poprawnie skonfigurowany jako https://<back-end-app-name>.azurewebsites.net. Nie dołączaj tego ukośnika do przodu ani trasy.
• Nagłówki HTTP:
  • Nagłówki x-ms-token-* są wstrzykiwane.
• Zostanie wyświetlona nazwa profilu programu Microsoft Graph dla zalogowanych użytkowników.
• Zakres aplikacji frontonu dla tokenu ma wartość user_impersonation. Jeśli zakres nie obejmuje tego, może to być problem z chronometrażem. Sprawdź parametry aplikacji frontonu login w zasobach platformy Azure. Poczekaj kilka minut na replikację uwierzytelniania.

Czy kod źródłowy aplikacji został prawidłowo wdrożony w każdej aplikacji internetowej?

1. W witrynie Azure Portal dla aplikacji internetowej wybierz pozycję Narzędzia programistyczne —> Narzędzia zaawansowane, a następnie wybierz pozycję Przejdź ->. Spowoduje to otwarcie nowej karty lub okna przeglądarki.

2. Na nowej karcie przeglądarki wybierz pozycję Przeglądaj katalog —> witryna wwwroot.

3. Sprawdź, czy w katalogu znajdują się następujące elementy:

   • package.json
   • node_modules.tar.gz
   • /src/index.js

4. Sprawdź, czy właściwość package.json name jest taka sama jak nazwa sieci Web lub frontendbackend.

5. Jeśli kod źródłowy został zmieniony i trzeba go ponownie wdrożyć, użyj polecenia az webapp up z katalogu zawierającego plik package.json dla tej aplikacji.

Czy aplikacja została uruchomiona poprawnie

Obie aplikacje internetowe powinny zwrócić coś po zażądaniu strony głównej. Jeśli nie możesz nawiązać połączenia z /debug aplikacją internetową, aplikacja nie uruchamiała się poprawnie. Przejrzyj dzienniki błędów dla tej aplikacji internetowej.

1. W witrynie Azure Portal dla aplikacji internetowej wybierz pozycję Narzędzia programistyczne —> Narzędzia zaawansowane, a następnie wybierz pozycję Przejdź ->. Spowoduje to otwarcie nowej karty lub okna przeglądarki.
2. Na nowej karcie przeglądarki wybierz pozycję Przeglądaj katalog —> dzienniki wdrażania.
3. Przejrzyj każdy dziennik, aby znaleźć zgłoszone problemy.

Czy aplikacja frontonu może komunikować się z aplikacją zaplecza?

Ponieważ aplikacja frontonu wywołuje aplikację zaplecza z kodu źródłowego serwera, nie jest to coś, co widać w ruchu sieciowym przeglądarki. Użyj poniższej listy, aby określić powodzenie żądania profilu zaplecza:

• Aplikacja internetowa zaplecza zwraca wszelkie błędy do aplikacji frontonu, jeśli została osiągnięta. Jeśli nie został osiągnięty, aplikacja frontonu zgłasza kod stanu i komunikat.
  • 401: Użytkownik nie przeszedł poprawnie uwierzytelniania. Może to wskazywać, że zakres nie jest poprawnie ustawiony.
  • 404: Adres URL serwera nie jest zgodny z trasą, którą ma serwer
• Użyj dzienników przesyłania strumieniowego aplikacji zaplecza, aby obserwować żądanie frontonu dla profilu użytkownika. W kodzie console.log źródłowym znajdują się informacje debugowania, które pomagają określić, gdzie wystąpił błąd.

Co się stanie po wygaśnięciu tokenu frontonu?

Token dostępu wygasa po pewnym czasie. Aby uzyskać informacje na temat odświeżania tokenów dostępu bez konieczności ponownego uwierzytelniania użytkowników w aplikacji, zobacz Odświeżanie tokenów dostawców tożsamości.

Następne kroki

Które czynności umiesz wykonać:

• Włączanie wbudowanego uwierzytelniania i autoryzacji
• Zabezpieczanie aplikacji przed nieuwierzytelnionymi żądaniami
• Używanie identyfikatora Entra firmy Microsoft jako dostawcy tożsamości
• Uzyskiwanie dostępu do zdalnej aplikacji w imieniu zalogowanego użytkownika
• Zabezpieczanie wywołań między usługami, korzystając z uwierzytelniania przy użyciu tokenów
• Używanie tokenów dostępu z poziomu kodu serwera
• Używanie tokenów dostępu z poziomu kodu klienta (przeglądarki)

Przejdź do następnego samouczka, aby dowiedzieć się, jak używać tożsamości tego użytkownika do uzyskiwania dostępu do usługi platformy Azure.

 Tworzenie bezpiecznej aplikacji n-warstwowej w usłudze aplikacja systemu Azure Service