Sdílet prostřednictvím


Kurz: Nasazení webové aplikace Node.js + MongoDB do Azure

Aplikace Azure Služba poskytuje vysoce škálovatelnou službu hostování webů s automatickými opravami pomocí operačního systému Linux. V tomto kurzu se dozvíte, jak vytvořit zabezpečenou Node.js aplikaci ve službě Aplikace Azure, která je připojená k databázi Azure Cosmos DB for MongoDB. Po dokončení budete mít aplikaci Express.js spuštěnou ve službě Aplikace Azure Service v Linuxu.

Snímek obrazovky Node.js aplikace, která ukládá data ve službě Cosmos DB

V tomto kurzu se naučíte:

  • Vytvořte zabezpečenou výchozí architekturu pro službu Aplikace Azure a Azure Cosmos DB pomocí rozhraní MongoDB API.
  • Zabezpečení tajných kódů připojení pomocí spravované identity a odkazů na Key Vault
  • Nasaďte ukázkovou aplikaci Node.js do služby App Service z úložiště GitHub.
  • Přístup k nastavení aplikace App Service v kódu aplikace
  • Proveďte aktualizace a znovu nasaďte kód aplikace.
  • Streamování diagnostických protokolů ze služby App Service
  • Správa aplikace na webu Azure Portal
  • Zřiďte stejnou architekturu a nasaďte ji pomocí Azure Developer CLI.
  • Optimalizujte svůj vývojový pracovní postup pomocí GitHub Codespaces a GitHub Copilotu.

Požadavky

  • Účet Azure s aktivním předplatným. Pokud účet Azure nemáte, můžete si ho zdarma vytvořit.
  • Účet GitHub. můžete si ho zdarma získat.
  • Znalost vývoje Express.js
  • (Volitelné) Pokud chcete vyzkoušet GitHub Copilot, účet GitHub Copilot. K dispozici je 30denní bezplatná zkušební verze.
  • Účet Azure s aktivním předplatným. Pokud účet Azure nemáte, můžete si ho zdarma vytvořit.
  • Nainstalované rozhraní příkazového řádku pro vývojáře Azure Pomocí Azure Cloud Shellu můžete postupovat podle kroků, protože už má nainstalované rozhraní příkazového řádku Azure Developer CLI.
  • Znalost vývoje Express.js
  • (Volitelné) Pokud chcete vyzkoušet GitHub Copilot, účet GitHub Copilot. K dispozici je 30denní bezplatná zkušební verze.

Přeskočit na konec

Ukázkovou aplikaci můžete rychle nasadit v tomto kurzu a zobrazit ji spuštěnou v Azure. V Azure Cloud Shellu stačí spustit následující příkazy a postupovat podle pokynů:

mkdir msdocs-nodejs-mongodb-azure-sample-app
cd msdocs-nodejs-mongodb-azure-sample-app
azd init --template msdocs-nodejs-mongodb-azure-sample-app
azd up

1. Spuštění ukázky

Nejprve nastavíte ukázkovou aplikaci řízenou daty jako výchozí bod. Ukázkové úložiště zahrnuje konfiguraci vývojového kontejneru. Vývojový kontejner má vše, co potřebujete k vývoji aplikace, včetně databáze, mezipaměti a všech proměnných prostředí potřebných ukázkovou aplikací. Vývojový kontejner se může spouštět v kódu GitHubu, což znamená, že ukázku můžete spustit na libovolném počítači s webovým prohlížečem.

Krok 1: V novém okně prohlížeče:

  1. Přihlaste se k účtu GitHub.
  2. Přejděte na https://github.com/Azure-Samples/msdocs-nodejs-mongodb-azure-sample-app/fork.
  3. Zrušte výběr možnosti Kopírovat pouze hlavní větev. Chcete všechny větve.
  4. Vyberte Vytvořit fork.

Snímek obrazovky znázorňující, jak vytvořit fork ukázkového úložiště GitHub

Krok 2: Ve forku GitHubu:

  1. Pro počáteční větev vyberte hlavní>počáteční-no-infra. Tato větev obsahuje pouze ukázkový projekt a žádné soubory ani konfiguraci související s Azure.
  2. Vyberte Code>Create codespace on starter-no-infra. Nastavení codespace trvá několik minut.

Snímek obrazovky znázorňující, jak vytvořit prostor kódu na GitHubu

Krok 3: V terminálu codespace:

  1. Spusťte npm install && npm start.
  2. Až se zobrazí oznámení Your application running on port 3000 is available., vyberte Otevřít v prohlížeči. Ukázkovou aplikaci byste měli vidět na nové kartě prohlížeče. Chcete-li zastavit Express.js aplikaci, zadejte Ctrl+C.

Snímek obrazovky znázorňující, jak spustit ukázkovou aplikaci v prostředí codespace GitHubu

Tip

O tomto úložišti můžete požádat GitHub Copilot . Příklad:

  • @workspace Co tento projekt dělá?
  • @workspace Co dělá složka .devcontainer?

Máte problémy? Projděte si část Řešení potíží.

2. Vytvoření služby App Service a Azure Cosmos DB

V tomto kroku vytvoříte prostředky Azure. Kroky použité v tomto kurzu vytvoří sadu prostředků zabezpečení ve výchozím nastavení, které zahrnují App Service a Azure Cosmos DB pro MongoDB. Pro proces vytváření zadáte:

  • Název webové aplikace. Používá se jako součást názvu DNS pro vaši aplikaci ve formě https://<app-name>-<hash>.<region>.azurewebsites.net.
  • Oblast, ve které se má aplikace spouštět fyzicky na světě. Používá se také jako součást názvu DNS pro vaši aplikaci.
  • Zásobník modulu runtime pro aplikaci. Tady vyberete verzi Node, kterou chcete pro svou aplikaci použít.
  • Plán hostování aplikace. Je to cenová úroveň, která zahrnuje sadu funkcí a kapacitu škálování vaší aplikace.
  • Skupina prostředků pro aplikaci. Skupina prostředků umožňuje seskupovat (v logickém kontejneru) všechny prostředky Azure potřebné pro aplikaci.

Přihlaste se k webu Azure Portal a podle těchto kroků vytvořte prostředky služby Aplikace Azure Service.

Krok 1: Na webu Azure Portal:

  1. Do vyhledávacího panelu v horní části webu Azure Portal zadejte "databáze webové aplikace".
  2. Vyberte položku s popiskem Web App + Database pod nadpisem Marketplace . Můžete také přejít přímo do průvodce vytvořením.

Snímek obrazovky znázorňující použití vyhledávacího pole v horním panelu nástrojů k vyhledání průvodce vytvořením webové aplikace a databáze

Krok 2: Na stránce Vytvořit webovou aplikaci a databázi vyplňte formulář následujícím způsobem.

  1. Skupina prostředků: Vyberte Vytvořit nový a použijte název msdocs-expressjs-mongodb-tutorial.
  2. Oblast: Libovolná oblast Azure, která je blízko vás.
  3. Název: msdocs-expressjs-mongodb-XYZ, kde XYZ je jakékoli tři náhodné znaky.
  4. Zásobník modulu runtime: Node 20 LTS.
  5. Modul: Rozhraní API služby Cosmos DB pro MongoDB Azure Cosmos DB je nativní cloudová databáze s 100% kompatibilním rozhraním API MongoDB. Poznamenejte si název databáze, který je pro vás vygenerovaný (app-name-database>).< Budete ho totiž potřebovat později.
  6. Plán hostování: Basic. Až budete připraveni, můžete vertikálně navýšit kapacitu na cenovou úroveň produkčního prostředí.
  7. Vyberte Zkontrolovat a vytvořit.
  8. Po dokončení ověření vyberte Vytvořit.

Snímek obrazovky znázorňující, jak nakonfigurovat novou aplikaci a databázi v průvodci webovou aplikací a databází

Krok 3: Dokončení nasazení trvá několik minut. Po dokončení nasazení vyberte tlačítko Přejít k prostředku . Přejdete přímo do aplikace App Service, ale vytvoří se následující prostředky:

  • Skupina prostředků → Kontejner pro všechny vytvořené prostředky.
  • Plán služby App Service → Definuje výpočetní prostředky služby App Service. Vytvoří se plán Linuxu na úrovni Basic .
  • → App Service Představuje vaši aplikaci a běží v plánu služby App Service.
  • Virtuální síť → integrovaná s aplikací App Service a izoluje back-endový síťový provoz.
  • Privátní koncový bod → koncový bod přístupu pro prostředek databáze ve virtuální síti.
  • Síťové rozhraní → Představuje privátní IP adresu privátního koncového bodu.
  • Služba Azure Cosmos DB pro MongoDB → přístupná pouze z zákulisí privátního koncového bodu. Databáze a uživatel se pro vás vytvoří na serveru.
  • Privátní DNS zónu → Umožňuje překlad DNS serveru Azure Cosmos DB ve virtuální síti.

Snímek obrazovky znázorňující dokončení procesu nasazení

Máte problémy? Projděte si část Řešení potíží.

3. Zabezpečení tajných kódů připojení

Průvodce vytvořením vygeneroval připojovací řetězec, který jste už vytvořili jako nastavení aplikace. Osvědčeným postupem zabezpečení je ale úplné zachování tajných kódů mimo službu App Service. Tajné kódy přesunete do trezoru klíčů a změníte nastavení aplikace na referenční informace ke službě Key Vault pomocí konektorů služeb.

Krok 1: Na stránce služby App Service:

  1. V nabídce vlevo vyberte Proměnné prostředí Nastavení>.
  2. Vedle AZURE_COSMOS_CONNECTIONSTRING vyberte Zobrazit hodnotu. Tato připojovací řetězec umožňuje připojit se k databázi Cosmos DB zabezpečenou za privátním koncovým bodem. Tajný kód se ale uloží přímo v aplikaci App Service, což není nejlepší. Změníte to.

Snímek obrazovky znázorňující, jak zobrazit hodnotu nastavení aplikace

Krok 2: Vytvoření trezoru klíčů pro zabezpečenou správu tajných kódů

  1. Na horním panelu hledání zadejte "key vault" a pak vyberte Marketplace>Key Vault.
  2. Ve skupině prostředků vyberte msdocs-expressjs-mongodb-tutorial.
  3. Do názvu trezoru klíčů zadejte název, který se skládá jenom z písmen a číslic.
  4. V oblasti ji nastavte na ukázkové umístění jako skupinu prostředků.

Snímek obrazovky znázorňující, jak vytvořit trezor klíčů

Krok 3:

  1. Vyberte kartu Sítě.
  2. Zrušte výběr možnosti Povolit veřejný přístup.
  3. Vyberte Vytvořit privátní koncový bod.
  4. Ve skupině prostředků vyberte msdocs-expressjs-mongodb-tutorial.
  5. Do názvu trezoru klíčů zadejte název, který se skládá jenom z písmen a číslic.
  6. V oblasti ji nastavte na ukázkové umístění jako skupinu prostředků.
  7. V dialogovém okně v umístění vyberte stejné umístění jako vaše aplikace App Service.
  8. Ve skupině prostředků vyberte msdocs-expressjs-mongodb-tutorial.
  9. Do pole Název zadejte msdocs-expressjs-mongodb-XYZVaultEndpoint.
  10. Ve virtuální síti vyberte msdocs-expressjs-mongodb-XYZVnet.
  11. V podsíti msdocs-expressjs-mongodb-XYZSubnet.
  12. Vyberte OK.
  13. Vyberte Zkontrolovat a vytvořit a pak Vytvořit. Počkejte na dokončení nasazení trezoru klíčů. Měla by se zobrazit informace o tom, že vaše nasazení je dokončené.

Snímek obrazovky znázorňující, jak zabezpečit trezor klíčů pomocí privátního koncového bodu

Krok 4:

  1. Na horním panelu hledání zadejte msdocs-expressjs-mongodb a pak prostředek služby App Service s názvem msdocs-expressjs-mongodb-XYZ.
  2. Na stránce služby App Service v nabídce vlevo vyberte Konektor služby Nastavení>. Konektor, který pro vás vytvořil průvodce vytvořením aplikace, už existuje.
  3. Zaškrtněte políčko vedle spojnice a pak vyberte Upravit.
  4. Na kartě Základy nastavte typ klienta na Node.js.
  5. Vyberte kartu Ověřování.
  6. Vyberte Uložit tajný klíč ve službě Key Vault.
  7. V části Připojení ke službě Key Vault vyberte Vytvořit nový. V horní části dialogového okna pro úpravy se otevře dialogové okno Vytvořit připojení .

Snímek obrazovky znázorňující, jak upravit konektor služby s připojením trezoru klíčů

Krok 5: V dialogovém okně Vytvořit připojení pro připojení ke službě Key Vault:

  1. Ve službě Key Vault vyberte trezor klíčů, který jste vytvořili dříve.
  2. Vyberte Zkontrolovat a vytvořit. Měli byste vidět, že spravovaná identita přiřazená systémem je nastavená na Vybraná.
  3. Po dokončení ověření vyberte Vytvořit.

Snímek obrazovky znázorňující, jak nakonfigurovat konektor služby Key Vault Service

Krok 6: Jste zpátky v dialogovém okně pro úpravy pro defaultConnector.

  1. Na kartě Ověřování počkejte na vytvoření konektoru trezoru klíčů. Po dokončení ho rozevírací seznam Připojení ke službě Key Vault automaticky vybere.
  2. Vyberte Další: Sítě.
  3. Výběrem možnosti Konfigurovat pravidla brány firewall povolte přístup k cílové službě. Pokud se zobrazí zpráva Bez privátního koncového bodu v cílové službě, ignorujte ji. Průvodce vytvořením aplikace už databázi Cosmos DB zabezpečil privátním koncovým bodem.
  4. Zvolte Uložit. Počkejte, až se zobrazí oznámení o úspěšném dokončení aktualizace.

Snímek obrazovky znázorňující připojení trezoru klíčů vybrané ve výchozímconnectoru

Krok 7: Ověření změn:

  1. V nabídce vlevo znovu vyberte Proměnné prostředí.
  2. Vedle nastavení aplikace AZURE_COSMOS_CONNECTIONSTRING vyberte Zobrazit hodnotu. Hodnota by měla být @Microsoft.KeyVault(...), což znamená, že se jedná o odkaz na trezor klíčů, protože tajný klíč je teď spravovaný v trezoru klíčů.

Snímek obrazovky znázorňující, jak zobrazit hodnotu proměnné prostředí App Service v Azure

Máte problémy? Projděte si část Řešení potíží.

4. Nasazení ukázkového kódu

V tomto kroku nakonfigurujete nasazení GitHubu pomocí GitHub Actions. Je to jen jeden z mnoha způsobů nasazení do služby App Service, ale také skvělý způsob, jak mít kontinuální integraci v procesu nasazení. Ve výchozím nastavení spustí každá git push z vašich úložišť GitHub akci sestavení a nasazení.

Krok 1: V nabídce vlevo vyberte Deployment Center(Deployment Center).>

Snímek obrazovky znázorňující, jak otevřít centrum nasazení ve službě App Service

Krok 2: Na stránce Deployment Center:

  1. Ve zdroji vyberte GitHub. Ve výchozím nastavení je jako zprostředkovatel sestavení vybrán GitHub Actions .
  2. Přihlaste se ke svému účtu GitHub a postupujte podle pokynů k autorizaci Azure.
  3. V organizaci vyberte svůj účet.
  4. V úložišti vyberte msdocs-nodejs-mongodb-azure-sample-app.
  5. Ve větvi vyberte starter-no-infra. Jedná se o stejnou větev, ve které jste pracovali s ukázkovou aplikací bez jakýchkoli souborů nebo konfigurace souvisejících s Azure.
  6. Jako typ ověřování vyberte identitu přiřazenou uživatelem.
  7. V horní nabídce vyberte Uložit. App Service potvrdí soubor pracovního postupu do zvoleného úložiště GitHub v .github/workflows adresáři. Ve výchozím nastavení centrum nasazení vytvoří identitu přiřazenou uživatelem pro pracovní postup k ověření pomocí ověřování Microsoft Entra (ověřování OIDC). Alternativní možnosti ověřování najdete v tématu Nasazení do služby App Service pomocí GitHub Actions.

Snímek obrazovky znázorňující, jak nakonfigurovat CI/CD pomocí GitHub Actions

Krok 3: Zpět v prostoru kódu GitHubu ukázkového forku spusťte git pull origin starter-no-infra. Tím se do vašeho prostoru kódu načte nově potvrzený soubor pracovního postupu.

Snímek obrazovky znázorňující přijetí změn Gitu v kódu GitHubu

Krok 4 (možnost 1: s GitHub Copilotem):

  1. Začněte novou chatovací relaci výběrem zobrazení chatu a pak výběrem +možnosti .
  2. Zeptejte se na @workspace Jak se aplikace připojuje k databázi? Copilot vás může nasměrovat na soubor app.js a mongoose.connect volání.
  3. Řekněte "*Mám v Azure připojovací řetězec proměnnou s názvem AZURE_COSMOS_CONNECTIONSTRING.". Copilot vám může dát návrh kódu podobný tomu, který je v možnosti 2: bez kroků GitHub Copilot níže a dokonce vám řekněte, abyste udělali změnu v app.js.
  4. Otevřete app.js v průzkumníku a přidejte do metody návrh getApp kódu. GitHub Copilot vám pokaždé nedává stejnou odpověď, možná budete muset položit další otázky, abyste mohli doladit odpověď. Tipy najdete v tématu Co můžu dělat s GitHub Copilotem v kódu?.

Snímek obrazovky znázorňující, jak položit otázku v nové chatové relaci GitHub Copilot

Krok 4 (možnost 2: bez GitHub Copilotu):

  1. V průzkumníku otevřete app.js.
  2. Najděte čáru, kde mongoose.connect je volána (řádek 16) a přejděte process.env.MONGODB_URI na process.env.AZURE_COSMOS_CONNECTIONSTRING || process.env.MONGODB_URI.

Snímek obrazovky znázorňující kódový prostor GitHubu a app.js otevřený

Krok 5:

  1. Vyberte rozšíření správy zdrojového kódu .
  2. Do textového pole zadejte zprávu potvrzení, například Update environment variable. Nebo vyberte a nechte GitHub Copilot vygenerovat potvrzovací zprávu za vás.
  3. Vyberte Potvrdit a potvrďte akci ano.
  4. Vyberte Možnost Synchronizovat změny 1 a potvrďte akci OK.

Snímek obrazovky znázorňující potvrzené a nasdílené změny do GitHubu

Krok 6: Zpět na stránce Deployment Center na webu Azure Portal:

  1. Na kartě Protokoly vyberte Aktualizovat. Od potvrzených změn už je spuštěné nové spuštění nasazení.
  2. V položce protokolu pro spuštění nasazení vyberte položku Sestavit/Nasadit protokoly s nejnovějším časovým razítkem.

Snímek obrazovky znázorňující úspěšné nasazení na stránce Protokoly centra nasazení

Krok 7: Přejdete do úložiště GitHub a zjistíte, že je spuštěná akce GitHubu. Soubor pracovního postupu definuje dvě samostatné fáze, sestavení a nasazení. Počkejte na spuštění GitHubu, aby se zobrazil stav Dokončeno.

Snímek obrazovky znázorňující úspěšné spuštění GitHubu

Máte problémy? Projděte si část Řešení potíží.

5. Přejděte do aplikace.

Krok 1: Na stránce služby App Service:

  1. V nabídce vlevo vyberte Přehled.
  2. Vyberte adresu URL aplikace. Můžete také přejít přímo na https://<app-name>.azurewebsites.net.

Snímek obrazovky znázorňující, jak spustit službu App Service z webu Azure Portal

Krok 2: Přidejte do seznamu několik úkolů. Blahopřejeme, ve službě Aplikace Azure Service spouštíte zabezpečenou aplikaci Node.js řízenou daty.

Snímek obrazovky s aplikací Express.js spuštěnou ve službě App Service

6. Streamování diagnostických protokolů

Aplikace Azure Služba zaznamenává všechny zprávy protokolované do konzoly, aby vám pomohla při diagnostice problémů s vaší aplikací. Ukázková aplikace vypíše zprávy protokolu konzoly ve všech jejích koncových bodech, aby tuto funkci ukázala. Koncový bod například get vypíše zprávu o počtu úloh načtených z databáze a zobrazí se chybová zpráva, pokud se něco nepovede.

router.get('/', function(req, res, next) {
  Task.find()
    .then((tasks) => {      
      const currentTasks = tasks.filter(task => !task.completed);
      const completedTasks = tasks.filter(task => task.completed === true);

      console.log(`Total tasks: ${tasks.length}   Current tasks: ${currentTasks.length}    Completed tasks:  ${completedTasks.length}`)
      res.render('index', { currentTasks: currentTasks, completedTasks: completedTasks });
    })
    .catch((err) => {
      console.log(err);
      res.send('Sorry! Something went wrong.');
    });
});

Krok 1: Na stránce služby App Service:

  1. V nabídce vlevo vyberte protokoly služby App Service.
  2. V části Protokolování aplikace vyberte Systém souborů.
  3. V horní nabídce vyberte Uložit.

Snímek obrazovky znázorňující povolení nativních protokolů ve službě App Service na webu Azure Portal

Krok 2: V nabídce vlevo vyberte Stream protokolu. Zobrazí se protokoly pro vaši aplikaci, včetně protokolů platformy a protokolů z kontejneru.

Snímek obrazovky znázorňující, jak zobrazit stream protokolu na webu Azure Portal

7. Kontrola nasazených souborů pomocí Kudu

služba Aplikace Azure poskytuje webovou konzolu diagnostiky s názvem Kudu, který umožňuje prozkoumat hostitelské prostředí serveru pro vaši webovou aplikaci. Pomocí Kudu můžete zobrazit soubory nasazené do Azure, zkontrolovat historii nasazení aplikace a dokonce otevřít relaci SSH do hostitelského prostředí.

Krok 1: Na stránce služby App Service:

  1. V nabídce vlevo vyberte Rozšířené nástroje.
  2. Vyberte Přejít. Můžete také přejít přímo na https://<app-name>.scm.azurewebsites.net.

Snímek obrazovky znázorňující, jak přejít na stránku Kudu služby App Service

Krok 2: Na stránce Kudu vyberte Nasazení.

Snímek obrazovky hlavní stránky v aplikaci Kudu SCM zobrazující různé informace o hostitelském prostředí

Pokud nasadíte kód do služby App Service pomocí gitu nebo nasazení zip, zobrazí se historie nasazení webové aplikace.

Snímek obrazovky zobrazující historii nasazení aplikace App Service ve formátu JSON

Krok 3: Vraťte se na domovskou stránku Kudu a vyberte Web wwwroot.

Snímek obrazovky s vybraným webem wwwroot

Uvidíte nasazenou strukturu složek a vyberete procházení a zobrazení souborů.

Snímek obrazovky s nasazenými soubory v adresáři wwwroot

8. Vyčištění prostředků

Po dokončení můžete odstranit všechny prostředky z předplatného Azure odstraněním skupiny prostředků.

Krok 1: Na panelu hledání v horní části webu Azure Portal:

  1. Zadejte název skupiny prostředků.
  2. Vyberte tuto skupinu prostředků.

Snímek obrazovky znázorňující, jak hledat a přejít na skupinu prostředků na webu Azure Portal

Krok 2: Na stránce skupiny prostředků vyberte Odstranit skupinu prostředků.

Snímek obrazovky znázorňující umístění tlačítka Odstranit skupinu prostředků na webu Azure Portal

Krok 3:

  1. Potvrďte odstranění zadáním názvu skupiny prostředků.
  2. Vyberte Odstranit.

Snímek obrazovky s potvrzovací dialog pro odstranění skupiny prostředků na webu Azure Portal :

2. Vytvoření prostředků Azure a nasazení ukázkové aplikace

V tomto kroku vytvoříte prostředky Azure a nasadíte ukázkovou aplikaci do App Service v Linuxu. Kroky použité v tomto kurzu vytvoří sadu prostředků zabezpečených ve výchozím nastavení, které zahrnují App Service a Azure Cosmos DB.

Vývojový kontejner už má Azure Developer CLI (AZD).

  1. V kořenovém adresáři úložiště spusťte azd initpříkaz .

    azd init --template nodejs-app-service-cosmos-redis-infra
    
  2. Po zobrazení výzvy zadejte následující odpovědi:

    Otázka Odpověď
    Aktuální adresář není prázdný. Chcete zde inicializovat projekt v adresáři<>? Y
    Co chcete s těmito soubory dělat? Zachovat stávající soubory beze změny
    Zadejte nový název prostředí. Zadejte jedinečný název. Šablona AZD používá tento název jako součást názvu DNS vaší webové aplikace v Azure (<app-name>-<hash>.azurewebsites.net). Jsou povoleny alfanumerické znaky a spojovníky.
  3. Přihlaste se k Azure spuštěním azd auth login příkazu a následujícím příkazem:

    azd auth login
    
  4. Vytvořte potřebné prostředky Azure a pomocí příkazu nasaďte kód azd up aplikace. Podle pokynů vyberte požadované předplatné a umístění prostředků Azure.

    azd up
    

    Dokončení azd up příkazu trvá přibližně 15 minut (mezipaměť Redis trvá nejvíce času). Kód aplikace se také zkompiluje a nasadí, ale později kód upravíte tak, aby fungoval se službou App Service. Když je spuštěný, příkaz poskytuje zprávy o procesu zřizování a nasazení, včetně odkazu na nasazení v Azure. Po dokončení zobrazí příkaz také odkaz na aplikaci pro nasazení.

    Tato šablona AZD obsahuje soubory (azure.yaml a adresář infrastruktury ), které ve výchozím nastavení generují zabezpečenou architekturu s následujícími prostředky Azure:

    • Skupina prostředků: Kontejner pro všechny vytvořené prostředky.
    • Plán služby App Service: Definuje výpočetní prostředky pro Službu App Service. Vytvoří se plán Linuxu na úrovni B1 .
    • App Service: Představuje vaši aplikaci a spouští se v plánu služby App Service.
    • Virtuální síť: Integrovaná s aplikací App Service a izoluje provoz back-endové sítě.
    • Účet služby Azure Cosmos DB s rozhraním MongoDB API: Přístupný pouze ze svého privátního koncového bodu. Na serveru se vytvoří databáze.
    • Azure Cache for Redis: Přístupná pouze z virtuální sítě.
    • Trezor klíčů: Přístupný pouze ze svého privátního koncového bodu. Slouží ke správě tajných kódů pro aplikaci App Service.
    • Privátní koncové body: Přístupové koncové body pro trezor klíčů, databázový server a mezipaměť Redis ve virtuální síti.
    • Privátní DNS zón: Povolte překlad DNS databáze Cosmos DB, mezipaměť Redis a trezor klíčů ve virtuální síti.
    • Pracovní prostor Služby Log Analytics: Slouží jako cílový kontejner vaší aplikace k odeslání protokolů, kde můžete také dotazovat protokoly.

    Jakmile příkaz dokončí vytváření prostředků a nasazení kódu aplikace poprvé, nasazená ukázková aplikace ještě nefunguje, protože musíte provést malé změny, abyste se mohli připojit k databázi v Azure.

3. Ověření připojovací řetězec

Šablona AZD, kterou použijete, vygenerovala proměnné připojení, které jste už použili jako nastavení aplikace, a vypíše je do terminálu, aby vám to vyhovuje. Nastavení aplikace je jedním ze způsobů, jak udržovat tajné kódy připojení mimo úložiště kódu.

  1. Ve výstupu AZD vyhledejte nastavení AZURE_COSMOS_CONNECTIONSTRINGaplikace . Zobrazí se jenom názvy nastavení. Ve výstupu AZD vypadají takto:

     App Service app has the following app settings:
             - AZURE_COSMOS_CONNECTIONSTRING
             - AZURE_REDIS_CONNECTIONSTRING
             - AZURE_KEYVAULT_RESOURCEENDPOINT
             - AZURE_KEYVAULT_SCOPE
     

    AZURE_COSMOS_CONNECTIONSTRINGobsahuje připojovací řetězec do databáze Cosmos DB v Azure. Později ho budete muset použít ve svém kódu.

  2. Šablona AZD vám pro usnadnění práci ukáže přímý odkaz na stránku nastavení aplikace. Najděte odkaz a otevřete ho na nové kartě prohlížeče.

Máte problémy? Projděte si část Řešení potíží.

4. Úprava vzorového kódu a opětovné nasazení

  1. V kódu GitHubu spusťte novou chatovací relaci kliknutím na zobrazení Chat a následným +kliknutím na .

  2. Zeptejte se na @workspace Jak se aplikace připojuje k databázi? Copilot vás může nasměrovat na soubor app.js a mongoose.connect volání.

  3. Řekněme, že v Azure mám proměnnou připojovací řetězec s názvem AZURE_COSMOS_CONNECTIONSTRING. Copilot vám může dát návrh kódu podobný tomu, který je v možnosti 2: bez kroků GitHub Copilot níže a dokonce vám řekněte, abyste udělali změnu v app.js.

  4. Otevřete app.js v průzkumníku a přidejte do metody návrh getApp kódu.

    GitHub Copilot vám pokaždé nedává stejnou odpověď, možná budete muset položit další otázky, abyste mohli doladit odpověď. Tipy najdete v tématu Co můžu dělat s GitHub Copilotem v kódu?.

  5. Zpět v terminálu codespace spusťte azd deploypříkaz .

    azd deploy
    

Tip

Můžete také použít azd up vždy, což dělá všechny azd package, azd provisiona azd deploy.

Máte problémy? Projděte si část Řešení potíží.

5. Přejděte do aplikace.

  1. Ve výstupu AZD najděte adresu URL aplikace a přejděte na ni v prohlížeči. Adresa URL vypadá takto ve výstupu AZD:

     Deploying services (azd deploy)
    
       (✓) Done: Deploying service web
       - Endpoint: https://<app-name>-<hash>.azurewebsites.net/
     
  2. Přidejte do seznamu několik úkolů.

    Snímek obrazovky webové aplikace Express.js se službou Cosmos DB spuštěnou v Azure zobrazující úlohy

    Blahopřejeme, spouštíte webovou aplikaci ve službě Aplikace Azure Service se zabezpečeným připojením ke službě Azure Cosmos DB.

Máte problémy? Projděte si část Řešení potíží.

6. Streamování diagnostických protokolů

Aplikace Azure Služba zaznamenává všechny zprávy protokolované do konzoly, aby vám pomohla při diagnostice problémů s vaší aplikací. Ukázková aplikace vypíše zprávy protokolu konzoly ve všech jejích koncových bodech, aby tuto funkci ukázala. Koncový bod například get vypíše zprávu o počtu úloh načtených z databáze a zobrazí se chybová zpráva, pokud se něco nepovede.

router.get('/', function(req, res, next) {
  Task.find()
    .then((tasks) => {      
      const currentTasks = tasks.filter(task => !task.completed);
      const completedTasks = tasks.filter(task => task.completed === true);

      console.log(`Total tasks: ${tasks.length}   Current tasks: ${currentTasks.length}    Completed tasks:  ${completedTasks.length}`)
      res.render('index', { currentTasks: currentTasks, completedTasks: completedTasks });
    })
    .catch((err) => {
      console.log(err);
      res.send('Sorry! Something went wrong.');
    });
});

Ve výstupu AZD vyhledejte odkaz na streamování protokolů služby App Service a přejděte na něj v prohlížeči. Odkaz vypadá takto ve výstupu AZD:

Stream App Service logs at: https://portal.azure.com/#@/resource/subscriptions/<subscription-guid>/resourceGroups/<group-name>/providers/Microsoft.Web/sites/<app-name>/logStream

Přečtěte si další informace o protokolování v aplikacích v Javě v řadě o povolení OpenTelemetry služby Azure Monitor pro .NET, Node.js, Python a aplikace v Javě.

Máte problémy? Projděte si část Řešení potíží.

7. Vyčištění prostředků

Pokud chcete odstranit všechny prostředky Azure v aktuálním prostředí nasazení, spusťte azd down a postupujte podle pokynů.

azd down

Řešení problému

Zobrazení nasazení portálu pro službu Azure Cosmos DB zobrazuje konfliktní stav.

V závislosti na vybraném předplatném a oblasti se může zobrazit stav nasazení služby Azure Cosmos DB Conflicts následující zprávou v podrobnostech o operaci:

Sorry, we are currently experiencing high demand in <region> region, and cannot fulfill your request at this time.

Příčinou chyby je pravděpodobně omezení předplatného pro oblast, kterou vyberete. Zkuste pro nasazení zvolit jinou oblast.

Na stránce prohlížeče nasazené aplikace se zobrazuje zpráva "Něco se nepovedlo".

Pravděpodobně budete muset provést připojovací řetězec změny v kódu aplikace. Viz 4. Nasazení ukázkového kódu

Nejčastější dotazy

Kolik stojí toto nastavení?

Ceny vytvořených prostředků jsou následující:

  • Plán služby App Service se vytvoří na úrovni Basic a dá se vertikálně navýšit nebo snížit. Podívejte se na ceny služby App Service.
  • Server Azure Cosmos DB se vytvoří v jedné oblasti a dá se distribuovat do jiných oblastí. Podívejte se na ceny služby Azure Cosmos DB.
  • Za virtuální síť se neúčtují poplatky, pokud nenakonfigurujete další funkce, jako je partnerský vztah. Podívejte se na ceny služby Azure Virtual Network.
  • Za privátní zónu DNS se účtují malé poplatky. Podívejte se na ceny Azure DNS.

Návody se připojit k serveru Azure Cosmos DB, který je zabezpečený za virtuální sítí pomocí jiných nástrojů?

  • Základní přístup z nástroje příkazového řádku můžete spustit mongosh z terminálu SSH aplikace. Kontejner aplikace není součástí mongosh, takže ho musíte nainstalovat ručně. Mějte na paměti, že nainstalovaný klient se při restartování aplikace neuchová.
  • Pokud se chcete připojit z klienta grafického uživatelského rozhraní MongoDB, musí být váš počítač v rámci virtuální sítě. Může to být například virtuální počítač Azure, který je připojený k jedné z podsítí, nebo počítač v místní síti, který má připojení VPN typu site-to-site s virtuální sítí Azure.
  • Pokud se chcete připojit z prostředí MongoDB ze stránky pro správu Azure Cosmos DB na portálu, musí být váš počítač také ve virtuální síti. Místo toho můžete otevřít bránu firewall serveru Azure Cosmos DB pro IP adresu místního počítače, ale zvyšuje prostor pro útok pro vaši konfiguraci.

Jak místní vývoj aplikací funguje s GitHub Actions?

Jako příklad vezměte automaticky vygenerovaný soubor pracovního postupu ze služby App Service a každý git push spustí nové sestavení a nasazení. Z místního klonu úložiště GitHub provedete požadované aktualizace nasdílení změn do GitHubu. Příklad:

git add .
git commit -m "<some-message>"
git push origin main

Proč je nasazení GitHub Actions tak pomalé?

Automaticky vygenerovaný soubor pracovního postupu ze služby App Service definuje spuštění sestavení a následného nasazení se dvěma úlohami. Vzhledem k tomu, že každá úloha běží ve vlastním čistém prostředí, soubor pracovního postupu zajistí, že deploy má úloha přístup k souborům build z úlohy:

Většinu času potřebných procesem dvou úloh stráví nahráváním a stahováním artefaktů. Pokud chcete, můžete soubor pracovního postupu zjednodušit tím, že zkombinujete dvě úlohy do jedné, což eliminuje potřebu kroků pro nahrávání a stahování.

Nemám oprávnění k vytvoření identity přiřazené uživatelem

Viz Nastavení nasazení GitHub Actions z Centra nasazení.

Co můžu dělat s GitHub Copilotem v kódu?

Můžete si všimnout, že zobrazení chatu GitHub Copilot už pro vás bylo při vytváření prostoru kódu. Pro usnadnění práce zahrneme rozšíření chatu GitHub Copilot do definice kontejneru (viz .devcontainer/devcontainer.json). Potřebujete ale účet GitHub Copilot (k dispozici je 30denní bezplatná zkušební verze).

Několik tipů pro vás při komunikaci s GitHub Copilotem:

  • V rámci jedné chatové relace se otázky a odpovědi vzájemně staví a otázky můžete upravit tak, aby vyladily odpověď, kterou získáte.
  • GitHub Copilot ve výchozím nastavení nemá přístup k žádnému souboru ve vašem úložišti. Pokud chcete položit otázky k souboru, otevřete ho nejprve v editoru.
  • Pokud chcete, aby GitHub Copilot měl při přípravě odpovědí přístup ke všem souborům v úložišti, začněte svou otázkou @workspace. Další informace najdete na webu Use the @workspace agent.
  • V chatové relaci může GitHub Copilot navrhovat změny a (s @workspace) dokonce i tam, kde se mají změny provádět, ale změny za vás nesmí provádět. Je na vás přidat navrhované změny a otestovat je.

Tady je několik dalších věcí, které můžete říct k vyladění odpovědi, kterou získáte:

  • @workspace Kde je definován MONGODB_URI?
  • Ve kterém souboru provedem změnu?
  • Přeruší tato změna aplikaci při místním spuštění?

Další kroky