Delen via


Zelfstudie: Een Node.js + MongoDB-web-app implementeren in Azure

Azure App Service biedt een uiterst schaalbare webhostingservice met self-patchfunctie via het Linux-besturingssysteem. Deze zelfstudie laat zien hoe u een beveiligde Node.js-app maakt in Azure-app Service die is verbonden met een Azure Cosmos DB voor MongoDB-database. Wanneer u klaar bent, hebt u een Express.js-app die wordt uitgevoerd op Azure-app Service op Linux.

Schermopname van Node.js toepassing waarin gegevens worden opgeslagen in Cosmos DB.

In deze zelfstudie leert u het volgende:

  • Maak een standaardarchitectuur voor Azure-app Service en Azure Cosmos DB met MongoDB-API.
  • Beveilig verbindingsgeheimen met behulp van een beheerde identiteit en Key Vault-verwijzingen.
  • Implementeer een Node.js voorbeeld-app in App Service vanuit een GitHub-opslagplaats.
  • App Service-app-instellingen openen in de toepassingscode.
  • Breng updates aan en implementeer de toepassingscode opnieuw.
  • Stream diagnostische logboeken vanuit App Service.
  • De app beheren in Azure Portal.
  • Richt dezelfde architectuur in en implementeer met behulp van Azure Developer CLI.
  • Optimaliseer uw ontwikkelwerkstroom met GitHub Codespaces en GitHub Copilot.

Vereisten

  • Een Azure-account met een actief abonnement. Als u geen Azure-account hebt, kunt u er gratis een maken.
  • Een GitHub-account. je kunt er ook gratis een krijgen.
  • Kennis van Express.js ontwikkeling.
  • (Optioneel) Als u GitHub Copilot wilt proberen, moet u een GitHub Copilot-account gebruiken. Er is een gratis proefversie van 30 dagen beschikbaar.
  • Een Azure-account met een actief abonnement. Als u geen Azure-account hebt, kunt u er gratis een maken.
  • Azure Developer CLI geïnstalleerd. U kunt de stappen volgen met De Azure Cloud Shell , omdat Azure Developer CLI al is geïnstalleerd.
  • Kennis van Express.js ontwikkeling.
  • (Optioneel) Als u GitHub Copilot wilt proberen, moet u een GitHub Copilot-account gebruiken. Er is een gratis proefversie van 30 dagen beschikbaar.

Naar het einde gaan

U kunt de voorbeeld-app snel implementeren in deze zelfstudie en zien hoe deze wordt uitgevoerd in Azure. Voer de volgende opdrachten uit in Azure Cloud Shell en volg de prompt:

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. Voer het voorbeeld uit

Eerst stelt u een voorbeeld van een gegevensgestuurde app in als uitgangspunt. Voor uw gemak bevat de voorbeeldopslagplaats een dev-containerconfiguratie . De dev-container heeft alles wat u nodig hebt om een toepassing te ontwikkelen, met inbegrip van de database, cache en alle omgevingsvariabelen die nodig zijn voor de voorbeeldtoepassing. De dev-container kan worden uitgevoerd in een GitHub-coderuimte, wat betekent dat u het voorbeeld kunt uitvoeren op elke computer met een webbrowser.

Stap 1: In een nieuw browservenster:

  1. Meld u aan bij uw GitHub-account.
  2. Navigeer naar https://github.com/Azure-Samples/msdocs-nodejs-mongodb-azure-sample-app/fork.
  3. Hef de selectie alleen het kopiëren van de hoofdbranch op. U wilt alle vertakkingen.
  4. Selecteer Een fork maken.

Een schermopname van het maken van een fork van de GitHub-voorbeeldopslagplaats.

Stap 2: In de GitHub-fork:

  1. Selecteer de hoofdstarter-no-infra> voor de startersvertakking. Deze vertakking bevat alleen het voorbeeldproject en geen Azure-gerelateerde bestanden of configuratie.
  2. Selecteer Code>create codespace on starter-no-infra. Het duurt enkele minuten voordat de codespace is ingesteld.

Een schermopname die laat zien hoe u een coderuimte maakt in GitHub.

Stap 3: In de codespace-terminal:

  1. Voer npm install && npm start uit.
  2. Wanneer u de melding Your application running on port 3000 is available.ziet, selecteert u Openen in browser. U ziet de voorbeeldtoepassing in een nieuw browsertabblad. Als u de Express.js toepassing wilt stoppen, typt Ctrl+Cu .

Een schermopname van het uitvoeren van de voorbeeldtoepassing in de GitHub-codespace.

Tip

U kunt GitHub Copilot vragen over deze opslagplaats. Voorbeeld:

  • @workspace Wat doet dit project?
  • @workspace Wat doet de map .devcontainer?

Ondervindt u problemen? Controleer de sectie Probleemoplossing.

2. App Service en Azure Cosmos DB maken

In deze stap maakt u de Azure-resources. Met de stappen die in deze zelfstudie worden gebruikt, maakt u een set beveiligde standaardbronnen met App Service en Azure Cosmos DB voor MongoDB. Voor het aanmaakproces geeft u het volgende op:

  • De naam voor de web-app. Deze wordt gebruikt als onderdeel van de DNS-naam voor uw app in de vorm van https://<app-name>-<hash>.<region>.azurewebsites.net.
  • De regio om de app fysiek in de wereld uit te voeren. Deze wordt ook gebruikt als onderdeel van de DNS-naam voor uw app.
  • De runtimestack voor de app. Hier selecteert u de versie van Node die u voor uw app wilt gebruiken.
  • Het hostingabonnement voor de app. Dit is de prijscategorie die de set functies en schaalcapaciteit voor uw app bevat.
  • De resourcegroep voor de app. Met een resourcegroep kunt u alle Azure-resources die nodig zijn voor de toepassing groeperen (in een logische container).

Meld u aan bij Azure Portal en volg deze stappen om uw Azure-app Service-resources te maken.

Stap 1: In Azure Portal:

  1. Voer 'web-app-database' in de zoekbalk boven aan Azure Portal in.
  2. Selecteer het item met het label Web App + Database onder de kop Marketplace . U kunt ook rechtstreeks naar de wizard voor het maken navigeren.

Een schermopname die laat zien hoe u het zoekvak in de bovenste werkbalk gebruikt om de wizard Web-app en database maken te vinden.

Stap 2: Vul op de pagina Web-app en database maken het formulier als volgt in.

  1. Resourcegroep: Selecteer Nieuwe maken en gebruik een naam van msdocs-expressjs-mongodb-tutorial.
  2. Regio: Elke Azure-regio bij u in de buurt.
  3. Naam: msdocs-expressjs-mongodb-XYZ, waarbij XYZ uit drie willekeurige tekens bestaat.
  4. Runtimestack: Node 20 LTS.
  5. Engine: Cosmos DB-API voor MongoDB. Azure Cosmos DB is een cloudeigen database met een 100% compatibele MongoDB-API. Noteer de databasenaam die voor u wordt gegenereerd (<app-naam-database>). U hebt deze later nodig.
  6. Hostingabonnement: Basic. Wanneer u klaar bent, kunt u omhoog schalen naar een prijscategorie voor productie.
  7. Selecteer Controleren + maken.
  8. Nadat de validatie is voltooid, selecteert u Maken.

Een schermopname die laat zien hoe u een nieuwe app en database configureert in de wizard Web App + Database.

Stap 3: Het duurt enkele minuten voordat de implementatie is voltooid. Zodra de implementatie is voltooid, selecteert u de knop Ga naar resource . U wordt rechtstreeks naar de App Service-app gebracht, maar de volgende resources worden gemaakt:

  • Resourcegroep → De container voor alle gemaakte resources.
  • App Service-plan → Definieert de rekenresources voor App Service. Er wordt een Linux-plan in de Basic-laag gemaakt.
  • App Service → Vertegenwoordigt uw app en wordt uitgevoerd in het App Service-plan.
  • Virtueel netwerk → geïntegreerd met de App Service-app en isoleert back-endnetwerkverkeer.
  • Privé-eindpunt → Access-eindpunt voor de databaseresource in het virtuele netwerk.
  • Netwerkinterface → Vertegenwoordigt een privé-IP-adres voor het privé-eindpunt.
  • Azure Cosmos DB voor MongoDB → alleen toegankelijk vanaf het privé-eindpunt. Er worden een database en een gebruiker voor u gemaakt op de server.
  • Privé-DNS zone → Maakt DNS-omzetting van de Azure Cosmos DB-server in het virtuele netwerk mogelijk.

Een schermopname van het implementatieproces voltooid.

Ondervindt u problemen? Controleer de sectie Probleemoplossing.

3. Beveiligde verbindingsgeheimen

De wizard Voor het maken is de verbindingsreeks voor u gegenereerd als app-instelling. De aanbevolen beveiligingsprocedures zijn echter om geheimen volledig buiten App Service te houden. U verplaatst uw geheimen naar een sleutelkluis en wijzigt uw app-instelling in een Key Vault-verwijzing met behulp van serviceconnectors.

Stap 1: Op de App Service-pagina:

  1. Selecteer in het linkermenu Instellingen > omgevingsvariabelen.
  2. Selecteer naast AZURE_COSMOS_CONNECTIONSTRING de optie Waarde weergeven. Met deze verbindingsreeks kunt u verbinding maken met de Cosmos DB-database die is beveiligd achter een privé-eindpunt. Het geheim wordt echter rechtstreeks opgeslagen in de App Service-app, wat niet het beste is. U wijzigt dit.

Een schermopname die laat zien hoe u de waarde van een app-instelling kunt zien.

Stap 2: Een sleutelkluis maken voor veilig beheer van geheimen.

  1. Typ 'sleutelkluis' in de bovenste zoekbalk en selecteer vervolgens Marketplace>Key Vault.
  2. Selecteer in resourcegroep msdocs-expressjs-mongodb-tutorial.
  3. Typ in de naam van de sleutelkluis een naam die alleen uit letters en cijfers bestaat.
  4. Stel deze in Regio in op de voorbeeldlocatie als de resourcegroep.

Een schermopname die laat zien hoe u een sleutelkluis maakt.

Stap 3:

  1. Selecteer het tabblad Netwerken.
  2. Schakel de selectie Openbare toegang inschakelen uit.
  3. Selecteer Een privé-eindpunt maken.
  4. Selecteer in resourcegroep msdocs-expressjs-mongodb-tutorial.
  5. Typ in de naam van de sleutelkluis een naam die alleen uit letters en cijfers bestaat.
  6. Stel deze in Regio in op de voorbeeldlocatie als de resourcegroep.
  7. Selecteer in het dialoogvenster in Location dezelfde locatie als uw App Service-app.
  8. Selecteer in resourcegroep msdocs-expressjs-mongodb-tutorial.
  9. Typ in Naam msdocs-expressjs-mongodb-XYZVaultEndpoint.
  10. Selecteer in het virtuele netwerk msdocs-expressjs-mongodb-XYZVnet.
  11. In Subnet, msdocs-expressjs-mongodb-XYZSubnet.
  12. Selecteer OK.
  13. Selecteer Controleren en maken en selecteer vervolgens Maken. Wacht tot de implementatie van de sleutelkluis is voltooid. U ziet nu 'Uw implementatie is voltooid'.

Een schermopname van het beveiligen van een sleutelkluis met een privé-eindpunt.

Stap 4:

  1. Typ in de bovenste zoekbalk msdocs-expressjs-mongodb en vervolgens de App Service-resource msdocs-expressjs-mongodb-XYZ.
  2. Selecteer instellingenserviceconnector >in het linkermenu op de pagina App Service. Er is al een connector, die door de wizard voor het maken van apps voor u is gemaakt.
  3. Schakel het selectievakje naast de connector in en selecteer Vervolgens Bewerken.
  4. Stel op het tabblad Basisinstellingen het type Client in op Node.js.
  5. Selecteer het tabblad Verificatie.
  6. Selecteer Geheim opslaan in Key Vault.
  7. Selecteer Nieuwe maken onder Key Vault-verbinding. Er wordt een dialoogvenster Verbinding maken geopend boven aan het bewerkingsdialoogvenster.

Een schermopname van het bewerken van een serviceconnector met een sleutelkluisverbinding.

Stap 5: In het dialoogvenster Verbinding maken voor de Key Vault-verbinding:

  1. Selecteer in Key Vault de sleutelkluis die u eerder hebt gemaakt.
  2. Selecteer Controleren + maken. U ziet dat door het systeem toegewezen beheerde identiteit is ingesteld op Geselecteerd.
  3. Wanneer de validatie is voltooid, selecteert u Maken.

Een schermopname die laat zien hoe u een key vault-serviceconnector configureert.

Stap 6: U bent terug in het bewerkingsdialoogvenster voor defaultConnector.

  1. Wacht op het tabblad Verificatie totdat de sleutelkluisconnector is gemaakt. Wanneer de sleutelkluis is voltooid, wordt deze automatisch geselecteerd in de vervolgkeuzelijst Key Vault-verbinding .
  2. Selecteer Volgende: Netwerken.
  3. Selecteer Firewallregels configureren om toegang tot de doelservice in te schakelen. Als u het bericht 'Geen privé-eindpunt op de doelservice' ziet, negeert u het. De wizard voor het maken van apps heeft de Cosmos DB-database al beveiligd met een privé-eindpunt.
  4. Selecteer Opslaan. Wacht totdat de melding Update is voltooid wordt weergegeven.

Een schermopname van de sleutelkluisverbinding die is geselecteerd in de defaultConnector.

Stap 7: Uw wijzigingen controleren:

  1. Selecteer opnieuw omgevingsvariabelen in het linkermenu.
  2. Selecteer naast de app-instelling AZURE_COSMOS_CONNECTIONSTRING de optie Waarde weergeven. De waarde moet zijn @Microsoft.KeyVault(...), wat betekent dat het een sleutelkluisverwijzing is omdat het geheim nu wordt beheerd in de sleutelkluis.

Een schermopname die laat zien hoe u de waarde van de App Service-omgevingsvariabele in Azure kunt zien.

Ondervindt u problemen? Controleer de sectie Probleemoplossing.

4. Voorbeeldcode implementeren

In deze stap configureert u gitHub-implementatie met behulp van GitHub Actions. Het is slechts een van de vele manieren om te implementeren in App Service, maar ook een uitstekende manier om continue integratie in uw implementatieproces te hebben. Standaard wordt met elke git push gitHub-opslagplaats de build- en implementatieactie gestart.

Stap 1: Selecteer implementatiecentrum in>het linkermenu.

Een schermopname die laat zien hoe u het implementatiecentrum opent in App Service.

Stap 2: Op de pagina Implementatiecentrum:

  1. Selecteer GitHub in Bron. GitHub Actions is standaard geselecteerd als buildprovider.
  2. Meld u aan bij uw GitHub-account en volg de prompt om Azure te autoriseren.
  3. Selecteer uw account in Organisatie.
  4. Selecteer in opslagplaats msdocs-nodejs-mongodb-azure-sample-app.
  5. Selecteer in Branch starter-no-infra. Dit is dezelfde vertakking waarin u met uw voorbeeld-app hebt gewerkt, zonder azure-gerelateerde bestanden of configuraties.
  6. Selecteer voor verificatietype de door de gebruiker toegewezen identiteit.
  7. Selecteer Opslaan in het bovenste menu. App Service voert een werkstroombestand door in de gekozen GitHub-opslagplaats in de .github/workflows map. Standaard maakt het implementatiecentrum een door de gebruiker toegewezen identiteit voor de werkstroom voor verificatie met behulp van Microsoft Entra (OIDC-verificatie). Zie Implementeren in App Service met behulp van GitHub Actions voor alternatieve verificatieopties.

Een schermopname van het configureren van CI/CD met behulp van GitHub Actions.

Stap 3: Terug in de GitHub-coderuimte van uw voorbeeldfork, voert u uit git pull origin starter-no-infra. Hiermee haalt u het zojuist vastgelegde werkstroombestand op in uw codespace.

Een schermopname van Git Pull in een GitHub-coderuimte.

Stap 4 (optie 1: met GitHub Copilot):

  1. Start een nieuwe chatsessie door de chatweergave te selecteren en vervolgens te selecteren +.
  2. Vraag het volgende: '@workspace Hoe maakt de app verbinding met de database?' Copilot kan u verwijzen naar het app.js-bestand en de mongoose.connect oproep.
  3. Stel: "*Ik heb een verbindingsreeks variabele in Azure met de naam AZURE_COSMOS_CONNECTIONSTRING.". Copilot kan u mogelijk een codesuggesties geven die vergelijkbaar is met de code in optie 2: zonder onderstaande GitHub Copilot-stappen en zelfs dat u de wijziging in app.js moet aanbrengen.
  4. Open app.js in de verkenner en voeg de codesuggesties toe aan de getApp methode. GitHub Copilot geeft u niet elke keer hetzelfde antwoord. Mogelijk moet u meer vragen stellen om het antwoord af te stemmen. Zie Wat kan ik doen met GitHub Copilot in mijn codespace voor tips.

Een schermopname die laat zien hoe u een vraag kunt stellen in een nieuwe GitHub Copilot-chatsessie.

Stap 4 (optie 2: zonder GitHub Copilot):

  1. Open app.js vanuit de verkenner.
  2. Zoek de regel waar mongoose.connect wordt aangeroepen (regel 16) en ga naar process.env.AZURE_COSMOS_CONNECTIONSTRING || process.env.MONGODB_URIprocess.env.MONGODB_URI .

Een schermopname van een GitHub-coderuimte en app.js geopend.

Stap 5:

  1. Selecteer de extensie Broncodebeheer .
  2. Typ in het tekstvak een doorvoeringsbericht zoals Update environment variable. Of selecteer en laat GitHub Copilot een doorvoerbericht voor u genereren.
  3. Selecteer Doorvoeren en bevestig met Ja.
  4. Selecteer Wijzigingen synchroniseren 1 en bevestig met OK.

Een schermopname van de wijzigingen die worden doorgevoerd en gepusht naar GitHub.

Stap 6: Terug op de pagina Implementatiecentrum in Azure Portal:

  1. Selecteer Vernieuwen op het tabblad Logboeken. Er is al een nieuwe implementatieuitvoering gestart op basis van uw doorgevoerde wijzigingen.
  2. Selecteer in het logboekitem voor de implementatieuitvoering de vermelding Build/Deploy Logs met de meest recente tijdstempel.

Een schermopname van een geslaagde implementatie op de pagina Logboeken van het implementatiecentrum.

Stap 7: U gaat naar uw GitHub-opslagplaats en ziet dat de GitHub-actie wordt uitgevoerd. Het werkstroombestand definieert twee afzonderlijke fasen, bouwen en implementeren. Wacht totdat de GitHub-uitvoering de status Voltooid weergeeft.

Een schermopname van een geslaagde GitHub-uitvoering.

Ondervindt u problemen? Controleer de sectie Probleemoplossing.

5. Blader naar de app

Stap 1: Op de App Service-pagina:

  1. Selecteer Overzicht in het linkermenu.
  2. Selecteer de URL van uw app. U kunt ook rechtstreeks naar https://<app-name>.azurewebsites.net.

Een schermopname die laat zien hoe u een App Service start vanuit Azure Portal.

Stap 2: Voeg een paar taken toe aan de lijst. Gefeliciteerd, u voert een beveiligde gegevensgestuurde Node.js-app uit in Azure-app Service.

Een schermopname van de Express.js-app die wordt uitgevoerd in App Service.

6. Diagnostische logboeken streamen

Azure-app Service legt alle berichten vast die zijn vastgelegd in de console om u te helpen bij het diagnosticeren van problemen met uw toepassing. De voorbeeld-app voert consolelogboekberichten uit in elk van de eindpunten om deze mogelijkheid te demonstreren. Het get eindpunt voert bijvoorbeeld een bericht uit over het aantal taken dat is opgehaald uit de database en er wordt een foutbericht weergegeven als er iets misgaat.

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.');
    });
});

Stap 1: Op de App Service-pagina:

  1. Selecteer App Service-logboeken in het linkermenu.
  2. Selecteer Bestandssysteem onder Toepassingslogboek.
  3. Selecteer Opslaan in het bovenste menu.

Een schermopname van het inschakelen van systeemeigen logboeken in App Service in Azure Portal.

Stap 2: Selecteer in het menu links de optie Logboekstream. U ziet de logboeken voor uw app, inclusief platformlogboeken en logboeken vanuit de container.

Een schermopname die laat zien hoe u de logboekstream kunt weergeven in Azure Portal.

7. Geïmplementeerde bestanden inspecteren met Kudu

Azure-app Service biedt een webgebaseerde diagnostische console met de naam Kudu waarmee u de serverhostingomgeving voor uw web-app kunt onderzoeken. Met Kudu kunt u de bestanden bekijken die zijn geïmplementeerd in Azure, de implementatiegeschiedenis van de toepassing bekijken en zelfs een SSH-sessie openen in de hostingomgeving.

Stap 1: Op de App Service-pagina:

  1. Selecteer Geavanceerde hulpmiddelen in het linkermenu.
  2. Selecteer Zoeken. U kunt ook rechtstreeks naar https://<app-name>.scm.azurewebsites.net.

Een schermopname die laat zien hoe u naar de App Service Kudu-pagina navigeert.

Stap 2: Selecteer Implementaties op de Kudu-pagina.

Een schermopname van de hoofdpagina in de Kudu SCM-app met de verschillende informatie die beschikbaar is over de hostingomgeving.

Als u code implementeert in App Service met behulp van Git of zip deploy, ziet u een geschiedenis van implementaties van uw web-app.

Een schermopname van de implementatiegeschiedenis van een App Service-app in JSON-indeling.

Stap 3: Ga terug naar de startpagina van Kudu en selecteer Site wwwroot.

Een schermopname van de geselecteerde site wwwroot.

U kunt de geïmplementeerde mapstructuur bekijken en selecteren om door de bestanden te bladeren en weer te geven.

Een schermopname van geïmplementeerde bestanden in de wwwroot-map.

8. Resources opschonen

Wanneer u klaar bent, kunt u alle resources uit uw Azure-abonnement verwijderen door de resourcegroep te verwijderen.

Stap 1: In de zoekbalk boven aan Azure Portal:

  1. Voer de naam van de resourcegroup in.
  2. Selecteer de resourcegroep.

Een schermopname van het zoeken naar en navigeren naar een resourcegroep in Azure Portal.

Stap 2: Selecteer op de pagina Resourcegroep verwijderen.

Een schermopname van de locatie van de knop Resourcegroep verwijderen in Azure Portal.

Stap 3:

  1. Voer de naam van de resourcegroep in om uw verwijdering te bevestigen.
  2. Selecteer Verwijderen.

Een schermopname van het bevestigingsvenster voor het verwijderen van een resourcegroep in Azure Portal. :

2. Azure-resources maken en een voorbeeld-app implementeren

In deze stap maakt u de Azure-resources en implementeert u een voorbeeld-app in App Service op Linux. Met de stappen die in deze zelfstudie worden gebruikt, maakt u een set beveiligde standaardbronnen met App Service en Azure Cosmos DB.

De dev-container heeft al de Azure Developer CLI (AZD).

  1. Voer vanuit de hoofdmap van de opslagplaats de opdracht uit azd init.

    azd init --template nodejs-app-service-cosmos-redis-infra
    
  2. Geef de volgende antwoorden wanneer u hierom wordt gevraagd:

    Vraag Antwoord
    De huidige map is niet leeg. Wilt u hier een project initialiseren in '<your-directory>'? Y
    Wat wilt u doen met deze bestanden? Mijn bestaande bestanden ongewijzigd houden
    Voer een nieuwe omgevingsnaam in Typ een unieke naam. De AZD-sjabloon gebruikt deze naam als onderdeel van de DNS-naam van uw web-app in Azure (<app-name>-<hash>.azurewebsites.net). Alfanumerieke tekens en afbreekstreepjes zijn toegestaan.
  3. Meld u aan bij Azure door de azd auth login opdracht uit te voeren en de prompt te volgen:

    azd auth login
    
  4. Maak de benodigde Azure-resources en implementeer de app-code met de azd up opdracht. Volg de prompt om het gewenste abonnement en de gewenste locatie voor de Azure-resources te selecteren.

    azd up
    

    Het duurt ongeveer 15 minuten voordat de azd up opdracht is voltooid (de Redis-cache duurt het de meeste tijd). Uw toepassingscode wordt ook gecompileerd en geïmplementeerd, maar u wijzigt de code later om met App Service te werken. Terwijl deze wordt uitgevoerd, bevat de opdracht berichten over het inrichtings- en implementatieproces, inclusief een koppeling naar de implementatie in Azure. Wanneer deze is voltooid, wordt met de opdracht ook een koppeling naar de implementatietoepassing weergegeven.

    Deze AZD-sjabloon bevat bestanden (azure.yaml en de inframap ) die een standaardarchitectuur met de volgende Azure-resources genereren:

    • Resourcegroep: de container voor alle gemaakte resources.
    • App Service-plan: definieert de rekenresources voor App Service. Er wordt een Linux-plan in de B1-laag gemaakt.
    • App Service: Vertegenwoordigt uw app en wordt uitgevoerd in het App Service-plan.
    • Virtueel netwerk: geïntegreerd met de App Service-app en isoleert back-endnetwerkverkeer.
    • Azure Cosmos DB-account met MongoDB-API: alleen toegankelijk vanaf achter het privé-eindpunt. Er wordt een database voor u gemaakt op de server.
    • Azure Cache voor Redis: alleen toegankelijk vanuit het virtuele netwerk.
    • Sleutelkluis: alleen toegankelijk vanaf achter het privé-eindpunt. Wordt gebruikt voor het beheren van geheimen voor de App Service-app.
    • Privé-eindpunten: Toegang tot eindpunten voor de sleutelkluis, de databaseserver en de Redis-cache in het virtuele netwerk.
    • Privé-DNS zones: DNS-omzetting van de Cosmos DB-database, de Redis-cache en de sleutelkluis in het virtuele netwerk inschakelen.
    • Log Analytics-werkruimte: fungeert als de doelcontainer voor uw app voor het verzenden van de logboeken, waar u ook query's kunt uitvoeren op de logboeken.

    Zodra de opdracht klaar is met het maken van resources en het implementeren van de toepassingscode de eerste keer, werkt de geïmplementeerde voorbeeld-app nog niet omdat u kleine wijzigingen moet aanbrengen om deze verbinding te maken met de database in Azure.

3. Controleer verbindingsreeks s

De AZD-sjabloon die u gebruikt, heeft de connectiviteitsvariabelen voor u al gegenereerd als app-instellingen en voert deze voor uw gemak uit naar de terminal. App-instellingen zijn een manier om verbindingsgeheimen uit uw codeopslagplaats te houden.

  1. Zoek in de AZD-uitvoer de app-instelling AZURE_COSMOS_CONNECTIONSTRING. Alleen de naam van de instelling wordt weergegeven. Ze zien er als volgt uit in de AZD-uitvoer:

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

    AZURE_COSMOS_CONNECTIONSTRINGbevat de verbindingsreeks naar de Cosmos DB-database in Azure. U moet deze later in uw code gebruiken.

  2. Voor uw gemak toont de AZD-sjabloon u de directe koppeling naar de app-instellingenpagina van de app. Zoek de koppeling en open deze in een nieuw browsertabblad.

Ondervindt u problemen? Controleer de sectie Probleemoplossing.

4. Voorbeeldcode wijzigen en opnieuw implementeren

  1. Start in de GitHub-coderuimte een nieuwe chatsessie door te klikken op de chatweergave en vervolgens op +.

  2. Vraag het volgende: '@workspace Hoe maakt de app verbinding met de database?' Copilot kan u verwijzen naar het app.js-bestand en de mongoose.connect oproep.

  3. Zeg: 'Ik heb een verbindingsreeks variabele in Azure met de naam AZURE_COSMOS_CONNECTIONSTRING.'. Copilot kan u mogelijk een codesuggesties geven die vergelijkbaar is met de code in optie 2: zonder onderstaande GitHub Copilot-stappen en zelfs dat u de wijziging in app.js moet aanbrengen.

  4. Open app.js in de verkenner en voeg de codesuggesties toe aan de getApp methode.

    GitHub Copilot geeft u niet elke keer hetzelfde antwoord. Mogelijk moet u meer vragen stellen om het antwoord af te stemmen. Zie Wat kan ik doen met GitHub Copilot in mijn codespace voor tips.

  5. Voer in de codespace-terminal de opdracht uit azd deploy.

    azd deploy
    

Tip

U kunt ook altijd gebruiken azd up , wat alle azd package, azd provisionen azd deploy.

Ondervindt u problemen? Controleer de sectie Probleemoplossing.

5. Blader naar de app

  1. Zoek in de AZD-uitvoer de URL van uw app en navigeer ernaar in de browser. De URL ziet er als volgt uit in de AZD-uitvoer:

     Deploying services (azd deploy)
    
       (✓) Done: Deploying service web
       - Endpoint: https://<app-name>-<hash>.azurewebsites.net/
     
  2. Voeg een paar taken toe aan de lijst.

    Een schermopname van de Express.js-web-app met Cosmos DB die wordt uitgevoerd in Azure met taken.

    Gefeliciteerd, u voert een web-app uit in Azure-app Service, met beveiligde connectiviteit met Azure Cosmos DB.

Ondervindt u problemen? Controleer de sectie Probleemoplossing.

6. Diagnostische logboeken streamen

Azure-app Service legt alle berichten vast die zijn vastgelegd in de console om u te helpen bij het diagnosticeren van problemen met uw toepassing. De voorbeeld-app voert consolelogboekberichten uit in elk van de eindpunten om deze mogelijkheid te demonstreren. Het get eindpunt voert bijvoorbeeld een bericht uit over het aantal taken dat is opgehaald uit de database en er wordt een foutbericht weergegeven als er iets misgaat.

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.');
    });
});

Zoek in de AZD-uitvoer de koppeling om App Service-logboeken te streamen en navigeer ernaar in de browser. De koppeling ziet er als volgt uit in de AZD-uitvoer:

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

Meer informatie over logboekregistratie in Java-apps in de reeks over Azure Monitor OpenTelemetry inschakelen voor .NET, Node.js, Python- en Java-toepassingen.

Ondervindt u problemen? Controleer de sectie Probleemoplossing.

7. Resources opschonen

Als u alle Azure-resources in de huidige implementatieomgeving wilt verwijderen, voert u de aanwijzingen uit azd down en volgt u de aanwijzingen.

azd down

Probleemoplossing

In de portalimplementatieweergave voor Azure Cosmos DB wordt een conflictstatus weergegeven

Afhankelijk van uw abonnement en de regio die u selecteert, ziet u mogelijk de implementatiestatus voor Azure Cosmos DB Conflict, met het volgende bericht in bewerkingsgegevens:

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

De fout wordt waarschijnlijk veroorzaakt door een limiet voor uw abonnement voor de regio die u selecteert. Kies een andere regio voor uw implementatie.

Op de browserpagina van de geïmplementeerde app staat 'Er is iets misgegaan'.

U moet waarschijnlijk nog steeds de verbindingsreeks wijzigingen aanbrengen in uw toepassingscode. Zie 4. Voorbeeldcode implementeren.

Veelgestelde vragen

Hoeveel kost dit instellen?

De prijzen voor de gemaakte resources zijn als volgt:

  • Het App Service-plan wordt gemaakt in de Basic-laag en kan omhoog of omlaag worden geschaald. Zie Prijzen voor App Service.
  • De Azure Cosmos DB-server wordt in één regio gemaakt en kan worden gedistribueerd naar andere regio's. Zie prijzen voor Azure Cosmos DB.
  • Voor het virtuele netwerk worden geen kosten in rekening gebracht, tenzij u extra functionaliteit configureert, zoals peering. Zie prijzen voor Azure Virtual Network.
  • Voor de privé-DNS-zone worden kleine kosten in rekening gebracht. Zie prijzen voor Azure DNS.

Hoe kan ik verbinding maken met de Azure Cosmos DB-server die is beveiligd achter het virtuele netwerk met andere hulpprogramma's?

  • Voor basistoegang vanuit een opdrachtregelprogramma kunt u uitvoeren mongosh vanuit de SSH-terminal van de app. De container van de app wordt niet geleverd mongosh, dus u moet deze handmatig installeren. Houd er rekening mee dat de geïnstalleerde client niet blijft bestaan tijdens het opnieuw opstarten van de app.
  • Als u verbinding wilt maken vanuit een MongoDB-GUI-client, moet uw machine zich in het virtuele netwerk bevinden. Het kan bijvoorbeeld een Virtuele Azure-machine zijn die is verbonden met een van de subnetten of een machine in een on-premises netwerk met een site-naar-site-VPN-verbinding met het virtuele Azure-netwerk.
  • Als u verbinding wilt maken vanuit de MongoDB-shell vanaf de Azure Cosmos DB-beheerpagina in de portal, moet uw machine zich ook in het virtuele netwerk bevinden. U kunt in plaats daarvan de firewall van de Azure Cosmos DB-server voor het IP-adres van uw lokale computer openen, maar het vergroot de kwetsbaarheid voor aanvallen voor uw configuratie.

Hoe werkt het ontwikkelen van lokale apps met GitHub Actions?

Neem het automatisch gegenereerde werkstroombestand uit App Service als voorbeeld, elk git push start een nieuwe build- en implementatieuitvoering. Vanuit een lokale kloon van de GitHub-opslagplaats pusht u de gewenste updates naar GitHub. Voorbeeld:

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

Waarom is de Implementatie van GitHub Actions zo traag?

Het automatisch gegenereerde werkstroombestand van App Service definieert build-then-deploy, two-job run. Omdat elke taak wordt uitgevoerd in een eigen schone omgeving, zorgt het werkstroombestand ervoor dat de deploy taak toegang heeft tot de bestanden vanuit de build taak:

De meeste tijd die nodig is voor het proces met twee taken, wordt besteed aan het uploaden en downloaden van artefacten. Als u wilt, kunt u het werkstroombestand vereenvoudigen door de twee taken te combineren in één, waardoor de upload- en downloadstappen niet meer nodig zijn.

Ik heb geen machtigingen om een door de gebruiker toegewezen identiteit te maken

Zie Implementatie van GitHub Actions instellen vanuit het Implementatiecentrum.

Wat kan ik doen met GitHub Copilot in mijn codespace?

U ziet mogelijk dat de GitHub Copilot-chatweergave al voor u was toen u de coderuimte maakte. Voor uw gemak nemen we de GitHub Copilot-chatextensie op in de containerdefinitie (zie .devcontainer/devcontainer.json). U hebt echter een GitHub Copilot-account nodig (gratis proefversie van 30 dagen beschikbaar).

Enkele tips voor u wanneer u met GitHub Copilot praat:

  • In één chatsessie bouwen de vragen en antwoorden op elkaar voort en kunt u uw vragen aanpassen om het antwoord dat u krijgt af te stemmen.
  • GitHub Copilot heeft standaard geen toegang tot een bestand in uw opslagplaats. Als u vragen wilt stellen over een bestand, opent u het bestand eerst in de editor.
  • Als u GitHub Copilot toegang wilt geven tot alle bestanden in de opslagplaats bij het voorbereiden van de antwoorden, begint u met @workspaceuw vraag. Zie Use the @workspace agent voor meer informatie.
  • In de chatsessie kan GitHub Copilot wijzigingen voorstellen en (met @workspace) zelfs waar de wijzigingen moeten worden aangebracht, maar het is niet toegestaan om de wijzigingen voor u aan te brengen. Het is aan u om de voorgestelde wijzigingen toe te voegen en te testen.

Hier volgen enkele andere dingen die u kunt zeggen om het antwoord dat u krijgt af te stemmen:

  • @workspace Waar is MONGODB_URI gedefinieerd?
  • In welk bestand breng ik de wijziging aan?
  • Breekt deze wijziging mijn app wanneer deze lokaal wordt uitgevoerd?

Volgende stappen