Tworzenie i wdrażanie aplikacji Node.js

W tym artykule pokazano, jak za pomocą usługi Azure Pipelines utworzyć potok, który kompiluje i wdraża aplikację Node.js w usłudze Azure App Service z ciągłą integracją i ciągłym wdrażaniem (CD). CI/CD (Ciągła integracja/ciągłe wdrażanie) zmniejsza ryzyko przestojów i błędów, automatycznie kompilując i wdrażając aplikację za każdym razem, gdy dokonano zatwierdzenia w repozytorium kodu aplikacji.

Wymagania wstępne

Sforkuj przykładową aplikację

1. W usłudze GitHub przejdź do repozytorium Node.js Hello World i wybierz pozycję Fork w górnym menu.

   

2. Wybierz swoją organizację GitHub jako właściciela forka, jeśli nie została jeszcze wybrana, a następnie wybierz Utwórz fork.

   

Przeglądarka otwiera nowe rozwidlenie pod adres URL https://github.com/<owner>/nodejs-docs-hello-world.

Tworzenie i wdrażanie aplikacji internetowej usługi App Service

Utwórz aplikację internetową usługi Azure App Service przy użyciu usługi Cloud Shell w witrynie Azure Portal. Aby użyć usługi Cloud Shell, zaloguj się do witryny Azure Portal i wybierz przycisk Cloud Shell na górnym pasku narzędzi.

W dolnej części przeglądarki zostanie wyświetlona usługa Cloud Shell. Upewnij się, że powłoka Bash jest zaznaczona jako środowisko w menu rozwijanym.

Tworzenie i wdrażanie aplikacji internetowej

1. W usłudze Cloud Shell sklonuj rozwidlenie repozytorium na platformę Azure za pomocą następującego polecenia, zastępując <your-forked-repository-url> ciąg adresem URL rozwidlenia repozytorium.

   git clone <your-forked-repository-url>
   

2. Zmień katalog na sklonowany folder repozytorium.

   cd nodejs-docs-hello-world
   

3. Uruchom polecenie az webapp up , aby aprowizować aplikację internetową usługi App Service i wykonać pierwsze wdrożenie. Argument --sku F1 tworzy aplikację internetową w warstwie cenowej Bezpłatna, co nie wiąże się z żadnymi kosztami.

   Uruchamianie az webapp up bez name parametrów automatycznie przypisuje losowo wygenerowaną nazwę aplikacji internetowej, która jest unikatowa na platformie Azure. Możesz również użyć parametru --name <web-app-name> , aby przypisać dowolną nazwę unikatową na platformie Azure, taką jak osobista lub nazwa firmy z identyfikatorem aplikacji, na przykład --name <your-name>-nodeapp.

   az webapp up --sku F1 --name <app-name>
   

Polecenie az webapp up rozpoznaje aplikację jako aplikację Node.js i wykonuje następujące akcje:

1. Tworzy domyślną grupę zasobów.
2. Tworzy domyślny plan usługi App Service.
3. Tworzy aplikację internetową o przypisanej nazwie i adresie URL <your-web-app-name>.azurewebsites.net.
4. ZIP wdraża wszystkie pliki z bieżącego katalogu roboczego, z włączoną automatyzacją kompilacji.
5. Buforuje parametry lokalnie w pliku .azure/config , aby nie trzeba było ich ponownie określać podczas wdrażania z folderu projektu za pomocą az webapp up polecenia lub innych az webapp poleceń.

Możesz zastąpić domyślne akcje własnymi wartościami przy użyciu parametrów polecenia. Aby uzyskać więcej informacji, zobacz az webapp up.

Polecenie generuje komunikaty o stanie podczas jego uruchamiania. Po pomyślnym uruchomieniu witryny internetowej możesz wybrać link, You can launch the app at https://<your-web-app-name>.azurewebsites.net aby przejść do aplikacji internetowej Hello World .

Polecenie az webapp up generuje następujące dane wyjściowe JSON dla przykładowej aplikacji internetowej:

{
  "URL": "<your-web-app-url>",
  "appserviceplan": "<your-app-service-plan-name>",
  "location": "<your-azure-region>",
  "name": "<your-web-app-name>",
  "os": "Linux",
  "resourcegroup": "<your-resource-group-name>",
  "runtime_version": "node|20-LTS",
  "runtime_version_detected": "10.0",
  "sku": "FREE",
  "src_path": "<repository-source-path>"
}

Utwórz przepływ na podstawie szablonu

1. W projekcie usługi Azure DevOps wybierz pozycję Potoki z menu nawigacji po lewej stronie, a następnie wybierz pozycję Nowy potok lub Utwórz potok , jeśli ten potok jest pierwszym w projekcie.

2. Na ekranie Gdzie jest twój kod wybierz pozycję GitHub.

3. Na ekranie Wybieranie repozytorium wybierz repozytorium fork nodejs-docs-hello-world.

4. Usługa Azure Pipelines rozpoznaje kod jako aplikację Node.js i sugeruje kilka szablonów potoków na stronie Konfigurowanie potoku . Wybierz Node.js Express Web App to Linux on Azure.

5. Na następnym ekranie wybierz subskrypcję platformy Azure i wybierz pozycję Kontynuuj. Ta akcja powoduje utworzenie połączenia usługi z zasobami platformy Azure.

6. Na następnym ekranie wybierz aplikację internetową platformy Azure, a następnie wybierz pozycję Weryfikuj i skonfiguruj. Usługa Azure Pipelines tworzy plik azure-pipelines.yml i wyświetla go w edytorze potoków YAML.

7. Na ekranie Przeglądanie potoku YAML przejrzyj kod dla swojego potoku.

   Pipeline wykonuje następujące operacje:

   • Ustawia wywołanie przy każdym zatwierdzeniu w gałęzi głównej kodu.
   • Ustanawia i używa zmiennych dla połączenia z usługą, aplikacji internetowej, obrazu maszyny i środowiska.
   • Instaluje Node.js na agencie kompilacji i używa narzędzia npm do uruchamiania i testowania kompilacji aplikacji.
   • Pakuje utworzoną aplikację do archiwum ZIP i przesyła plik ZIP do lokalizacji docelowej.
   • Wdraża pakiet ZIP w aplikacji usługi App Service i uruchamia aplikację.

Zapisz i uruchom potok

1. Po przejrzeniu kodu wybierz pozycję Zapisz i uruchom oraz Zapisz i uruchom ponownie, aby zapisać i uruchomić potok danych. Plik azure-pipelines.yml jest zapisywany w rozwidlonym repozytorium, a kod jest wdrażany w usłudze Azure App Service.

   Uwaga

   Przy pierwszym uruchomieniu potoku zostanie wyświetlony monit o pozwolenie na dostęp do tworzonego środowiska. Wybierz Zezwól, aby udzielić potokowi pozwolenia na dostęp do środowiska.

2. Na stronie Podsumowanie uruchomienia wybierz zadanie, aby obserwować uruchomienie potoku i śledzić jego kompilację.

3. Gdy przebieg zakończy się pomyślnie, wybierz zadanie Wdrażanie aplikacji internetowej platformy Azure , a następnie wybierz adres URL aplikacji usługi App Service , aby wyświetlić wdrożonej witryny internetowej.

   

4. Sprawdź, czy witryna działa w usłudze App Service pod adresem URL wdrożonej witryny internetowej.

   

Uruchom kompilację i wdrażanie CI

Słowo kluczowe trigger: main konfiguruje potok do uruchamiania za każdym razem po zatwierdzeniu zmiany w rozgałęzionej gałęzi main repozytorium kodu. Aby uruchomić build CI:

1. Przejdź do Twojego sforgowanego repozytorium GitHub i wprowadź niewielką zmianę w pliku README.md.
2. Wybierz pozycję Zatwierdź zmiany i ponownie zatwierdź zmiany .
3. W usłudze Azure Pipelines sprawdź, czy potok nodejs-docs-hello-world jest uruchamiany ponownie z opisem Individual CI.

Czyszczenie zasobów

Jeśli nie są już potrzebne, możesz usunąć zasoby utworzone na potrzeby tego artykułu.

• Aby usunąć zasoby usługi Azure App Service, uruchom następujące polecenia w kolejności w usłudze Cloud Shell. Przed usunięciem planu usługi App Service należy usunąć aplikację internetową, a przed usunięciem jej grupy zasobów musisz usunąć plan usługi App Service.

  az webapp delete --name <web-app-name> --resource-group <resource-group-name>
  az appservice plan delete --name <app-service-plan-name> --resource-group <resource-group-name>
  az group delete --name <resource-group-name>
  

• Aby usunąć potok w usłudze Azure Pipelines, wybierz potok, wybierz ikonę Więcej akcji w prawym górnym rogu strony potoku, a następnie wybierz pozycję Usuń. Aby usunąć projekt usługi Azure DevOps, zobacz Usuwanie projektu.

• Aby usunąć zaforkowane repozytorium nodejs-docs-hello-world z GitHub, przejdź do repozytorium i wybierz pozycję Ustawienia w górnym menu. Przewiń na dół strony i wybierz pozycję Usuń to repozytorium.

Powiązana zawartość

• Dostosowywanie języka JavaScript
• Wdrażanie do usługi App Service przy użyciu usługi Azure Pipelines