Wdrażanie aplikacji internetowej Node.js na platformie Azure

• Posiadanie konta platformy Azure z aktywną subskrypcją. Jeśli go nie masz, możesz bezpłatnie utworzyć konto.
• Zainstaluj Node.js LTS. Uruchom polecenie node --version , aby sprawdzić, czy Node.js jest zainstalowana.
• Zainstalowanie programu Visual Studio Code.
• Zainstaluj rozszerzenie Azure App Service dla programu Visual Studio Code.

• Posiadanie konta platformy Azure z aktywną subskrypcją. Jeśli go nie masz, możesz bezpłatnie utworzyć konto.
• Zainstaluj Node.js LTS. Uruchom polecenie node --version , aby sprawdzić, czy Node.js jest zainstalowana.
• Zainstaluj Azure CLI, którego można użyć do uruchamiania poleceń w powłoce, aby utworzyć i skonfigurować zasoby platformy Azure.

• Posiadanie konta platformy Azure z aktywną subskrypcją. Jeśli go nie masz, możesz bezpłatnie utworzyć konto.
• Zainstaluj Node.js LTS. Uruchom polecenie node --version , aby sprawdzić, czy Node.js jest zainstalowana.
• Klient FTP, taki jak FileZilla, ma przesyłać pliki do usługi App Service.

Logowanie się do platformy Azure

1. W terminalu upewnij się, że jesteś w katalogu myExpressApp , a następnie uruchom program Visual Studio Code za pomocą następującego polecenia:

   code .
   

2. W programie Visual Studio Code na pasku działań wybierz logo platformy Azure.

3. Upewnij się, że zalogowaliśmy się przy użyciu konta platformy Azure.

Konfigurowanie aplikacji usługi App Service i wdrażanie kodu

W terminalu upewnij się, że jesteś w katalogu myExpressApp . Zastąp <app-name> globalnie unikalną nazwą, a następnie stwórz grupę zasobów, plan App Service i aplikację. Ustaw SCM_DO_BUILD_DURING_DEPLOYMENT tak, aby App Service instalował zależności i budował aplikację podczas wdrażania archiwum źródłowego.

az group create --name myResourceGroup --location eastus
az appservice plan create --name myAppServicePlan --resource-group myResourceGroup --sku P0v3 --is-linux
az webapp create --name <app-name> --resource-group myResourceGroup --plan myAppServicePlan --runtime "NODE:24-lts"
az webapp config appsettings set --name <app-name> --resource-group myResourceGroup --settings SCM_DO_BUILD_DURING_DEPLOYMENT=true

az group create --name myResourceGroup --location eastus
az appservice plan create --name myAppServicePlan --resource-group myResourceGroup --sku P0v3
az webapp create --name <app-name> --resource-group myResourceGroup --plan myAppServicePlan --runtime "NODE:24LTS"
az webapp config appsettings set --name <app-name> --resource-group myResourceGroup --settings SCM_DO_BUILD_DURING_DEPLOYMENT=true

• az Jeśli polecenie nie jest rozpoznawane, upewnij się, że masz zainstalowany interfejs wiersza polecenia platformy Azure zgodnie z opisem w temacie Konfigurowanie środowiska początkowego.
• Zastąp <app-name> unikalną nazwą w całym środowisku Azure (poprawne znaki to a-z, 0-9 i -).
• Ten argument --sku P0v3 wybiera płatny poziom cenowy Premium v3. Zastąp eastus preferowanym regionem; wyświetl listę dostępnych regionów za pomocą az account list-locations.
• --is-linux wybiera plan Linux. Pomiń to dla planu Windows, jak pokazano w zakładce Windows.

Utwórz archiwum ZIP plików w myExpressApp, a nie katalogu nadrzędnego. Na Linuksie lub macOS uruchom zip -r ../app.zip . -x '*/node_modules/*' '*/.git/*' '*/.env*' z myExpressApp. W systemie Windows uruchom Compress-Archive -Path (Get-ChildItem -Force -Name | Where-Object { $_ -notin @('node_modules', '.git') -and $_ -notlike '.env*' }) -DestinationPath ..\app.zip w programie PowerShell w folderze myExpressApp. Następnie wdroż archiwum:

az webapp deploy --resource-group myResourceGroup --name <app-name> --src-path ../app.zip --type zip

Przejdź do https://<app-name>.azurewebsites.net, aby wyświetlić aplikację.

Tworzenie zasobów platformy Azure

1. Zaloguj się w witrynie Azure Portal.

2. Aby rozpocząć tworzenie aplikacji Node.js, przejdź do witryny https://portal.azure.com/#create/Microsoft.WebSite.

3. Na karcie Podstawowe w obszarze Project Details upewnij się, że wybrano poprawną subskrypcję, a następnie wybierz pozycję Utwórz nową, aby utworzyć grupę zasobów. Wpisz nazwę myResourceGroup.

   

4. W obszarze Szczegóły wystąpienia wpisz globalnie unikatową nazwę aplikacji internetowej i wybierz pozycję Kod. Wybierz Node 24 LTS w stosie uruchomieniowym, system operacyjny i region, z którego chcesz uruchamiać swoją aplikację.

   

5. W obszarze Plany cenowe wybierz pozycję Utwórz nowy , aby utworzyć plan usługi App Service. Wpisz myAppServicePlan jako nazwę. Aby przejść do warstwy Bezpłatna, wybierz pozycję Bezpłatna F1 na liście Plan cenowy .

   

6. Wybierz przycisk Przejrzyj i utwórz w dolnej części strony.

   

7. Po zakończeniu walidacji kliknij przycisk Utwórz znajdujący się w dolnej części strony.

8. Po zakończeniu wdrażania wybierz pozycję Przejdź do zasobu.

   

Pobieranie poświadczeń usługi FTPS

Usługa Azure App Service obsługuje dwa typy poświadczeń dla wdrożenia FTP/S. Te poświadczenia nie są takie same jak poświadczenia subskrypcji platformy Azure. W tej sekcji uzyskasz poświadczenia zakresu aplikacji do użycia z klientem FTP.

1. Na stronie aplikacji usługi App Service wybierz pozycję Centrum wdrażania w obszarze Wdrożenie w menu paska bocznego, a następnie wybierz kartę Poświadczenia FTPS .

   

2. Otwórz klienta FTP i przejdź do folderu myExpressApp .

3. Na karcie Poświadczenia FTPS skopiuj punkt końcowy FTPS, nazwę użytkownika i hasło do klienta FTP.

   

4. Wybierz pozycję Połącz w kliencie FTP.

Wdrażanie plików za pomocą usługi FTPS

1. Skopiuj wszystkie pliki i pliki katalogów do katalogu /site/wwwroot na platformie Azure.

   

2. Przejdź do adresu URL aplikacji, aby sprawdzić, czy aplikacja działa prawidłowo.

2. W Eksploratorze usługi App Service ponownie wybierz ikonę Wdróż w aplikacji internetowej i potwierdź, wybierając pozycję Wdróż ponownie.

3. Poczekaj na zakończenie wdrożenia, a następnie wybierz pozycję Przeglądaj witrynę internetową w wyskakującym okienku powiadomień. Powinieneś zobaczyć, że komunikat Welcome to Express został zmieniony na Welcome to Azure.

2. Zapisz zmiany, utwórz ponownie ../app.zip z plików aplikacji, jak opisano w Deploy to Azure, i wdroż ponownie:

   az webapp deploy --resource-group myResourceGroup --name <app-name> --src-path ../app.zip --type zip
   

   Zastąp <app-name> nazwą, której użyłeś przy tworzeniu aplikacji webowej.

3. Po zakończeniu wdrażania odśwież stronę internetową. Powinieneś zobaczyć, że komunikat Welcome to Express został zmieniony na Welcome to Azure.

2. Zapisz zmiany, a następnie ponownie wdróż aplikację przy użyciu klienta FTP.

3. Po zakończeniu wdrażania odśwież stronę internetową. Powinieneś zobaczyć, że komunikat Welcome to Express został zmieniony na Welcome to Azure.

Możesz przesyłać strumieniowo dane wyjściowe dziennika (wywołania do console.log()) z aplikacji platformy Azure bezpośrednio w oknie danych wyjściowych programu Visual Studio Code.

1. W obszarze Zasoby w programie Visual Studio Code kliknij prawym przyciskiem myszy węzeł aplikacji, a następnie wybierz polecenie Uruchom dzienniki przesyłania strumieniowego.

   

2. Jeśli zostanie wyświetlony monit o ponowne uruchomienie aplikacji, wybierz pozycję Tak. Po ponownym uruchomieniu aplikacji zostanie otwarte okno danych wyjściowych programu Visual Studio Code z połączeniem ze strumieniem dziennika.

3. Po kilku sekundach w oknie danych wyjściowych zostanie wyświetlony komunikat wskazujący, że masz połączenie z usługą przesyłania dzienników. Możesz wygenerować więcej działań wyjściowych, odświeżając stronę w przeglądarce.

   Connecting to log stream...
   2020-03-04T19:29:44  Welcome, you are now connected to log-streaming service. The default timeout is 2 hours.
   Change the timeout with the App Setting SCM_LOGSTREAM_TIMEOUT (in seconds).
   

Możesz uzyskać dostęp do dzienników konsoli wygenerowanych przez aplikację oraz kontener, w którym jest uruchamiana. Dzienniki obejmują wszystkie dane wyjściowe wygenerowane przez wywołania do console.log().

Aby wyświetlić logi w czasie rzeczywistym, uruchom az webapp log tail:

• Włącz logowanie najpierw: na Linuksie, uruchom az webapp log config --resource-group myResourceGroup --name <app-name> --docker-container-logging filesystem; na Windows, uruchom az webapp log config --resource-group myResourceGroup --name <app-name> --application-logging filesystem.

az webapp log tail --resource-group myResourceGroup --name <app-name>

Zastąp <app-name> nazwą, której użyłeś przy tworzeniu aplikacji webowej.

Odśwież aplikację w przeglądarce, aby wygenerować dzienniki konsoli, w tym komunikaty opisujące żądania HTTP do aplikacji. Jeśli żadne dane wyjściowe nie pojawią się natychmiast, spróbuj ponownie w ciągu 30 sekund.

Aby zatrzymać przesyłanie strumieniowe dzienników w dowolnym momencie, wybierz Ctrl+C w terminalu.

Możesz uzyskać dostęp do dzienników konsoli wygenerowanych przez aplikację oraz kontener, w którym jest uruchamiana. Możesz przesyłać strumieniowo logi (wywołania do console.log()) z aplikacji Node.js bezpośrednio w portalu Azure.

1. Na stronie App Service dla Twojej aplikacji skorzystaj z menu bocznego, aby przejść do sekcji Monitorowanie i wybrać Strumień dziennika.

   

2. Po kilku sekundach w oknie danych wyjściowych zostanie wyświetlony komunikat wskazujący, że masz połączenie z usługą przesyłania dzienników. Możesz wygenerować więcej działań wyjściowych, odświeżając stronę w przeglądarce.

   Connecting...
   2021-10-26T21:04:14  Welcome, you are now connected to log-streaming service.
   Starting Log Tail -n 10 of existing logs ----
   /appsvctmp/volatile/logs/runtime/81b1b83b27ea1c3d598a1cdec28c71c4074ce66c735d0be57f15a8d07cb3178e.log
   2021-10-26T21:04:08.614384810Z: [INFO]
   2021-10-26T21:04:08.614393710Z: [INFO]  # Enter the source directory to make sure the script runs where the user expects
   2021-10-26T21:04:08.614399010Z: [INFO]  cd "/home/site/wwwroot"
   2021-10-26T21:04:08.614403210Z: [INFO]
   2021-10-26T21:04:08.614407110Z: [INFO]  export NODE_PATH=/usr/local/lib/node_modules:$NODE_PATH
   2021-10-26T21:04:08.614411210Z: [INFO]  if [ -z "$PORT" ]; then
   2021-10-26T21:04:08.614415310Z: [INFO]          export PORT=8080
   2021-10-26T21:04:08.614419610Z: [INFO]  fi
   2021-10-26T21:04:08.614423411Z: [INFO]
   2021-10-26T21:04:08.614427211Z: [INFO]  node /opt/startup/default-static-site.js
   Ending Log Tail of existing logs ---
   

W poprzednich krokach utworzono zasoby platformy Azure w grupie zasobów. Kroki opisane w tym przewodniku szybkiego startu umieszczają wszystkie zasoby w tej grupie zasobów. Aby wyczyścić, wystarczy usunąć grupę zasobów.

1. W rozszerzeniu platformy Azure dla Visual Studio Code na liście Grupuj według wybierz pozycję Grupuj według grupy zasobów.

2. Na liście Zasoby rozwiń subskrypcję, kliknij prawym przyciskiem myszy utworzoną wcześniej grupę zasobów, a następnie wybierz polecenie Usuń grupę zasobów.

   

3. Po wyświetleniu monitu potwierdź usunięcie, wprowadzając nazwę usuniętej grupy zasobów. Po potwierdzeniu grupa zasobów zostanie usunięta i zostanie wyświetlone powiadomienie po zakończeniu.

W poprzednich krokach CLI utworzyłeś zasoby Azure w myResourceGroup.

Jeśli nie oczekujesz, że te zasoby będą potrzebne w przyszłości, usuń grupę zasobów, uruchamiając następujące polecenie:

az group delete --name myResourceGroup --no-wait

--no-wait Argument umożliwia zwracanie polecenia przed ukończeniem operacji.

Możesz usunąć grupę zasobów, usługę App Service i wszystkie powiązane zasoby, gdy nie są już potrzebne.

1. Na stronie przeglądu usługi App Service wybierz grupę zasobów utworzoną w kroku Tworzenie zasobów platformy Azure.

   

2. Na stronie grupy zasobów wybierz pozycję Usuń grupę zasobów. Potwierdź nazwę grupy zasobów, aby zakończyć usuwanie zasobów.