Självstudie: Utveckla ASP.NET Core MVC-webbapp med Azure Cosmos DB med hjälp av .NET SDK

GÄLLER FÖR: SQL API

Den här självstudien beskriver hur du använder Azure Cosmos DB för lagring av och åtkomst till data från ett ASP.NET MVC-program som hanteras på Azure. I den här självstudien använder du .NET SDK V3. Följande bild visar den webbsida som du skapar med hjälp av exemplet i den här artikeln:

Om du inte har tid att slutföra den här självstudien kan du ladda ned det fullständiga exempelprojektet från GitHub.

Den här självstudiekursen omfattar:

Förutsättningar

Kontrollera att du har följande resurser innan du följer anvisningarna i den här artikeln:

• Ett aktivt Azure-konto. Om du inte har någon Azure-prenumeration kan du skapa ett kostnadsfritt konto innan du börjar.

  Du kan prova Azure Cosmos DB kostnadsfritt utan en Azure-prenumeration, utan kostnad och åtaganden, eller skapa ett konto på den kostnadsfria Azure Cosmos DB-nivånmed de första 400 RU/s och 5 GB lagringsutrymme kostnadsfritt. Du kan också använda Azure Cosmos DB emulatorn med en URI på https://localhost:8081 . Information om nyckeln som ska användas med emulatorn finns i Autentisera begäranden.

• Visual Studio 2019. Ladda ned och använd den kostnadsfria versionen Visual Studio 2019 Community Edition. Se till att du aktiverar arbetsbelastningen Azure-utveckling under installationen av Visual Studio.

Alla skärmbilder i den här artikeln kommer från Microsoft Visual Studio Community 2019. Om du använder en annan version kanske dina skärmar och alternativ inte matchar helt och hållet. Lösningen bör fungera om du uppfyller kraven.

Steg 1: Skapa ett Azure Cosmos-konto

Vi börjar med att skapa ett Azure Cosmos-konto. Om du redan har Azure Cosmos DB SQL API-konto eller om du använder Azure Cosmos DB Emulator går du vidare till Steg 2: Skapa ett nytt ASP.NET MVC-program.

1. På Azure Portal eller på sidan Start väljer du Skapa en resurs.

2. På sidan Nytt söker du efter och väljer Azure Cosmos DB.

3. På sidan Azure Cosmos DB väljer du Skapa.

4. På sidan Skapa Azure Cosmos DB-konto anger du de grundläggande inställningarna för det nya Azure Cosmos-kontot.

   Inställning	Värde	Beskrivning
   Prenumeration	Prenumerationens namn	Välj den Azure-prenumeration som ska användas för det här Azure Cosmos-kontot.
   Resursgrupp	Namn på resursgrupp	Välj en resursgrupp eller välj Skapa ny och ange sedan ett unikt namn för den nya resursgruppen.
   Account Name	Ett unikt namn	Ange ett namn som identifierar ditt Azure Cosmos-konto. Eftersom documents.azure.com läggs till det namn du anger för att skapa din URI måste du använda ett unikt namn. Namnet får endast innehålla gemener, siffror och bindestreck (-). Det måste vara mellan 3 och 44 tecken långt.
   API	Typ av konto som skapas	Välj Core (SQL) för att skapa en dokumentdatabas och kör frågor med hjälp av SQL-syntax. API:et avgör vilken typ av konto som skapas. Azure Cosmos DB innehåller fem API:er: Core (SQL) och MongoDB för dokumentdata, Gremlin för grafdata, Azure Table och Cassandra. För närvarande måste du skapa ett separat konto för varje API. Läs mer om SQL API.
   Location	Den region som är närmast dina användare	Välj en geografisk plats som värd för ditt Azure Cosmos DB-konto. Använd den plats som är närmast dina användare för att ge dem så snabb åtkomst till data som möjligt.
   Kapacitetsläge	Etablerat dataflöde eller serverlöst	Välj Etablerat dataflöde för att skapa ett konto i etablerat dataflödesläge. Välj Serverlös för att skapa ett konto i serverlöst läge.
   Tillämpa Azure Cosmos DB rabatt på kostnadsfri nivå	Tillämpa eller Tillämpa inte	Med Azure Cosmos DB kostnadsfri nivå får du de första 1 000 RU/s och 25 GB lagringsutrymme kostnadsfritt i ett konto. Läs mer om den kostnadsfria nivån.

   Anteckning

   Du kan ha upp till en kostnadsfri nivå Azure Cosmos DB per Azure-prenumeration och måste välja när du skapar kontot. Om du inte ser alternativet för att tillämpa rabatten på den kostnadsfria nivån innebär det att ett annat konto i prenumerationen redan har aktiverats med den kostnadsfria nivån.

   

5. Konfigurera följande information på fliken Global distribution. Du kan lämna standardvärdena i den här snabbstarten:

   Inställning	Värde	Beskrivning
   Geo-redundans	Inaktivera	Aktivera eller inaktivera global distribution på ditt konto genom att koppla ihop din region med en parregion. Du kan lägga till fler regioner i ditt konto senare.
   Skrivåtgärder för flera regioner	Inaktivera	Med skrivfunktioner för flera regioner kan du dra nytta av det etablerade dataflödet för dina databaser och containrar över hela världen.

   Anteckning

   Följande alternativ är inte tillgängliga om du väljer Serverlös som Kapacitetsläge:

   • Tillämpa rabatt för kostnadsfri nivå
   • Geo-redundans
   • Skrivåtgärder för flera regioner

6. Du kan också konfigurera ytterligare information på följande flikar:

   • Nätverk – Konfigurera åtkomst från ett virtuellt nätverk.
   • Säkerhetskopieringspolicy – Konfigurera princip för regelbunden eller kontinuerlig säkerhetskopiering.
   • Kryptering – Använd antingen en tjänst hanterad nyckel eller en kund hanterad nyckel.
   • Taggar – Taggar är namn-/värdepar som gör att du kan kategorisera resurser och visa konsoliderad fakturering genom att tillämpa samma tagg på flera resurser och resursgrupper.

7. Välj Granska + skapa.

8. Granska kontoinställningarna och välj sedan Skapa. Det tar några minuter att skapa kontot. Vänta tills portalsidan visar meddelandet Distributionen är klar.

   

9. Välj Gå till resurs för att gå till sidan för Azure Cosmos DB-kontot.

   

Gå till Azure Cosmos DB kontosidan och välj Nycklar. Kopiera värdena som ska användas i webbappen som du skapar härnäst.

I nästa avsnitt skapar du ett nytt MVC ASP.NET Core program.

Steg 2: Skapa ett nytt ASP.NET Core MVC-program

1. Öppna Visual Studio och välj Skapa ett nytt projekt.

2. I Skapa ett nytt projekt söker du efter och väljer ASP.NET Core Web Application for C#. Fortsätt genom att välja Nästa.

   

3. I Konfigurera det nya projektet ger du projektet namnet att göra och väljer Skapa.

4. I Skapa ett nytt ASP.NET Core-webbprogram väljer du Webbprogram (Model-View-Controller). Välj Skapa för att fortsätta.

   Visual Studio skapar ett tomt MVC-program.

5. Välj Felsök > Starta felsökning eller F5 för att köra ASP.NET program lokalt.

Steg 3: Lägg till Azure Cosmos DB NuGet-paketet i projektet

Nu när vi har merparten av den ASP.NET Core MVC-ramverkskod som vi behöver för den här lösningen ska vi lägga till de NuGet-paket som krävs för att ansluta till Azure Cosmos DB.

1. I Solution Explorer högerklickar du på projektet och väljer Hantera NuGet-paket.

2. I NuGet Package Manager söker du efter och väljer Microsoft.Azure.Cosmos. Välj installera.

   

   Visual Studio laddar ned och installerar Azure Cosmos DB-paketet och dess beroenden.

   Du kan också använda Package Manager-konsolen för att installera NuGet-paketet. Det gör du genom att välja Tools > NuGet Package Manager Package Manager > Console. Skriv följande kommando i prompten:

   Install-Package Microsoft.Azure.Cosmos
   

Steg 4: Konfigurera MVC ASP.NET Core program

Nu ska vi lägga till modeller, vyer och styrenheter i det här MVC-programmet.

Lägga till en modell

1. I Solution Explorer högerklickar du på mappen Models (Modeller) och väljer Add Class (Lägg till > klass).

2. I Lägg till nytt objekt ger du den nya klassen namnet Item.cs och väljer Lägg till.

3. Ersätt innehållet i klassen Item.cs med följande kod:

   namespace todo.Models
   {
       using Newtonsoft.Json;
   
       public class Item
       {
           [JsonProperty(PropertyName = "id")]
           public string Id { get; set; }
   
           [JsonProperty(PropertyName = "name")]
           public string Name { get; set; }
   
           [JsonProperty(PropertyName = "description")]
           public string Description { get; set; }
   
           [JsonProperty(PropertyName = "isComplete")]
           public bool Completed { get; set; }
       }
   }
   

Azure Cosmos DB använder JSON för att flytta och lagra data. Du kan använda JsonProperty attributet för att styra hur JSON serialiserar och deserialiserar objekt. Klassen Item visar JsonProperty attributet . Den här koden styr formatet för egenskapsnamnet som hamnar i JSON. Den byter även namn på .NET-egenskapen Completed .

Lägg till vyer

Nu ska vi lägga till följande vyer.

• En vy för att skapa objekt
• En vy för borttagningsobjekt
• En vy för att hämta information om ett objekt
• En vy för redigeringsobjekt
• En vy för att lista alla objekt

Skapa objektvy

1. I Solution Explorer högerklickar du på mappen Vyer och väljer Lägg till > ny mapp. Ge mappen namnet Item.

2. Högerklicka på den tomma mappen Objekt och välj sedan Lägg till > vy.

3. I Lägg till MVC-vy gör du följande ändringar:

   • I Vynamn anger du Skapa.
   • I Mall väljer du Skapa.
   • I Modellklass väljer du Objekt (att göra. Modeller).
   • Välj Använd en layoutsida och ange ~/Views/Shared/_Layout.cshtml.
   • Välj Lägg till.

   

4. Välj sedan Lägg till och Visual Studio skapa en ny mallvy. Ersätt koden i den genererade filen med följande innehåll:

   @model todo.Models.Item
   
   @{
       ViewBag.Title = "Create";
       Layout = "~/Views/Shared/_Layout.cshtml";
   }
   
   <h2>Create a new To-Do Item</h2>
   
   
   @using (Html.BeginForm()) 
   {
       @Html.AntiForgeryToken()
       
       <div class="form-horizontal">
           <hr />
           @Html.ValidationSummary(true, "", new { @class = "text-danger" })
           <div class="form-group">
               @Html.LabelFor(model => model.Name, htmlAttributes: new { @class = "control-label col-md-2" })
               <div class="col-md-10">
                   @Html.EditorFor(model => model.Name, new { htmlAttributes = new { @class = "form-control" } })
                   @Html.ValidationMessageFor(model => model.Name, "", new { @class = "text-danger" })
               </div>
           </div>
   
           <div class="form-group">
               @Html.LabelFor(model => model.Description, htmlAttributes: new { @class = "control-label col-md-2" })
               <div class="col-md-10">
                   @Html.EditorFor(model => model.Description, new { htmlAttributes = new { @class = "form-control" } })
                   @Html.ValidationMessageFor(model => model.Description, "", new { @class = "text-danger" })
               </div>
           </div>
   
           <div class="form-group">
               @Html.LabelFor(model => model.Completed, htmlAttributes: new { @class = "control-label col-md-2" })
               <div class="col-md-10">
                   <div class="checkbox">
                       @Html.EditorFor(model => model.Completed)
                       @Html.ValidationMessageFor(model => model.Completed, "", new { @class = "text-danger" })
                   </div>
               </div>
           </div>
   
           <div class="form-group">
               <div class="col-md-offset-2 col-md-10">
                   <input type="submit" value="Create" class="btn btn-default" />
               </div>
           </div>
       </div>
   }
   
   <div>
       @Html.ActionLink("Back to List", "Index")
   </div>
   <script src="~/bundles/jqueryval"></script>
   

Ta bort objektvy

1. Från Solution Explorer högerklickar du på mappen Objekt igen och väljer Lägg till > vy.

2. I Lägg till MVC-vy gör du följande ändringar:

   • I rutan Vynamn skriver du Ta bort.
   • I rutan Mall väljer du Ta bort.
   • I rutan Modellklass väljer du Objekt (todo.Models).
   • Välj Använd en layoutsida och ange ~/Views/Shared/_Layout.cshtml.
   • Välj Lägg till.

3. Välj sedan Lägg till och Visual Studio skapa en ny mallvy. Ersätt koden i den genererade filen med följande innehåll:

   @model todo.Models.Item
   
   @{
       ViewBag.Title = "Delete";
       Layout = "~/Views/Shared/_Layout.cshtml";
   }
   
   <h2>Delete a To-Do Item</h2>
   
   <h3>Are you sure you want to delete this?</h3>
   <div>
       <hr />
       <dl class="dl-horizontal">
           <dt>
               @Html.DisplayNameFor(model => model.Name)
           </dt>
   
           <dd>
               @Html.DisplayFor(model => model.Name)
           </dd>
   
           <dt>
               @Html.DisplayNameFor(model => model.Description)
           </dt>
   
           <dd>
               @Html.DisplayFor(model => model.Description)
           </dd>
   
           <dt>
               @Html.DisplayNameFor(model => model.Completed)
           </dt>
   
           <dd>
               @Html.DisplayFor(model => model.Completed)
           </dd>
       </dl>
   
       @using (Html.BeginForm()) {
           @Html.AntiForgeryToken()
   
           <div class="form-actions no-color">
               <input type="submit" value="Delete" class="btn btn-default" /> |
               @Html.ActionLink("Back to List", "Index")
           </div>
       }
   </div>
   

Lägga till en vy för att hämta information om ett objekt

1. I Solution Explorer högerklickar du på mappen Objekt igen och väljer Lägg till > vy.

2. I Lägg till MVC-vy anger du följande värden:

   • I Vynamn anger du Information.
   • I Mall väljer du Information.
   • I Modellklass väljer du Objekt (att göra. Modeller).
   • Välj Använd en layoutsida och ange ~/Views/Shared/_Layout.cshtml.

3. Välj sedan Lägg till och Visual Studio skapa en ny mallvy. Ersätt koden i den genererade filen med följande innehåll:

   @model todo.Models.Item
   
   <h2>View To-Do Item Details</h2>
   
   <div>
       <h4>Item</h4>
       <hr />
       <dl class="dl-horizontal">
           <dt>
               @Html.DisplayNameFor(model => model.Name)
           </dt>
   
           <dd>
               @Html.DisplayFor(model => model.Name)
           </dd>
   
           <dt>
               @Html.DisplayNameFor(model => model.Description)
           </dt>
   
           <dd>
               @Html.DisplayFor(model => model.Description)
           </dd>
   
           <dt>
               @Html.DisplayNameFor(model => model.Completed)
           </dt>
   
           <dd>
               @Html.DisplayFor(model => model.Completed)
           </dd>
   
       </dl>
   </div>
   <p>
       @Html.ActionLink("Edit", "Edit", new { id = Model.Id }) |
       @Html.ActionLink("Back to List", "Index")
   </p>
   

Lägga till en vy för redigeringsobjekt

1. Från Solution Explorer högerklickar du på mappen Objekt igen och väljer Lägg till > vy.

2. I Lägg till MVC-vy gör du följande ändringar:

   • I rutan Vynamn skriver du Redigera.
   • I rutan Mall väljer du Redigera.
   • I rutan Modellklass väljer du Objekt (todo.Models).
   • Välj Använd en layoutsida och ange ~/Views/Shared/_Layout.cshtml.
   • Välj Lägg till.

3. Välj sedan Lägg till och Visual Studio skapa en ny mallvy. Ersätt koden i den genererade filen med följande innehåll:

   @model todo.Models.Item
   
   <h2>Edit a To-Do Item</h2>
   
   @using (Html.BeginForm())
   {
       @Html.AntiForgeryToken()
       
       <div class="form-horizontal">
           <h4>Item</h4>
           <hr />
           @Html.ValidationSummary(true, "", new { @class = "text-danger" })
           @Html.HiddenFor(model => model.Id)
   
           <div class="form-group">
               @Html.LabelFor(model => model.Name, htmlAttributes: new { @class = "control-label col-md-2" })
               <div class="col-md-10">
                   @Html.EditorFor(model => model.Name, new { htmlAttributes = new { @class = "form-control" } })
                   @Html.ValidationMessageFor(model => model.Name, "", new { @class = "text-danger" })
               </div>
           </div>
   
           <div class="form-group">
               @Html.LabelFor(model => model.Description, htmlAttributes: new { @class = "control-label col-md-2" })
               <div class="col-md-10">
                   @Html.EditorFor(model => model.Description, new { htmlAttributes = new { @class = "form-control" } })
                   @Html.ValidationMessageFor(model => model.Description, "", new { @class = "text-danger" })
               </div>
           </div>
   
           <div class="form-group">
               @Html.LabelFor(model => model.Completed, htmlAttributes: new { @class = "control-label col-md-2" })
               <div class="col-md-10">
                   <div class="checkbox">
                       @Html.EditorFor(model => model.Completed)
                       @Html.ValidationMessageFor(model => model.Completed, "", new { @class = "text-danger" })
                   </div>
               </div>
           </div>
   
           <div class="form-group">
               <div class="col-md-offset-2 col-md-10">
                   <input type="submit" value="Save" class="btn btn-default" />
               </div>
           </div>
       </div>
   }
   
   <div>
       @Html.ActionLink("Back to List", "Index")
   </div>
   
   <script src="~/bundles/jqueryval"></script>
   

Lägga till en vy för att lista alla objekt

Slutligen lägger du till en vy för att hämta alla objekt med följande steg:

1. Från Solution Explorer högerklickar du på mappen Objekt igen och väljer Lägg till > vy.

2. I Lägg till MVC-vy gör du följande ändringar:

   • I rutan Vynamn skriver du Index.
   • I rutan Mall väljer du Lista.
   • I rutan Modellklass väljer du Objekt (todo.Models).
   • Välj Använd en layoutsida och ange ~/Views/Shared/_Layout.cshtml.
   • Välj Lägg till.

3. Välj sedan Lägg till och Visual Studio skapa en ny mallvy. Ersätt koden i den genererade filen med följande innehåll:

   @model IEnumerable<todo.Models.Item>
   
   @{
       ViewBag.Title = "List of To-Do Items";
       Layout = "~/Views/Shared/_Layout.cshtml";
   }
   
   <h2>List of To-Do Items</h2>
   
   <table class="table">
       <tr>
           <th>
               @Html.DisplayNameFor(model => model.Name)
           </th>
           <th>
               @Html.DisplayNameFor(model => model.Description)
           </th>
           <th>
               @Html.DisplayNameFor(model => model.Completed)
           </th>
           <th></th>
       </tr>
   
   @foreach (var item in Model) {
       <tr>
           <td>
               @Html.DisplayFor(modelItem => item.Name)
           </td>
           <td>
               @Html.DisplayFor(modelItem => item.Description)
           </td>
           <td>
               @Html.DisplayFor(modelItem => item.Completed)
           </td>
           <td>
               @Html.ActionLink("Edit", "Edit", new { id=item.Id }) |
               @Html.ActionLink("Details", "Details", new { id=item.Id }) |
               @Html.ActionLink("Delete", "Delete", new { id=item.Id })
           </td>
       </tr>
   }
   
   </table>
   
   <p>
       @Html.ActionLink("Create New", "Create")
   </p>
   

När du har slutfört de här stegen stänger du alla cshtml-dokument i Visual Studio.

Deklarera och initiera tjänster

Först lägger vi till en klass som innehåller logiken för att ansluta till och använda Azure Cosmos DB. I den här självstudien kapslar vi in den här logiken i en klass med namnet CosmosDbService och ett gränssnitt som heter ICosmosDbService . Den här tjänsten gör CRUD-åtgärderna. Dessutom utförs läsfeedåtgärder som att lista ofullständiga objekt, skapa, redigera och ta bort objekten.

1. I Solution Explorer högerklickar du på projektet och väljer Lägg till > ny mapp. Ge mappen namnet Services.

2. Högerklicka på mappen Services (Tjänster) och välj Add Class (Lägg till > klass). Ge den nya klassen namnet CosmosDbService och välj Lägg till.

3. Ersätt innehållet i CosmosDbService.cs med följande kod:

   namespace todo
   {
       using System.Collections.Generic;
       using System.Linq;
       using System.Threading.Tasks;
       using todo.Models;
       using Microsoft.Azure.Cosmos;
       using Microsoft.Azure.Cosmos.Fluent;
       using Microsoft.Extensions.Configuration;
   
       public class CosmosDbService : ICosmosDbService
       {
           private Container _container;
   
           public CosmosDbService(
               CosmosClient dbClient,
               string databaseName,
               string containerName)
           {
               this._container = dbClient.GetContainer(databaseName, containerName);
           }
           
           public async Task AddItemAsync(Item item)
           {
               await this._container.CreateItemAsync<Item>(item, new PartitionKey(item.Id));
           }
   
           public async Task DeleteItemAsync(string id)
           {
               await this._container.DeleteItemAsync<Item>(id, new PartitionKey(id));
           }
   
           public async Task<Item> GetItemAsync(string id)
           {
               try
               {
                   ItemResponse<Item> response = await this._container.ReadItemAsync<Item>(id, new PartitionKey(id));
                   return response.Resource;
               }
               catch(CosmosException ex) when (ex.StatusCode == System.Net.HttpStatusCode.NotFound)
               { 
                   return null;
               }
   
           }
   
           public async Task<IEnumerable<Item>> GetItemsAsync(string queryString)
           {
               var query = this._container.GetItemQueryIterator<Item>(new QueryDefinition(queryString));
               List<Item> results = new List<Item>();
               while (query.HasMoreResults)
               {
                   var response = await query.ReadNextAsync();
                   
                   results.AddRange(response.ToList());
               }
   
               return results;
           }
   
           public async Task UpdateItemAsync(string id, Item item)
           {
               await this._container.UpsertItemAsync<Item>(item, new PartitionKey(id));
           }
       }
   }
   

4. Högerklicka på mappen Services (Tjänster) och välj Add Class (Lägg till > klass). Ge den nya klassen namnet ICosmosDbService och välj Lägg till.

5. Lägg till följande kod i ICosmosDbService-klassen:

   namespace todo
   {
       using System.Collections.Generic;
       using System.Threading.Tasks;
       using todo.Models;
   
       public interface ICosmosDbService
       {
           Task<IEnumerable<Item>> GetItemsAsync(string query);
           Task<Item> GetItemAsync(string id);
           Task AddItemAsync(Item item);
           Task UpdateItemAsync(string id, Item item);
           Task DeleteItemAsync(string id);
       }
   }
   

6. Öppna filen Startup.cs i lösningen och lägg till följande metod InitializeCosmosClientInstanceAsync, som läser konfigurationen och initierar klienten.

   /// <summary>
   /// Creates a Cosmos DB database and a container with the specified partition key. 
   /// </summary>
   /// <returns></returns>
   private static async Task<CosmosDbService> InitializeCosmosClientInstanceAsync(IConfigurationSection configurationSection)
   {
       string databaseName = configurationSection.GetSection("DatabaseName").Value;
       string containerName = configurationSection.GetSection("ContainerName").Value;
       string account = configurationSection.GetSection("Account").Value;
       string key = configurationSection.GetSection("Key").Value;
       Microsoft.Azure.Cosmos.CosmosClient client = new Microsoft.Azure.Cosmos.CosmosClient(account, key);
       CosmosDbService cosmosDbService = new CosmosDbService(client, databaseName, containerName);
       Microsoft.Azure.Cosmos.DatabaseResponse database = await client.CreateDatabaseIfNotExistsAsync(databaseName);
       await database.Database.CreateContainerIfNotExistsAsync(containerName, "/id");
   
       return cosmosDbService;
   }
   

7. I samma fil ersätter du ConfigureServices metoden med:

   public void ConfigureServices(IServiceCollection services)
   {
       services.AddControllersWithViews();
       services.AddSingleton<ICosmosDbService>(InitializeCosmosClientInstanceAsync(Configuration.GetSection("CosmosDb")).GetAwaiter().GetResult());
   }
   

   Koden i det här steget initierar klienten baserat på konfigurationen som en singleton-instans som ska matas in via beroendeinjektion i ASP.NET Core.

   Och se till att ändra MVC-standardstyrenheten Item till genom att redigera vägarna i metoden i samma Configure fil:

    app.UseEndpoints(endpoints =>
          {
                endpoints.MapControllerRoute(
                   name: "default",
                   pattern: "{controller=Item}/{action=Index}/{id?}");
          });
   

8. Definiera konfigurationen i projektets appsettings.json-fil enligt följande kodavsnitt:

   {
     "Logging": {
       "LogLevel": {
         "Default": "Warning"
       }
     },
     "AllowedHosts": "*",
     "CosmosDb": {
       "Account": "<Endpoint URI of your Azure Cosmos account>",
       "Key": "<PRIMARY KEY of your Azure Cosmos account>",
       "DatabaseName": "Tasks",
       "ContainerName": "Item"
     }
   }
   

Lägg till en controller

1. I Solution Explorer högerklickar du på mappen Kontrollanter och väljer Lägg till > kontrollant.

2. I Lägg till scaffold väljer du MVC Controller - Empty (MVC-styrenhet – tom) och väljer Add (Lägg till).

   

3. Ge den nya kontrollanten namnet ItemController.

4. Ersätt innehållet i ItemController.cs med följande kod:

   namespace todo.Controllers
   {
       using System;
       using System.Threading.Tasks;
       using Microsoft.AspNetCore.Mvc;
       using todo.Models;
   
       public class ItemController : Controller
       {
           private readonly ICosmosDbService _cosmosDbService;
           public ItemController(ICosmosDbService cosmosDbService)
           {
               _cosmosDbService = cosmosDbService;
           }
   
           [ActionName("Index")]
           public async Task<IActionResult> Index()
           {
               return View(await _cosmosDbService.GetItemsAsync("SELECT * FROM c"));
           }
   
           [ActionName("Create")]
           public IActionResult Create()
           {
               return View();
           }
   
           [HttpPost]
           [ActionName("Create")]
           [ValidateAntiForgeryToken]
           public async Task<ActionResult> CreateAsync([Bind("Id,Name,Description,Completed")] Item item)
           {
               if (ModelState.IsValid)
               {
                   item.Id = Guid.NewGuid().ToString();
                   await _cosmosDbService.AddItemAsync(item);
                   return RedirectToAction("Index");
               }
   
               return View(item);
           }
   
           [HttpPost]
           [ActionName("Edit")]
           [ValidateAntiForgeryToken]
           public async Task<ActionResult> EditAsync([Bind("Id,Name,Description,Completed")] Item item)
           {
               if (ModelState.IsValid)
               {
                   await _cosmosDbService.UpdateItemAsync(item.Id, item);
                   return RedirectToAction("Index");
               }
   
               return View(item);
           }
   
           [ActionName("Edit")]
           public async Task<ActionResult> EditAsync(string id)
           {
               if (id == null)
               {
                   return BadRequest();
               }
   
               Item item = await _cosmosDbService.GetItemAsync(id);
               if (item == null)
               {
                   return NotFound();
               }
   
               return View(item);
           }
   
           [ActionName("Delete")]
           public async Task<ActionResult> DeleteAsync(string id)
           {
               if (id == null)
               {
                   return BadRequest();
               }
   
               Item item = await _cosmosDbService.GetItemAsync(id);
               if (item == null)
               {
                   return NotFound();
               }
   
               return View(item);
           }
   
           [HttpPost]
           [ActionName("Delete")]
           [ValidateAntiForgeryToken]
           public async Task<ActionResult> DeleteConfirmedAsync([Bind("Id")] string id)
           {
               await _cosmosDbService.DeleteItemAsync(id);
               return RedirectToAction("Index");
           }
   
           [ActionName("Details")]
           public async Task<ActionResult> DetailsAsync(string id)
           {
               return View(await _cosmosDbService.GetItemAsync(id));
           }
       }
   }
   

Attributet ValidateAntiForgeryToken används här för att skydda programmet mot attacker med förfalskning av begäran mellan webbplatser. Dina vyer bör även fungera med den här antiförfalskningstoken. Mer information och exempel finns i Förhindra ATTACKER med förfalskning av begäran mellan webbplatser (CSRF) i ASP.NET MVC-program. Källkoden på GitHub innehåller den fullständiga implementeringen.

Vi använder även attributet Bind på metodparametern för att skydda mot overposting-attacker. Mer information finns i Självstudie: Implementera CRUD-funktioner med Entity Framework i ASP.NET MVC.

Steg 5: Kör programmet lokalt

Använd följande steg för att testa programmet på din lokala dator:

1. Tryck på F5 i Visual Studio för att bygga appen i felsökningsläge. Den ska bygga appen och starta en webbläsare med den tomma rutnätssidan vi såg tidigare:

   

   Om programmet i stället öppnas på startsidan lägger du till /Item i URL:en.

2. Välj länken Skapa ny och lägg till värden i fälten Namn och Beskrivning. Låt kryssrutan Slutfört vara avmarkerad. Om du väljer det lägger appen till det nya objektet i ett slutfört tillstånd. Objektet visas inte längre i den första listan.

3. Välj Skapa. Appen skickar dig tillbaka till vyn Index och objektet visas i listan. Du kan lägga till några fler objekt To-Do listan.

   

4. Välj Redigera bredvid ett objekt i listan. Appen öppnar vyn Redigera där du kan uppdatera alla objektegenskaper, inklusive flaggan Slutfört. Om du väljer Slutfört och väljer Spara visas objektet som slutfört i listan i appen.

   

5. Kontrollera tillståndet för data i Azure Cosmos DB med Cosmos Explorer eller Azure Cosmos DB Emulator är Datautforskaren.

6. När du har testat appen väljer du Ctrl+ F5 för att stoppa felsökningen av appen. Nu är du redo att distribuera!

Steg 6: Distribuera programmet

När hela programmet fungerar som det ska med Azure Cosmos DB är det dags att distribuera webbappen till Azure App Service.

1. Om du vill publicera programmet högerklickar du på projektet i Solution Explorer väljer Publicera.

2. I Välj ett publiceringsmål väljer du App Service.

3. Om du vill använda en App Service profil väljer du Välj befintlig och sedan Publicera.

4. I App Service väljer du en Prenumeration. Använd filtret Visa om du vill sortera efter resursgrupp eller resurstyp.

5. Leta upp din profil och välj sedan OK. Sök sedan efter den Azure App Service som krävs och välj OK.

   

Ett annat alternativ är att skapa en ny profil:

1. Precis som i föregående procedur högerklickar du på projektet i Solution Explorer väljer Publicera.

2. I Välj ett publiceringsmål väljer du App Service.

3. I Välj ett publiceringsmål väljer du Skapa ny och sedan Publicera.

4. I App Service anger du namnet på webbappen och lämplig prenumeration, resursgrupp och värdplan och väljer sedan Skapa.

   

Efter några sekunder publicerar Visual Studio webbappen och startar en webbläsare där du kan se ditt projekt köras i Azure!

Nästa steg

I den här självstudien har du lärt dig hur du skapar ASP.NET Core MVC-webbapp. Programmet kan komma åt data som lagras i Azure Cosmos DB. Du kan nu fortsätta med dessa resurser:

• Partitionering i Azure Cosmos DB
• Komma igång med SQL-frågor
• Så här modellerar och partitionerar du data i Azure Cosmos DB med ett verkligt exempel
• Försöker du göra kapacitetsplanering för en migrering till Azure Cosmos DB? Du kan använda information om ditt befintliga databaskluster för kapacitetsplanering.
  • Om allt du vet är antalet virtuella kärnor och servrar i ditt befintliga databaskluster kan du läsa om att uppskatta enheter för programbegäran med hjälp av virtuella kärnor eller virtuella processorer
  • Om du känner till typiska begärandefrekvenser för din aktuella databasarbetsbelastning kan du läsa om att uppskatta enheter för programbegäran Azure Cosmos DB kapacitetsplaneraren