Självstudie: Distribuera en ASP.NET-app till Azure med Azure SQL Database

Azure App Service en mycket skalbar och självkorrigeringsbar webbvärdtjänst. Den här självstudien visar hur du distribuerar en datadriven ASP.NET-app i App Service och ansluter den till Azure SQL Database. När du är klar har du en ASP.NET som körs i Azure och som är ansluten till SQL Database.

I den här guiden får du lära dig att:

Om du inte har en Azure-prenumerationkan du skapa ett kostnads fritt konto innan du börjar.

Förutsättningar

För att slutföra den här kursen behöver du:

Installera Visual Studio 2022 med arbetsbelastningen ASP.NET och webbutveckling.

Om du redan har installerat Visual Studio lägger du till arbetsbelastningarna i Visual Studio genom att klicka på Verktyg Hämta verktyg > och funktioner.

Ladda ned exemplet

1. Ladda ned exempelprojektet.

2. Extrahera (packa upp) dotnet-sqldb-tutorial-master.zip fil.

Exempelprojektet innehåller en enkel ASP.NET MVC CRUD-app (create-read-update-delete) som använder Entity Framework Code First.

Kör appen

1. Öppna filen dotnet-sqldb-kursen-master/DotNetAppSqlDb.sln i Visual Studio.

2. Skriv Ctrl+F5 för att köra appen utan felsökning. Appen visas i din standardwebbläsare.

3. Välj länken Skapa nytt och skapa några att-göra-objekt.

   

4. Testa länkarna Edit (Redigera), Details (Information) och Delete (Ta bort).

Appen använder en databaskontext för att ansluta till databasen. I det här exemplet använder databaskontexten en anslutningssträng med namnet MyDbConnection. Anslutningssträngen har angetts i filen Web.config och refereras till i filen Models/MyDatabaseContext.cs. Anslutningssträngens namn används senare under självstudien för att ansluta Azure-appen till Azure SQL Database.

Publicera ASP.NET till Azure

1. I Solution Explorer: Högerklicka på projektet DotNetAppSqlDb och välj Publicera.

   

2. Välj Azure som mål och klicka på Nästa.

3. Kontrollera att Azure App Service (Windows) är markerat och klicka på Nästa.

Logga in och lägga till en app

1. I dialogrutan Publicera klickar du på Logga in.

2. Logga in på din Azure-prenumeration. Om du redan är inloggad på ett Microsoft-konto kontrollerar du att kontot tillhör din Azure-prenumeration. Om kontot inte tillhör din Azure-prenumeration klickar du på den för att lägga till rätt konto.

3. I fönstret App Service instanser klickar du på + .

   

Konfigurera webbappnamnet

Du kan behålla det genererade webbappnamnet eller ändra det till ett annat unikt namn (giltiga tecken är a-z, 0-9 och -). Webbappnamnet används som en del av standard-URL:en för din app (<app_name>.azurewebsites.net, där <app_name> är webbappnamnet). Webbappnamnet måste vara unikt inom alla appar i Azure.

Skapa en resursgrupp

En resurs grupp är en logisk behållare där Azure-resurser, till exempel webbappar, databaser och lagrings konton, distribueras och hanteras. Du kan exempelvis välja att ta bort hela resursgruppen i ett enkelt steg längre fram.

1. Klicka på Ny bredvid Resursgrupp.

   

2. Ge resursgruppen namnet myResourceGroup.

Skapa en App Service-plan

En App Service-plan anger plats, storlek och funktioner för webbservergruppen som är värd för din app. Du kan spara pengar när du är värd för flera appar genom att konfigurera webbapparna så att de delar en enda App Service plan.

App Service-planer definierar följande:

• Region (till exempel: Europa, norra; USA, östra; Asien, sydöstra m.m.)
• Instansstorlek (liten, medel eller stor)
• Skalningsantal (1 till 20 instanser)
• SKU (Kostnadsfri, Delad, Basic, Standard eller Premium)

1. Bredvid Värdplan klickar du på Ny.

2. I dialogrutan Konfigurera App Service plan konfigurerar du den nya App Service plan med följande inställningar och klickar på OK:

   Inställning	Föreslaget värde	Mer information
   App Service-plan	myAppServicePlan	App Service planer
   Plats	Europa, västra	Azure-regioner
   Storlek	Kostnadsfri	Prisnivåer

   

3. Klicka på Skapa och vänta tills Azure-resurserna har skapats.

4. Dialogrutan Publicera visar de resurser som du har konfigurerat. Klicka på Finish.

   

Skapa en server och en databas

Innan du skapar en databas behöver du en logisk SQL server. En logisk SQL är en logisk konstruktion som innehåller en grupp databaser som hanteras som en grupp.

1. I dialogrutan Publicera rullar du ned till avsnittet Tjänstberoenden. Bredvid SQL Server Databas klickar du på Konfigurera.

   Anteckning

   Se till att konfigurera SQL Database från sidan Publicera i stället för sidan Anslutna tjänster.

   

2. Välj Azure SQL Database och klicka på Nästa.

3. I dialogrutan Konfigurera Azure SQL Database klickar du på + .

4. Bredvid Databasserver klickar du på Ny.

   Servernamnet används som en del av serverns standard-URL, <server_name>.database.windows.net . Det måste vara unikt för alla servrar i Azure SQL. Ändra servernamnet till ett värde som du vill använda.

5. Lägg till ett användarnamn och lösenord med administratörsbehörighet. För krav på lösenordskomplexitet, se Lösenordsprincip.

   Kom ihåg det här användarnamnet och lösenordet. Du behöver dem för att hantera servern senare.

   

   Viktigt

   Även om ditt lösenord maskeras i anslutningssträngar (i Visual Studio och i App Service) så ökar din apps riskexponering eftersom lösenordet är sparat någonstans. App Service kan använda hanterade tjänstidentiteter till att eliminera den här risken, eftersom du inte behöver ha med några hemligheter alls i koden eller appkonfigurationen. Mer information finns under Nästa steg.

6. Klicka på OK.

7. I dialogrutan Azure SQL Database behåller du det standardgenererade databasnamnet. Välj Skapa och vänta tills databasresurserna har skapats.

   

Konfigurera databasanslutning

1. När guiden har skapat databasresurserna klickar du på Nästa.

2. I Namn på databasanslutningssträng skriver du MyDbConnection. Det här namnet måste överensstämma med den anslutningssträng som refereras till i Models/MyDatabaseContext.cs.

3. I Databasanslutningens användarnamn och Databasanslutningslösenord anger du administratörsanvändarnamnet och administratörslösenordet som du använde i Skapa en server.

4. Kontrollera att Azure App Inställningar är markerat och klicka på Slutför.

   Anteckning

   Om du ser lokala användarhemlighetsfiler i stället måste du ha konfigurerat SQL Database från sidan Anslutna tjänster i stället för sidan Publicera.

   

5. Vänta tills konfigurationsguiden har slutförts och klicka på Stäng.

Distribuera din ASP.NET app

1. På fliken Publicera bläddrar du tillbaka upp till toppen och klickar på Publicera. När din ASP.NET har distribuerats till Azure. Din standardwebbläsare startas med URL:en till den distribuerade appen.

2. Lägg till några att-göra-uppgifter.

   

   Grattis! Din datadrivna ASP.NET-app körs live i Azure App Service.

Få åtkomst till databasen lokalt

Visual Studio kan du enkelt utforska och hantera den nya databasen i Azure i SQL Server Object Explorer. Den nya databasen har redan öppnat sin brandvägg till den App Service-app som du skapade, men för att komma åt den från din lokala dator (till exempel från Visual Studio) måste du öppna en brandvägg för den lokala datorns offentliga IP-adress. Om internetleverantören ändrar din offentliga IP-adress måste du konfigurera om brandväggen så att den får åtkomst till Azure-databasen igen.

Skapa en databasanslutning

1. Gå till Visa-menyn och välj SQL Server Object Explorer.

2. Klicka högst upp i SQL Server Object Explorer på knappen Add SQL Server (Lägg till SQL Server).

Konfigurera databasanslutningen

1. Visa noden Azure i dialogrutan Connect (Anslut). Alla dina SQL Database-instanser i Azure visas här.

2. Välj den databas som du skapade tidigare. Den anslutning som du skapade tidigare fylls i automatiskt längst ned.

3. Ange databasadministratörens lösenord som du skapade tidigare och klicka på Connect (Anslut).

   

Tillåta klientanslutning från datorn

Dialogrutan Create a new firewall rule (Skapa en ny brandväggsregel) öppnas. Som standard tillåter en server endast anslutningar till sina databaser från Azure-tjänster, till exempel din Azure-app. Om du vill ansluta till databasen utanför Azure skapar du en brandväggsregel på servernivå. Brandväggsregeln tillåter din lokala dators offentliga IP-adress.

Dialogrutan är redan ifylld med datorns offentliga IP-adress.

1. Se till att Add my client IP (Lägg till min klient-IP) är markerat och klicka på OK.

   

   När Visual Studio har skapat brandväggsinställningen för SQL Database-instansen visas anslutningen i SQL Server Object Explorer.

   Här kan du utföra de vanligaste databasåtgärderna, till exempel köra frågor, skapa vyer och lagrade procedurer och mycket mer.

2. Expandera anslutningen till > > < databasdatabasen> > Tables. Högerklicka på tabellen Todoes och välj Visa data.

   

Uppdatera app med Code First Migrations

Du kan använda välbekanta verktyg i Visual Studio för att uppdatera din databas och app i Azure. I det här steget använder du Code First Migrations i Entity Framework för att göra en ändring i databasschemat och publicera det i Azure.

Mer information om att använda Entity Framework Code First Migrations finns i artikeln om att komma igång med Entity Framework 6 Code First med MVC 5.

Uppdatera datamodellen

Öppna Models\Todo.cs i kodredigeraren. Lägg till följande egenskap i klassen ToDo:

public bool Done { get; set; }

Kör Code First Migrations lokalt

Kör några kommandon och gör uppdateringar i den lokala databasen.

1. Gå till Verktyg-menyn och klicka på NuGet Package Manager > Package Manager-konsolen.

2. Aktivera Code First Migrations i fönstret Package Manager-konsolen:

   Enable-Migrations
   

3. Lägg till en migrering:

   Add-Migration AddProperty
   

4. Uppdatera den lokala databasen:

   Update-Database
   

5. Skriv Ctrl+F5 för att köra appen. Testa länkarna Edit (Redigera), Details (Information) och Create (Skapa).

Om programmet läses in utan fel har Code First Migrations slutförts. Dock ser sidan fortfarande likadan ut eftersom programlogiken ännu inte använder den nya egenskapen.

Använda den nya egenskapen

Gör några ändringar i koden så att du använder egenskapen Done. För att göra självstudien enklare ska du bara ändra vyerna Index och Create så att du ser hur egenskapen fungerar.

1. Öppna Controllers\TodosController.cs.

2. Leta upp metoden Create() på rad 52 och lägg till Done i egenskapslistan i attributet Bind. När du är klar ser signaturen för metoden Create() ut som följande kod:

   public ActionResult Create([Bind(Include = "Description,CreatedDate,Done")] Todo todo)
   

3. Öppna Views\Todos\Create.cshtml.

4. I Razor-koden bör du se ett <div class="form-group">-element som använder model.Description och sedan ett annat <div class="form-group">-element som använder model.CreatedDate. Direkt efter dessa två element ska du lägga till ett annat <div class="form-group">-element som använder model.Done:

   <div class="form-group">
       @Html.LabelFor(model => model.Done, htmlAttributes: new { @class = "control-label col-md-2" })
       <div class="col-md-10">
           <div class="checkbox">
               @Html.EditorFor(model => model.Done)
               @Html.ValidationMessageFor(model => model.Done, "", new { @class = "text-danger" })
           </div>
       </div>
   </div>
   

5. Öppna Views\Todos\Index.cshtml.

6. Sök efter det tomma <th></th>-elementet. Lägg till följande Razor-kod direkt ovanför det här elementet:

   <th>
       @Html.DisplayNameFor(model => model.Done)
   </th>
   

7. Leta upp <td>-elementet som innehåller hjälpmetoderna Html.ActionLink(). Ovanför detta <td> ska du lägga till ett <td>-element med följande Razor-kod:

   <td>
       @Html.DisplayFor(modelItem => item.Done)
   </td>
   

   Det är allt som krävs för att du ska se ändringarna i vyerna Index och Create.

8. Skriv Ctrl+F5 för att köra appen.

Du kan nu lägga till en att-göra-uppgift och markera Klart. Den ska sedan visas på din startsida som en slutförd uppgift. Kom ihåg att vyn Edit inte innehåller fältet Done eftersom du inte ändrade vyn Edit.

Aktivera Code First Migrations i Azure

Nu när kodändringen fungerar, inklusive databasmigreringen, publicerar du den i din Azure-app och uppdaterar även din SQL Database med Code First Migrations.

1. Precis som tidigare högerklickar du på projektet och väljer Publish (Publicera).

2. Klicka på Fler åtgärder > Redigera för att öppna publiceringsinställningarna.

   

3. I listrutan MyDatabaseContext väljer du databasanslutningen för din Azure SQL Database.

4. Välj Execute Code First Migrations (runs on application start) (Utför Code First Migrations (körs när programmet startar)) och klicka på Save (Spara).

   

Publicera dina ändringar

Nu när du har aktiverat Code First Migrations i Azure-appen kan du publicera kodändringarna.

1. Klicka på Publicera på publiceringssidan.

2. Försök att lägga till uppgifter att göra igen och välj Done (Klar). De ska då visas på din startsida som en slutförd punkt.

   

Alla befintliga att-göra-uppgifter visas fortfarande. När du återpublicerar ASP.NET-appen går inte befintliga data i SQL Database förlorade. Code First Migrations ändrar dessutom endast dataschemat, så att befintliga data lämnas intakta.

Strömma programloggar

Du kan strömma spårningsmeddelanden direkt från din Azure-app till Visual Studio.

Öppna Controllers\TodosController.cs.

Varje åtgärd börjar med en Trace.WriteLine()-metod. Den här koden har lagts till för att visa hur du lägger till spårningsmeddelanden i din Azure-app.

Aktivera loggströmning

1. Välj Cloud Explorer på visa-menyn.

2. I Cloud Explorer expanderar du den Azure-prenumeration som har din app och expanderar App Service.

3. Högerklicka på din Azure-app och markera View Streaming Logs (Visa strömningsloggar).

   

   Loggarna strömmas nu till fönstret Output (Utdata).

   

   Men än ser du inga spårningsmeddelanden. Det beror på att när du väljer View Streaming Logs (Visa strömningsloggar) anges spårningsnivån i Azure-appen till Error, då endast felhändelser loggas (med Trace.TraceError()-metoden).

Ändra spårningsnivåer

1. Om du vill ändra spårningsnivåer för att mata ut andra spårningsmeddelanden går du tillbaka till Cloud Explorer.

2. Högerklicka på din app igen och välj Öppna i portalen.

3. På portalens hanteringssida för din app går du till den vänstra menyn och väljer App Service loggar.

4. Under Application Logging (filsystem) väljer du Utförlig i nivå. Klicka på Spara.

   

   Tips

   Du kan experimentera med olika spårningsnivåer och se vilka typer av meddelanden som visas för varje nivå. Till exempel innehåller informationsnivån alla loggar som skapats av Trace.TraceInformation() , och , men inte loggar som skapats av Trace.TraceWarning() Trace.TraceError() Trace.WriteLine() .

5. Gå till webbläsaren och navigera till appen igen på http://<appens namn >. azurewebsites.net. Försök klicka i programmet med att göra-listan i Azure. Spårningsmeddelanden strömmas nu till fönstret Output (Utdata) i Visual Studio.

   Application: 2017-04-06T23:30:41  PID[8132] Verbose     GET /Todos/Index
   Application: 2017-04-06T23:30:43  PID[8132] Verbose     GET /Todos/Create
   Application: 2017-04-06T23:30:53  PID[8132] Verbose     POST /Todos/Create
   Application: 2017-04-06T23:30:54  PID[8132] Verbose     GET /Todos/Index
   

Stoppa loggströmning

Om du vill avsluta loggströmningstjänsten klickar du på knappen Stop monitoring (Stoppa övervakning) i fönstret Output (Utdata).

Hantera din Azure-app

Gå till Azure Portal för att hantera webbappen. Sök efter och välj App Services.

Välj namnet på din Azure-app.

Du har landat på appens sida.

Som standard visar portalen sidan Översikt. På den här sidan får du en översikt över hur det går för appen. Här kan du också utföra grundläggande hanteringsåtgärder som att bläddra, stoppa, starta, starta om och ta bort. På flikarna till vänster på sidan kan du se olika konfigurationssidor som du kan öppna.

Rensa resurser

I de föregående stegen skapade du Azure-resurser i en resursgrupp. Om du inte tror att du behöver dessa resurser i framtiden, kan du ta bort dem genom att ta bort resursgruppen.

1. Från ditt webbprograms Översiktsida i Azure portal väljer du länken myResourceGroup under resursgruppen.
2. Kontrollera att resurser på resursgruppsidan är de som du vill ta bort.
3. Välj Ta bort, skriv myResourceGroup i textrutan och välj sedan Ta bort.

Nästa steg

I den här självstudiekursen lärde du dig att:

Gå vidare till nästa självstudie där du får lära dig hur du enkelt kan förbättra säkerheten för din Azure SQL Database-anslutning.

Fler resurser:

Vill du optimera och spara på dina molnutgifter?