Öğretici: .NET SDK ASP.NET Core Azure Cosmos DB ile Cosmos MVC web uygulaması geliştirme

UYGULANDıĞı YER: SQL API

Bu öğreticide, Azure'da barındırılan bir Cosmos MVC uygulamasından verileri depolamak ve ASP.NET azure ASP.NET DB'yi nasıl kullanabileceğiniz açıklandı. Bu öğreticide .NET SDK V3'ü kullanırsiniz. Aşağıdaki görüntüde, bu makaledeki örneği kullanarak derlemeniz için web sayfası görüntülenir:

Bu öğretici tarafından oluşturulan todo listesi MVC web uygulamasının ekran görüntüsü - adım adım ASP NET Core MVC öğreticisi

Öğreticiyi tamamlamak için zaman yoksa, öğreticiden örnek projenin GitHub.

Bu öğreticinin içindekiler:

  • Azure Cosmos oluşturma
  • ASP.NET Core MVC uygulaması oluşturma
  • Uygulamayı Azure Cosmos DB'ye bağlama
  • Veri üzerinde oluşturma, okuma, güncelleştirme ve silme (CRUD) işlemleri gerçekleştirme

İpucu

Bu öğreticide, MVC ve ASP.NET Core deneyiminiz olduğu Azure App Service. ASP.NET Core veya önkoşul araçlarına yeni başladıysanız, GitHub'denörnek projenin tam olarak indirmenizi, gerekli NuGet paketlerini eklemenizi ve çalıştırmanız önerilir. Projeyi derlemeden sonra, proje bağlamında kod hakkında içgörü elde etmek için bu makaleyi gözden geçirebilirsiniz.

Önkoşullar

Bu makaledeki yönergeleri takip etmek için aşağıdaki kaynaklara sahip olduğundan emin olun:

Bu makaledeki tüm ekran görüntüleri 2019'Microsoft Visual Studio Community aittir. Farklı bir sürüm kullanıyorsanız ekranlar ve seçenekleriniz tamamen eşleşmez. Önkoşulları karşılarsanız çözümün çalışması gerekir.

1. Adım: Azure Cosmos hesabı oluşturma

Başlangıç olarak bir Azure depolama hesabı Cosmos başlayalım. Zaten bir Azure Cosmos DB SQL API hesabınız varsa veya Azure Cosmos DB Emulator kullanıyorsanız 2. Adım:Yeni bir ASP.NET MVC uygulaması oluşturma adımına atlayabilirsiniz.

  1. Kaynak Azure portal veya Giriş sayfasında Kaynak oluştur'a tıklayın.

  2. Yeni sayfasında Azure veritabanı için arama Cosmos seçin.

  3. Azure veritabanı Cosmos Oluştur'a tıklayın.

  4. Azure Cosmos DB Hesabı Oluştur sayfasında, yeni Azure veritabanı hesabı için temel Cosmos girin.

    Ayar Değer Açıklama
    Abonelik Abonelik adı Bu Azure Cosmos hesabı için kullanmak istediğiniz Azure aboneliğini seçin.
    Kaynak Grubu Kaynak grubu adı Bir kaynak grubu seçin veya Yeni oluştur seçeneğini belirleyin ve yeni kaynak grubu için benzersiz bir ad girin.
    Hesap Adı Benzersiz bir ad Azure Cosmos hesabınızı tanımlayan bir ad girin. URI’nizi oluşturmak için sağladığınız ada documents.azure.com ekleneceği için benzersiz bir ad kullanın.

    Ad yalnızca küçük harf, sayı ve kısa çizgi (-) karakterini içerebilir. 3-44 karakter uzunluğunda olmalıdır.
    API Oluşturulacak hesap türü SQL söz dizimini kullanarak belge veritabanı ve sorgusu oluşturmak için Cekirdek (SQL) seçeneğini belirleyin.

    API, oluşturulacak hesap türünü belirler. Azure Cosmos DB beş API sağlar: Belge verileri için Çekirdek (SQL) ve MongoDB, graf verileri için Gremlin, Azure Tablosu ve Cassandra. Şu anda, her API için farklı bir hesap oluşturmanız gerekir.

    SQL API’si hakkında daha fazla bilgi edinin.
    Konum Kullanıcılarınıza en yakın bölge Azure Cosmos DB hesabınızın barındırılacağı coğrafi konumu seçin. Verilere en hızlı erişimi sağlamak için kullanıcılarınıza en yakın olan konumu kullanın.
    Kapasite modu Sağlanan aktarım hızı veya Sunucusuz Sağlanan aktarım hızı modunda bir hesap oluşturmak için Sağlanan aktarım hızı'ı seçin. Sunucusuz modda bir hesap oluşturmak için Sunucusuz'ı seçin.
    Azure Cosmos DB ücretsiz katmanı indirimini uygulama Uygula veya Uygula Azure Cosmos DB ücretsiz katmanı ile bir hesapta ilk 1000 RU/sn ve 25 GB depolama alanı ücretsiz olarak elde edilir. Ücretsiz katman hakkında daha fazla bilgi.

    Not

    Azure aboneliği başına en fazla bir ücretsiz katman azure Cosmos DB hesabınız olabilir ve hesabı oluştururken kabul etmek zorundasınız. Ücretsiz katman indirimi uygulama seçeneğini görmüyorsanız, bu abonelikte başka bir hesabın ücretsiz katmanla zaten etkinleştirilmiştir.

    Azure Cosmos DB için yeni hesap sayfası

  5. Genel Dağıtım sekmesinde aşağıdaki ayrıntıları yapılandırabilirsiniz. Bu hızlı başlangıç için varsayılan değerleri bırakın:

    Ayar Değer Açıklama
    Coğrafi Yedeklilik Devre Dışı Bırak Bölgenizi bir çift bölgeyle eşleştirerek hesabınız üzerinde genel dağıtımı etkinleştirin veya devre dışı bırakma. Hesabınıza daha sonra daha fazla bölge ekebilirsiniz.
    Birden Çok Bölgeli Yazmalar Devre Dışı Bırak Çok bölgeli yazma özelliği, dünya genelindeki veritabanlarınız ve kapsayıcılar için sağlanan aktarım hızından yararlanmanızı sağlar.

    Not

    Kapasite modu olarak Sunucusuz seçeneğini belirtirsanız aşağıdaki seçenekler kullanılamaz:

    • Ücretsiz Katman İndirimi Uygula
    • Coğrafi yedeklilik
    • Birden Çok Bölgeli Yazmalar
  6. İsteğe bağlı olarak, aşağıdaki sekmelerde ek ayrıntıları yapılandırabilirsiniz:

    • - Sanal ağdan erişimi yapılandırma.
    • Yedekleme İlkesi - Düzenli veya sürekli yedekleme ilkesi yapılandırma.
    • Şifreleme - Hizmet tarafından yönetilen anahtarı veya müşteri tarafından yönetilen anahtarı kullanın.
    • Etiketler- Etiketler, kaynakları kategorilere ayırmayı ve aynı etiketi birden çok kaynağa ve kaynak gruplarına uygulayarak birleştirilmiş faturalamayı görüntülemenizi sağlayan ad/değer çiftleridir.
  7. Gözden geçir ve oluştur’u seçin.

  8. Hesap ayarlarını gözden geçirip Oluştur seçeneğini belirleyin. Hesabın oluşturulması birkaç dakika sürer. Portal sayfasında Dağıtımınız tamamlandı iletisinin görüntülenmesini bekleyin.

    Azure portaldaki Bildirimler bölmesi

  9. Azure Cosmos DB hesabı sayfasına gitmek için Kaynağa git seçeneğini belirleyin.

    Azure Cosmos DB hesabı sayfası

Azure Cosmos DB hesap sayfasına gidin ve anahtarlar' ı seçin. Daha sonra oluşturduğunuz Web uygulamasında kullanılacak değerleri kopyalayın.

Azure Cosmos DB hesabı sayfasında vurgulanan anahtarlar düğmesine sahip Azure portal ekran görüntüsü

Sonraki bölümde yeni bir MVC uygulaması ASP.NET Core oluşturabilirsiniz.

2. Adım: Yeni bir ASP.NET Core MVC uygulaması oluşturma

  1. Yeni Visual Studio'yi açın ve Yeni proje oluştur'a seçin.

  2. Yeni proje oluştur'da C# için ASP.NET Core Web Uygulaması'nın bulun ve seçin. Devam etmek için İleri seçeneğini belirleyin.

    Yeni web ASP.NET Core projesi oluşturma

  3. Yeni projenizi yapılandırma altında projeyi todo olarak adla ve Oluştur'a seçin.

  4. Web Uygulaması için yeni ASP.NET Core içinde Web Uygulaması (Model-View-Controller) 'ı seçin. Devam etmek için Oluştur'a seçin.

    Visual Studio boş bir MVC uygulaması oluşturur.

  5. Hata Ayıklama Başlat Hata Ayıklama > veya F5'i seçerek ASP.NET yerel olarak çalıştırın.

3. Adım: Projeye Azure Cosmos DB NuGet paketi ekleme

Bu çözüm için ihtiyacımız olan ASP.NET Core MVC çerçeve kodunun çoğuna sahip olduğunuza göre, Azure NuGet DB'ye bağlanmak için gereken Cosmos paketleri ek o zaman.

  1. Bu Çözüm Gezgini projenize sağ tıklayın ve Paketleri Yönet'NuGet seçin.

  2. uygulama NuGet Paket Yöneticisi Microsoft.Azure.Cosmos . Yükle'yi seçin.

    Paket NuGet yükleme

    Visual Studio, Azure Cosmos DB paketini ve bağımlılıklarını indirir ve indirir.

    Paket Yöneticisi Konsolu'nu kullanarak da NuGet yükleyebilirsiniz. Bunu yapmak için Araçlar ve > Konsol'NuGet Paket Yöneticisi > Paket Yöneticisi seçin. İstem üzerine aşağıdaki komutu yazın:

    Install-Package Microsoft.Azure.Cosmos
    

4. Adım: ASP.NET Core MVC uygulamasını ayarlama

Şimdi modelleri, görünümleri ve denetleyicileri bu MVC uygulamasına ekleriz.

Model ekleme

  1. Bu Çözüm Gezgini Modeller klasörüne sağ tıklayın ve Sınıf Ekle'yi > seçin.

  2. Yeni Öğe Ekle'de, yeni sınıfınıza Item.cs adını girin ve Ekle'yi seçin.

  3. Item.cs sınıfının içeriğini aşağıdaki kodla değiştirin:

    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, verileri taşımak ve depolamak için JSON kullanır. JsonPropertyJSON'un nesneleri seri hale getirme ve seriden nasıl serileştirmelerini denetleme özniteliğini kullanabilirsiniz. Itemsınıfı özniteliğini JsonProperty gösteriyor. Bu kod, JSON'a giden özellik adının biçimini kontrol eder. Ayrıca .NET özelliğini yeniden Completed adlandırıyor.

Görünümler ekleme

Şimdi aşağıdaki görünümleri ekleriz.

  • Öğe oluşturma görünümü
  • Öğe silme görünümü
  • Öğe ayrıntılarını almak için bir görünüm
  • Öğe düzenleme görünümü
  • Tüm öğeleri listeleye bir görünüm

Öğe görünümü oluşturma

  1. Bu Çözüm Gezgini, Görünümler klasörüne sağ tıklayın ve Yeni Klasör Ekle'yi > seçin. Klasöre Öğe adını girin.

  2. Boş Öğe klasörüne sağ tıklayın ve Görünüm Ekle'yi > seçin.

  3. MVC Görünümü Ekle'de aşağıdaki değişiklikleri yapın:

    • Görünüm adı alanına Oluştur yazın.
    • Şablon'da Oluştur'a seçin.
    • Model sınıfında Öğe (todo) öğesini seçin. Modeller) .
    • Düzen sayfası kullan'ı seçin ve ~/Views/Shared/_Layout.cshtml girin.
    • Add (Ekle) seçeneğini belirleyin.

    MVC Görünümü Ekle iletişim kutusunu gösteren ekran görüntüsü

  4. Ardından Ekle'yi seçin Visual Studio şablon görünümü oluşturmanızı sağlar. Oluşturulan dosyada yer alan kodu aşağıdaki içeriklerle değiştirin:

    @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>
    

Öğe görünümünü silme

  1. Dosyanın Çözüm Gezgini öğe klasörüne sağ tıklayın ve Görünüm Ekle'yi > seçin.

  2. MVC Görünümü Ekle'de aşağıdaki değişiklikleri yapın:

    • Görünüm adı kutusuna Sil yazın.
    • Şablon kutusunda Sil'i seçin.
    • Model sınıfı kutusunda Öğe (todo.Models) seçeneğini belirleyin.
    • Düzen sayfası kullan'ı seçin ve ~/Views/Shared/_Layout.cshtml girin.
    • Add (Ekle) seçeneğini belirleyin.
  3. Ardından Ekle'yi seçin Visual Studio şablon görünümü oluşturmanızı sağlar. Oluşturulan dosyada yer alan kodu aşağıdaki içeriklerle değiştirin:

    @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>
    

Öğe ayrıntılarını almak için görünüm ekleme

  1. Bu Çözüm Gezgini öğesinde Öğe klasörüne yeniden sağ tıklayın ve Görünüm Ekle'yi > seçin.

  2. MVC Görünümü Ekle'de aşağıdaki değerleri ekleyin:

    • Görünüm adı alanına Ayrıntılar girin.
    • Şablon'da Ayrıntılar'ı seçin.
    • Model sınıfında Öğe (todo) öğesini seçin. Modeller) .
    • Düzen sayfası kullan'ı seçin ve ~/Views/Shared/_Layout.cshtml girin.
  3. Ardından Ekle'yi seçin Visual Studio şablon görünümü oluşturmanızı sağlar. Oluşturulan dosyada yer alan kodu aşağıdaki içeriklerle değiştirin:

    @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>
    

Öğe düzenleme görünümü ekleme

  1. Dosyanın Çözüm Gezgini öğe klasörüne sağ tıklayın ve Görünüm Ekle'yi > seçin.

  2. MVC Görünümü Ekle'de aşağıdaki değişiklikleri yapın:

    • Görünüm adı kutusunda Edit yazın.
    • Şablon kutusunda Düzenle'yi seçin.
    • Model sınıfı kutusunda Öğe (todo.Models) seçeneğini belirleyin.
    • Düzen sayfası kullan'ı seçin ve ~/Views/Shared/_Layout.cshtml girin.
    • Add (Ekle) seçeneğini belirleyin.
  3. Ardından Ekle'yi seçin Visual Studio şablon görünümü oluşturmanızı sağlar. Oluşturulan dosyada yer alan kodu aşağıdaki içeriklerle değiştirin:

    @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>
    

Tüm öğeleri listeleye bir görünüm ekleme

Son olarak, aşağıdaki adımlarla tüm öğeleri almak için bir görünüm ekleyin:

  1. Dosyanın Çözüm Gezgini öğe klasörüne sağ tıklayın ve Görünüm Ekle'yi > seçin.

  2. MVC Görünümü Ekle'de aşağıdaki değişiklikleri yapın:

    • Görünüm adı kutusunda Index yazın.
    • Şablon kutusunda Liste'yi seçin.
    • Model sınıfı kutusunda Öğe (todo.Models) seçeneğini belirleyin.
    • Düzen sayfası kullan'ı seçin ve ~/Views/Shared/_Layout.cshtml girin.
    • Add (Ekle) seçeneğini belirleyin.
  3. Ardından Ekle'yi seçin Visual Studio şablon görünümü oluşturmanızı sağlar. Oluşturulan dosyada yer alan kodu aşağıdaki içeriklerle değiştirin:

    @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>
    

Bu adımları tamamlandıktan sonra, aşağıdaki belgelerde yer alan tüm cshtml Visual Studio.

Hizmetleri bildir ve başlat

İlk olarak, Azure veritabanına bağlanma ve azure veritabanı kullanma mantığını içeren bir Cosmos ekley bağlantısı kurabilirsiniz. Bu öğreticide, bu mantığı adlı bir sınıfa ve adlı bir CosmosDbService arabirime kapsülleyebilirsiniz. ICosmosDbService Bu hizmet CRUD işlemlerini yapar. Ayrıca eksik öğeleri listeleme, öğeleri oluşturma, düzenleme ve silme gibi okuma akışı işlemlerini de yapar.

  1. Bu Çözüm Gezgini projenize sağ tıklayın ve Yeni Klasör Ekle'yi > seçin. Klasöre Hizmetler adını girin.

  2. Hizmetler klasörüne sağ tıklayın, Sınıf Ekle'yi > seçin. Yeni sınıfı CosmosDbService olarak adlandırarak Ekle'yi seçin.

  3. CosmosDbService.cs dosyasının içeriğini aşağıdaki kodla değiştirin:

    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. Hizmetler klasörüne sağ tıklayın, Sınıf Ekle'yi > seçin. Yeni sınıfı ICosmosDbService olarak adlandırarak Ekle'yi seçin.

  5. ICosmosDbService sınıfına aşağıdaki kodu ekleyin:

    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. Çözümde Startup.cs dosyasını açın ve yapılandırmayı okuyan ve istemciyi başlatan initializeCosmosClientInstanceAsync yöntemini ekleyin.

    /// <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. Aynı dosyada yöntemini şu ConfigureServices şekilde değiştirin:

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

    Bu adımda yer alan kod, yapılandırmayı temel alarak istemciyi, 'de Bağımlılık ekleme yoluyla tek örnek olarak ASP.NET Core.

    Ayrıca aynı dosyanın yönteminde yolları düzenleyerek varsayılan MVC Denetleyicisini Item Configure olarak değiştirerek emin olun:

     app.UseEndpoints(endpoints =>
           {
                 endpoints.MapControllerRoute(
                    name: "default",
                    pattern: "{controller=Item}/{action=Index}/{id?}");
           });
    
  8. Aşağıdaki kod parçacığında gösterildiği gibi projenin appsettings.json dosyasında yapılandırmayı tanımlayın:

    {
      "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"
      }
    }
    

Denetleyici ekleme

  1. Bu Çözüm Gezgini Denetleyiciler klasörüne sağ tıklayın ve Denetleyici Ekle'yi > seçin.

  2. İskele Ekle'de MVC Denetleyicisi - Boş'a tıklayın ve Ekle'yi seçin.

    İskele Ekle'de MVC Denetleyicisi - Boş öğesini seçin

  3. Yeni denetleyicinize ItemController adını girin.

  4. ItemController.cs içeriğini aşağıdaki kodla değiştirin:

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

ValidateAntiForgeryToken özniteliği, bu uygulamayı siteler arası istek sahteciliği saldırılarına karşı korumaya yardımcı olmak için kullanılır. Görünümlerinizi bu sahtecilik önleme belirteci ile de çalışmanız gerekir. Daha fazla bilgi ve örnek için, bkz. Preventing Cross-Site Request Forgery (CSRF) Attacks in ASP.NET MVC Application. GitHub'da sağlanan kaynak kodu tam uygulamayı içerir.

Ayrıca, aşırı gönderme saldırılarına karşı korumaya yardımcı olmak için yöntem parametresinde Bind özniteliğini kullanıyoruz. Daha fazla bilgi için bkz. Öğretici: MVC'de Entity Framework CRUD İşlevselliği ASP.NET.

5. Adım: Uygulamayı yerel olarak çalıştırma

Uygulamayı yerel bilgisayarınızda test etmek için aşağıdaki adımları kullanın:

  1. Uygulamayı hata ayıklama modunda derlemek Visual Studio F5 tuşuna basın. Bu işlemin uygulamayı oluşturması ve bir tarayıcıyı daha önce gördüğümüz boş kılavuz sayfasıyla başlatması gerekir:

    Bu öğretici tarafından oluşturulan todo listesi web uygulamasının ekran görüntüsü

    Bunun yerine uygulama giriş sayfasını açarsa /Item URL'ye ekleyin.

  2. Yeni Oluştur bağlantısını seçin ve Ad ve Açıklama alanlarına değer ekleyin. Tamamlandı onay kutusunu işaretsiz bırakın. Bunu seçersiniz, uygulama yeni öğeyi tamamlanmış bir durumda ekler. Öğe artık ilk listede görünür.

  3. Oluştur’u seçin. Uygulama sizi Dizin görünümüne geri gönderir ve öğeniz listede görünür. Yeni listenize birkaç öğe daha To-Do.

    Dizin görünümünün ekran görüntüsü

  4. Listede bir Öğe'nin yanındaki Düzenle'yi seçin. Uygulama, Tamamlandı bayrağı dahil olmak üzere nesnenizin herhangi bir özelliğini güncelleştirebilirsiniz Düzenleme görünümünü açar. Tamamlandı'yi ve Kaydet'i seçersiniz, uygulama Öğe'yi listede tamamlandı olarak görüntüler.

    Tamamlandı kutusunun işaretli olduğu Dizin görünümünün ekran görüntüsü

  5. Cosmos Explorer'ı veya Azure Cosmos DB Emulator hizmetini kullanarak Azure Cosmos DB hizmet Veri Gezgini.

  6. Uygulamayı test ettikten sonra Ctrl+F5 tuşlarına basarak uygulamada hata ayıklamayı durdurun. Dağıtıma hazırsınız!

6. Adım: Uygulamayı dağıtma

Artık uygulamanın tamamı Azure Cosmos DB ile doğru şekilde çalıştığına göre, bu web uygulamasını Azure App Service’e dağıtacağız.

  1. Bu uygulamayı yayımlamak için, uygulamanın içinde projeye sağ tıklayın Çözüm Gezgini'ı seçin.

  2. Yayımlama hedefi seçin'de, öğesini seçin App Service.

  3. Mevcut bir profil profili App Service Var Olanı Seç'i ve ardından Yayımla'yı seçin.

  4. Bu App Service abonelik seçin. Kaynak grubuna veya kaynak türüne göre sıralamak için Görünüm filtresini kullanın.

  5. Profilinizi bulun ve Tamam'ı seçin. Ardından gerekli dosyada arama Azure App Service Tamam'ı seçin.

    Visual Studio’da App Service iletişim kutusu

Bir diğer seçenek de yeni profil oluşturmaktır:

  1. Önceki yordamda olduğu gibi, dosyanın içinde projeye sağ tıklayın Çözüm Gezgini'yi seçin.

  2. Yayımlama hedefi seçin'de, öğesini seçin App Service.

  3. Yayımlama hedefi seçin içinde Yeni Oluştur'a ve ardından Yayımla'yı seçin.

  4. Bu App Service Web Uygulaması adını ve uygun aboneliği, kaynak grubunu ve barındırma planını girin, ardından Oluştur'a tıklayın.

    Visual Studio’da App Service’i Oluştur iletişim kutusu

Birkaç saniye içinde Visual Studio web uygulamasını yayımlar ve projenizin Azure'da çalıştırta olduğunu gördüğünüz bir tarayıcıyı başlatıyor!

Sonraki adımlar

Bu öğreticide, MVC web uygulaması için ASP.NET Core nasıl derlemeyi öğrendinsiniz. Uygulamanız Azure Cosmos DB'de depolanan verilere erişebilir. Artık şu kaynaklarla devam edersiniz: