Oefening: implementatiesites maken

12 minuten

Een implementatiesite is een instantie van een web-app waarin u een nieuwe app-versie kunt testen voordat u deze gaat implementeren. U kunt een nieuwe versie van een app zonder downtime implementeren door sites te wisselen.

Stel dat u hebt besloten om Azure-app Service-implementatiesites te gebruiken om de implementatie van nieuwe versies van uw web-app voor sociale media te stroomlijnen. U wilt de web-app instellen in Azure en een of meer implementatiesites configureren.

In deze oefening stelt u een web-app in, voegt u een nieuwe implementatiesite toe voor fasering en implementeert u verschillende versies van de web-app in de productie- en faseringssites.

Belangrijk

U hebt uw eigen Azure-abonnement nodig om deze oefening te kunnen uitvoeren. Dit kan kosten met zich meebrengen. Als u nog geen Azure-abonnement hebt, maakt u een gratis account voordat u begint.

Een webtoepassing maken

Begin met het maken van een nieuwe web-app-resource in Azure Portal.

Meld u aan bij de Azure-portal.
Selecteer een resource maken in het resourcemenu of op de startpagina. Het deelvenster Een resource maken wordt weergegeven.
Selecteer Web in het resourcemenu en selecteer in de resultaten Web App. Het deelvenster Web-app maken wordt weergegeven.

Voer op het tabblad Basisinformatie de volgende waarden in voor elke instelling.

Instelling	Weergegeven als
Projectgegevens
Abonnement	Selecteer het abonnement dat u wilt gebruiken voor deze oefening
Resourcegroep	Selecteer de koppeling Nieuwe maken en voer mslearn-slots in en selecteer OK.
Exemplaardetails
Naam	Voer een unieke naam in.
Publiceren	Code
Runtimestack	ASP.NET V4.8
Besturingssysteem	Vensters
Regio	Selecteer een regio bij u in de buurt.
App Service-plan
Windows-abonnement	Accepteer de standaardwaarde.
SKU en grootte	Accepteer de standaardwaarde.

Selecteer Volgende: Implementatie.
Selecteer Volgende: Netwerken.
Selecteer Volgende: Bewaking en voer de volgende waarde in voor de instelling.

Instelling Weergegeven als

Application Insights

Application Insights inschakelen In-/uitschakelen op Nee
Selecteer Controleren en maken en selecteer vervolgens Maken. Wacht totdat de implementatie is voltooid.
Nadat de implementatie is voltooid, selecteert u Ga naar resource. Het deelvenster App Service voor uw web-app wordt weergegeven.

Instelling	Weergegeven als
Application Insights
Application Insights inschakelen	In-/uitschakelen op Nee

Git-implementatie configureren

Hoewel u veel verschillende hulpprogramma's kunt gebruiken om code te implementeren in uw web-app, stelt u in deze oefening de web-app in voor het gebruik van een lokale Git-opslagplaats.

Selecteer In het App Service-menu onder Implementatie het Implementatiecentrum. Het deelvenster Implementatiecentrum voor uw app-service wordt weergegeven.
Selecteer op het tabblad Instellingen voor Bron de optie Lokale Git en selecteer Opslaan op de opdrachtbalk om uw implementatie in te stellen.
Selecteer het tabblad Lokale Git/FTPS-referenties . Voer onder Gebruikersbereik een unieke gebruikersnaam en wachtwoord van uw keuze in en selecteer vervolgens Opslaan in de opdrachtbalk. Noteer de gebruikersnaam en het wachtwoord voor later.

De Git-client configureren en de broncode van de web-app klonen

Nu gaat u de Git-client instellen in Cloud Shell en deze gebruiken om een voorbeeldweb-app te klonen.

Selecteer in de algemene besturingselementen van Azure boven aan de pagina het Cloud Shell-pictogram om een Azure Cloud Shell-sessie te starten.
Wanneer u hierom wordt gevraagd, selecteert u in de Cloud Shell-sessie de Bash-ervaring en maakt u opslag voor uw abonnement.

Notitie

Voor Cloud Shell is een Azure-opslagresource vereist om alle bestanden die u in Cloud Shell maakt, te behouden. Wanneer u Cloud Shell voor het eerst opent, wordt u gevraagd om een resourcegroep, opslagaccount en Azure Files-share te maken. Deze installatie wordt automatisch gebruikt voor alle toekomstige Cloud Shell-sessies.
Voer de volgende opdracht in de Cloud Shell in, waarbij <u uw gebruikersnaam> vervangt door uw favoriete gebruikersnaam. Deze configuratiewaarde is niet gekoppeld aan een Azure-account, dus u kunt elke gewenste waarde gebruiken.
```
git config --global user.name <your-username>
```
Voer de volgende opdracht in de Cloud Shell in, waarbij <u uw e-mailadres> vervangt door uw favoriete e-mailadres. Deze configuratiewaarde is niet gekoppeld aan een Azure-account, dus u kunt elke gewenste waarde gebruiken.
```
git config --global user.email <your-email-address>
```
Voer de volgende code in om een demoapp map voor de broncode te maken en te openen.
```
mkdir demoapp
cd demoapp
```

Voer de volgende code in om de bron voor de web-app te klonen en uw lokale kopie te openen.

git clone https://github.com/Azure-Samples/app-service-web-dotnet-get-started.git
cd app-service-web-dotnet-get-started

Een externe Git-opslagplaats configureren om de app te implementeren naar productie

We gaan Git gebruiken om de broncode te implementeren in de productiesite van de web-app en vervolgens de Git-URL van uw app in te stellen als een externe opslagplaats.

In Azure Portal moet uw web-app actief zijn. Selecteer Overzicht in het resourcemenu.
In het deelvenster Overzicht voor uw web-app heeft de sectie Essentials een URL in het standaarddomein. De URL bevat uw implementatienaam voor de web-app.

Notitie

Als u geen git-kloon-URL ziet waar deze wordt weergegeven in de vorige schermopname, vernieuwt u de portal.
Beweeg de muisaanwijzer over de Git-kloon-URL en selecteer het pictogram Kopiëren naar klembord . Houd er rekening mee dat deze waarde ook de gebruikersnaam van uw implementatie bevat.
Voer in Cloud Shell de volgende opdracht uit om de externe git te configureren met de naam 'productie'. Vervang <git-clone-URL> door de inhoud die u uit de vorige stap naar het klembord hebt gekopieerd.
```
cd app-service-web-dotnet-get-started
git remote add production <git-clone-url>
```
Voer de volgende opdracht uit om de web-app te implementeren in de productiesite. Wanneer u om het wachtwoord wordt gevraagd, voert u het implementatiewachtwoord in dat u in de vorige taak hebt gemaakt.
```
git push production
```
De terminalsessie identificeert alle processen die plaatsvinden als onderdeel van de implementatie. Wacht totdat de implementatie is voltooid. U ziet nu een melding dat de implementatie is geslaagd .
In Azure Portal moet het deelvenster Overzicht nog steeds actief zijn. Beweeg de muisaanwijzer over de URL. U kunt erop dubbelklikken om het te openen in een nieuw browsertabblad of kopiëren en plakken in een nieuw browsertabblad.
Sluit het tabblad van de browser waarop de web-app wordt weergegeven.

Een nieuwe staging-site maken

Voor uw web-app hebt u één site gemaakt, de productiesite en u hebt broncode geïmplementeerd in deze site. Laten we een implementatiesite maken waarin u nieuwe versies van uw web-app kunt faseerën.

Selecteer In het menu van Azure Portal de optie Start en in Azure-services selecteert u Alle resources. Filter op type == App Service en selecteer Toepassen.
Sorteer het resultaat op type en selecteer vervolgens de App Service die u hebt gemaakt. Het deelvenster App Service voor uw web-app wordt weergegeven.
Selecteer in het App Service-menu onder Implementatie de optie Implementatiesites. Het deelvenster Implementatiesites voor uw App Service wordt weergegeven.
Selecteer + Site toevoegen in de opdrachtbalk. Het deelvenster Een site toevoegen wordt weergegeven.
Voer in het veld Naam fasering in, accepteer de standaardinstellingen voor klooninstellingen en selecteer vervolgens Toevoegen.
Nadat de implementatiesite is gemaakt, selecteert u Sluiten.

Git-implementatie instellen voor de staging-site

We gaan de nieuwe site instellen voor het gebruik van Git-implementatie.

Selecteer in De Azure-portal de startpagina en selecteer vervolgens in Azure-services alle resources.
Sorteer de resources op resourcegroep. voor de resourcegroep mslearn-slots ziet u twee App Service-typen. Implementatiesites worden weergegeven als afzonderlijke apps in de portal.
Selecteer de staging-site. Het deelvenster Overzicht voor uw App Service (site) wordt weergegeven.
Selecteer Implementatiecentrum in het menu Fasering onder Implementatie.
Selecteer op het tabblad Instellingen voor Bron de optie Lokale Git en selecteer Opslaan in de opdrachtbalk om de implementatie voor fasering in te stellen.
Selecteer in het deelvenster Implementatiecentrum het tabblad Lokale Git/FTPS-referenties .
Voer onder Gebruikersbereik een gebruikersnaam en wachtwoord van uw keuze in en selecteer Opslaan. Azure werkt gebruikersreferenties bij. Noteer de gebruikersnaam en het wachtwoord voor later.

Git instellen voor de implementatie van de app naar de staging-site

Als u de Git-client wilt gebruiken om broncode te implementeren in de nieuwe site, gaan we een extra externe versie toevoegen aan de Git-configuratie.

Selecteer Overzicht in het App Service-menu. Als u wordt gevraagd het wachtwoord op te slaan voor de gebruikersnaam die u in de vorige taak hebt gemaakt, selecteert u Opslaan.
Beweeg in het deelvenster Overzicht in de sectie Essentials de muisaanwijzer over de waarde van de Git-kloon-URL en selecteer het pictogram Kopiëren naar klembord. Houd er rekening mee dat de URL de gebruikersnaam voor de faseringsimplementatie bevat.

Notitie

Als u de GIT-kloon-URL niet ziet, vernieuwt u de portal. De Git-kloon-URL voor fasering verschilt enigszins van de URL voor de productiesite en bevat de sitenaam.
Controleer in Cloud Shell of u zich in de map ~/demoapp/app-service-web-dotnet-get-started bevindt en voer vervolgens de volgende opdracht uit, waarbij <u git-clone-URI> vervangt door de URL die u in de vorige stap hebt gekopieerd.
```
git remote add staging <git-clone-uri>
```

De broncode van de app wijzigen en de app implementeren naar de staging-site

Laten we vervolgens een kleine wijziging aanbrengen in de web-app-bestanden en vervolgens Git gebruiken om de nieuwe versie te implementeren in de staging-site:

Voer vanuit Cloud Shell de volgende opdracht uit.
```
code .
```
Vouw in de lijst met BESTANDEN aspnet-get-started>Views>Home-mappen uit en selecteer Index.cshtml.
Zoek de volgende HTML.
```
<h1>ASP.NET</h1>
```
Vervang die code door deze HTML.
```
<h1>Web App Version 2</h1>
```
Druk op Ctrl+S om uw wijzigingen op te slaan en druk op Ctrl+Q om de editor te sluiten.
Voer in Cloud Shell de volgende code uit om de nieuwe versie van de app door te voeren in Git en deze te implementeren in de staging-site.
```
git add .
git commit -m "New version of web app."
git push staging
```
Voer uw implementatiewachtwoord in wanneer u hierom wordt gevraagd. Meldingen van de bewerkingen voor het maken en implementeren van de faseringsweergave in de Cloud Shell-sessie en moeten de implementatie is geslaagd.

Naar de staging-site bladeren

U kunt nu de nieuwe versie van de web-app bekijken door naar de URL voor de staging-implementatiesite te bladeren.

Selecteer In Azure Portal in het deelvenster Overzicht voor de staging-site bladeren in de opdrachtbalk of selecteer de URL in het standaarddomein. De startpagina voor faseringsweb-app versie 2 wordt weergegeven op een browsertabblad.

Gefeliciteerd, u hebt een staging-site gemaakt die een eigen versie van de web-app-code heeft en waarop u tests kunt uitvoeren. Houd er rekening mee dat de productiesite de vorige versie van de web-app heeft en gebruikers uw nieuwe code nog niet kunnen zien.

Doorgaan